Tutorial pengenalan minimalis JavaScript (2): objek dan kemahiran functions_javascript

Membaca artikel ini memerlukan pengalaman pengaturcaraan dalam bahasa lain.

Jenis ringkas dalam JavaScript termasuk:

1 2. Rentetan
3.Boolean (benar dan salah)
4.null
5. tidak ditentukan

Semua jenis lain ialah objek (jangan tertipu dengan nilai pulangan operator jenis), contohnya:

1. Fungsi

2. Tatasusunan
3. Ekspresi biasa
4. Objek (objek adalah objek semula jadi)

Asas Objek

Dalam JavaScript, objek ialah koleksi atribut (objek ialah tatasusunan bersekutu Setiap atribut termasuk:

).

1. Nama atribut, mestilah rentetan

2. Nilai atribut, yang boleh berupa sebarang nilai kecuali
tidak ditentukan

Buat objek daripada literal objek:

Salin kod Kod adalah seperti berikut:

//Buat objek kosong melalui objek literal {}
var empty_object = {};

Nama atribut dan nilai atribut objek:

Salin kod Kod adalah seperti berikut:

var stooge = {
// "nama pertama" ialah nama atribut, "Jerome" ialah nilai atribut
"nama pertama": "Jerome",
// "nama akhir" ialah nama atribut, "Howard" ialah nilai atribut
"last-name": "Howard"
};

Jika nama atribut ialah pengecam yang sah, petikan boleh ditinggalkan:

Salin kod Kod adalah seperti berikut:

var penerbangan = {
syarikat penerbangan: "Oceanic",
Nombor: 815,
berlepas: {
IATA: "SYD",
Masa: "2004-09-22 14:55",
         bandar: "Sydney"
},
ketibaan: {
IATA: "LAX",
Masa: "2004-09-23 10:42",
Bandar: "Los Angeles"
}
};

Mari kita lihat contoh akses harta benda:

Salin kod Kod adalah seperti berikut:

var owner = { name: "Name5566" };

owner.name; // "Nama5566"
pemilik ["nama"]; // "Nama5566"

owner.job; // undefined
owner.job = "coder"; // atau owner["job"] = "coder";

Jika nama atribut bukan pengecam yang sah, ia perlu dibalut dengan petikan. Harta yang tidak wujud mempunyai nilai yang tidak ditentukan. Objek diluluskan melalui rujukan dan bukannya nilai:

Salin kod Kod adalah seperti berikut:

var x = {};
var pemilik = x;
owner.name = "Nama5566";
x.name; // x.name === "Nama5566"

Di sini x dan pemilik merujuk kepada objek yang sama.

Sifat objek boleh dipadamkan menggunakan operator padam:

Salin kod Kod adalah seperti berikut:

padam obj.x; // Padam atribut x bagi objek obj

Prototaip objek

Setiap objek dipautkan kepada objek prototaip dan objek boleh mewarisi sifat daripada objek prototaip. Kami mencipta objek melalui objek literal, dan objek prototaipnya ialah objek Object.prototype (Object.prototype object itu sendiri tidak mempunyai objek prototaip). Apabila kita mencipta objek, kita boleh menetapkan objek prototaip objek (kita akan membincangkan kaedah tetapan khusus kemudian). Apabila cuba untuk mendapatkan (bukan mengubah suai) sifat objek, jika harta itu tidak wujud pada objek, JavaScript akan cuba mendapatkan harta daripada objek prototaip objek Jika harta itu tidak wujud dalam objek prototaip , kemudian dari objek prototaip Objek prototaip dicari, dan seterusnya, sehingga objek prototaip Object.prototype. Berbanding dengan mendapatkan atribut, apabila kita mengubah suai atribut tertentu objek, ia tidak akan menjejaskan objek prototaip.

Asas Fungsi

Dalam JavaScript, fungsi juga merupakan objek, yang dipautkan kepada objek prototaip Function.prototype (Function.prototype dipautkan ke Object.prototype). Fungsi mempunyai sifat bernama prototaip, dan jenis nilainya ialah objek Objek ini mempunyai pembina sifat, dan nilai pembina ialah fungsi ini:

Salin kod Kod adalah seperti berikut:

var f = function() {}

jenis f.prototaip; // 'objek'
typeof f.prototype.constructor; // 'fungsi'

f === f.prototype.constructor; // benar

Fungsi ialah objek Anda boleh menggunakan fungsi sama seperti objek, maksudnya, fungsi boleh disimpan dalam pembolehubah dan tatasusunan, dihantar ke fungsi sebagai parameter, dan fungsi boleh ditakrifkan di dalam fungsi. Sebagai nota sampingan, fungsi mempunyai dua sifat tersembunyi:

1. Konteks fungsi
2. Kod fungsi

Fungsi dicipta seperti berikut:

Salin kod Kod adalah seperti berikut:

var f = fungsi tambah(a, b) {
Kembalikan b;
}

console.log(f); // Output [Fungsi: tambah]

Nama fungsi selepas fungsi kata kunci adalah pilihan Kami merumuskan nama fungsi terutamanya untuk beberapa tujuan:

1. Untuk panggilan rekursif
2. Digunakan oleh penyahpepijat, alat pembangunan, dsb. untuk mengenal pasti fungsi

Banyak kali kita tidak memerlukan nama fungsi Fungsi tanpa nama fungsi dipanggil fungsi tanpa nama. Senarai parameter disertakan dalam kurungan. JavaScript tidak memerlukan parameter sebenar dan parameter formal untuk dipadankan, contohnya:

Salin kod Kod adalah seperti berikut:

var add = function(a, b) {
Kembalikan b;
}

add(1, 2, 3); // Parameter sebenar dan parameter formal tidak sepadan

Jika terdapat terlalu banyak parameter sebenar, parameter sebenar tambahan akan diabaikan Jika terdapat terlalu sedikit parameter sebenar, nilai parameter formal yang tidak ditetapkan akan tidak ditentukan. Fungsi mesti mempunyai nilai pulangan Jika nilai pulangan tidak ditentukan melalui penyata pulangan, nilai pulangan fungsi tidak ditentukan.

Fungsi dan pembolehubah luaran yang diaksesnya membentuk penutupan. Ini adalah keindahan utama JavaScript.

Panggilan fungsi

Apabila setiap fungsi dipanggil, ia akan menerima dua parameter tambahan:

1.ini
2.hujah

Nilai ini berkaitan dengan mod panggilan tertentu Terdapat empat mod panggilan dalam JavaScript:

1. Mod panggilan kaedah. Jika sifat sesuatu objek ialah fungsi, ia dipanggil kaedah. Jika kaedah dipanggil melalui o.m(args), ini ialah objek o (boleh dilihat bahawa ini dan o hanya terikat apabila panggilan dibuat), contohnya:

Salin kod Kod adalah seperti berikut:

var obj = {
Nilai: 0,
kenaikan: fungsi(v) {
This.value = (jenis v === 'nombor' ? v : 1);
}
};
obj.increment(); // this === obj

2. Mod panggilan fungsi. Jika fungsi bukan sifat objek, ia akan dipanggil sebagai fungsi dan ini akan terikat pada objek global, contohnya:

Salin kod Kod adalah seperti berikut:

mesej = 'Hello World';
var p = function() {
console.log(this.message);
}

p(); // Output 'Hello World'

Tingkah laku ini kadangkala mengelirukan, mari lihat contoh:

Salin kod Kod adalah seperti berikut:

obj = {
Nilai: 0,
kenaikan: function() {
        var helper = function() {
                     // Tambahkan 1 pada nilai dalam objek global
This.value = 1;
}

               // pembantu dipanggil sebagai fungsi
// Oleh itu ini adalah objek global
        pembantu();
}
};

obj.increment(); // obj.value === 0

Hasil yang diingini hendaklah:

Salin kod Kod adalah seperti berikut:

obj = {
Nilai: 0,
kenaikan: function() {
        var that = this;
        var helper = function() {
That.value = 1;
}

        pembantu();
}
};

obj.increment(); // obj.value === 1

3. Mod panggilan Pembina. Fungsi yang dimaksudkan untuk diawali dengan baharu dipanggil pembina, contohnya:

Salin kod Kod adalah seperti berikut:

// Ujian dipanggil pembina
var Ujian = fungsi(rentetan) {
This.message = string;
}

var myTest = Ujian baharu("Hello World");

Fungsi boleh dipanggil dengan menambah baharu di hadapannya (fungsi sedemikian biasanya bermula dengan huruf besar Selepas menambah baharu, objek yang dipautkan kepada sifat prototaip fungsi ini akan dibuat, dan ini dalam pembina akan). menjadi objek ini.

4.gunakan mod panggilan. Kaedah penggunaan fungsi digunakan untuk memanggil fungsi, yang mempunyai dua parameter, yang pertama ialah ini, dan yang kedua ialah tatasusunan parameter, contohnya:

Salin kod Kod adalah seperti berikut:

var add = function(a, b) {
Kembalikan b;
}

var ret = add.apply(null, [3, 4]); // ret === 7

Apabila fungsi dipanggil, kami boleh mengakses tatasusunan kelas bernama argumen (bukan tatasusunan JavaScript sebenar), yang mengandungi semua parameter sebenar, supaya kami boleh melaksanakan parameter panjang berubah:

Salin kod Kod adalah seperti berikut:

var add = function() {
var sum = 0;
untuk (var i=0; i         jumlah = hujah[i];
}
Pulangan jumlah;
}

tambah(1, 2, 3, 4);

Pengecualian

Sekarang mari kita bincangkan tentang mekanisme pengendalian pengecualian JavaScript. Kami menggunakan pernyataan lontaran untuk membuang pengecualian dan pernyataan cuba-cache untuk menangkap dan mengendalikan pengecualian:

Salin kod Kod adalah seperti berikut:

var add = fungsi (a, b) {
Jika (jenis a !== 'nombor' || jenis b !== 'nombor') {
// ​ pengecualian lontaran
baling {
nama: 'TypeError',
                mesej: 'tambah keperluan nombor'
        };
}
Kembalikan b;
}

//Tangkap dan kendalikan pengecualian
cuba {
Tambah("tujuh");
// e ialah objek pengecualian yang dilemparkan
} tangkap (e) {
console.log(e.name ': ' e.message);
}

Tambahkan sifat pada jenis JavaScript

Pembina wujud untuk kebanyakan jenis dalam JavaScript:

1. Pembina objek ialah Objek
2. Pembina tatasusunan ialah Array
3. Pembina fungsi ialah Fungsi
4. Pembina rentetan ialah String
5. Pembina nombor ialah Nombor
6. Pembina Boolean ialah Boolean
7. Pembina ungkapan biasa ialah RegExp

Kami boleh menambah sifat (selalunya kaedah) pada prototaip pembina untuk menjadikan sifat ini tersedia kepada pembolehubah yang berkaitan:

Salin kod Kod adalah seperti berikut:

Number.prototype.integer = function() {
Kembalikan Matematik[ini < 0 ? }

(1.1).integer(); // 1

Skop

JavaScript memerlukan fungsi untuk membina skop:

Salin kod Kod adalah seperti berikut:

fungsi() {
// ...
}();

Fungsi tanpa nama dicipta dan dilaksanakan di sini. Anda boleh menyembunyikan pembolehubah yang anda tidak mahu dedahkan melalui skop:

Salin kod Kod adalah seperti berikut:

var obj = function() {
//Sembunyikan nilai, tidak boleh diakses dari luar
nilai var = 0;

Kembali {
// Hanya kaedah ini boleh mengubah suai nilai
kenaikan: function() {
nilai = 1;
},
// Hanya kaedah ini boleh membaca nilai
         getValue: function() {
              nilai pulangan;
}
};
}();

obj.increment();
obj.getValue() === 1;

Warisi

Terdapat banyak cara untuk melaksanakan warisan dalam JavaScript.

Apabila mencipta objek, kami boleh menetapkan objek prototaip yang dikaitkan dengan objek Kami melakukan ini:

Salin kod Kod adalah seperti berikut:

//Buat objek o yang objek prototaipnya ialah {x:1, y:2}
var o = Object.create({x:1, y:2});

Kaedah Object.create ditakrifkan dalam ECMAScript 5. Jika anda menggunakan ECMAScript 3, anda boleh melaksanakan kaedah cipta sendiri:

Salin kod Kod adalah seperti berikut:

// Jika kaedah Object.create tidak ditakrifkan
if (typeof Object.create !== 'function') {
// Cipta kaedah Object.create
Object.create = fungsi (o) {
var F = fungsi () {};
          F.prototaip = o;
​​​​ //Buat objek baharu, objek prototaip objek ini ialah o
          kembalikan F();
baharu };
}

Melalui kaedah Object.create kami melakukan pewarisan berasaskan prototaip: objek baharu secara langsung mewarisi sifat objek lama (berbanding dengan warisan berasaskan kelas, tidak perlu kewujudan kelas dan objek secara langsung mewarisi objek). Contoh:

Salin kod Kod adalah seperti berikut:

var myMammal = {
nama: 'Herb the Mamalia',
Get_name: function() {
         kembalikan this.name;
},
berkata: function() {
          kembalikan ini.kata || }
};

// Warisi myMammal
var myCat = Object.create(myMammal);
myCat.name = 'Henrietta';
myCat.saying = 'meow';
myCat.purr = fungsi(n) {
var i, s = '';
untuk (i = 0; i < n; i = 1) {
          jika (s) {
          s = '-';
}
        s = 'r';
}
Kembali s;
};
myCat.get_name = function() {
Kembalikan this.says() ' ' this.name ' ' this.says();
};

Kod di atas sangat mudah, tetapi ia tidak dapat melindungi ahli persendirian. Kita boleh menggunakan corak modul. Dalam corak modul, jenis objek tertentu dijana oleh fungsi dan skop fungsi digunakan untuk melindungi ahli persendirian daripada akses luaran:

Salin kod Kod adalah seperti berikut:

// fungsi mamalia, digunakan untuk membina objek mamalia
var mamalia = fungsi(spesifikasi) {
// iaitu objek yang dibina
var that = {};

// Kaedah awam get_name boleh diakses secara luaran
That.get_name = function() {
// spec.name tidak boleh diakses terus dari luar
         pulangkan spec.name;
};

// Kaedah awam mengatakan boleh diakses secara luaran
That.says = function() {
// spec.saying tidak boleh diakses terus dari luar
          kembalikan spesifikasi || };

Kembalikan itu;
};

//Buat objek mamalia
var myMammal = mamalia({nama: 'Herb'});

//fungsi kucing, digunakan untuk membina objek kucing
var cat = fungsi(spesifikasi) {
spec.saying = spec.saying ||
// kucing mewarisi daripada mamalia, jadi objek mamalia dibina dahulu
var that = mamalia(spec);

// Tambahkan purr kaedah awam
That.purr = fungsi(n) {
        var i, s = '';
untuk (i = 0; i < n; i = 1) {
                  jika (s) {
                s = '-';
            }
          s = 'r';
}
        kembali s;
};

// Ubah suai kaedah awam get_name
That.get_name = function() {
          return that.says() ' ' spec.name
' ' itu.berkata();
         pulangkan itu;
};
};

//Buat objek kucing
var myCat = kucing({nama: 'Henrietta'});



Dalam corak modul, pewarisan dicapai dengan memanggil pembina. Selain itu, kita juga boleh mengakses kaedah kelas induk dalam subkelas:

Salin kod Kod adalah seperti berikut:

Object.prototype.superior = Funktion(Name) {
    var that = this, method = that[name];
    return function() {
        return method.apply(that, arguments);
    };
};
 
var coolcat = Funktion (Spezifikation) {
    // 获取子类的 get_name 方法
    var that = cat(spec), super_get_name = that.superior('get_name');
    that.get_name = function(n) {
        return 'like ' super_get_name() ' baby';
    };
    gib das zurück;
};