1. Ini menunjuk pada objek instantiasi konstruktor
Dalam artikel sebelumnya, kami menyebutkan perbedaan antara menggunakan konstruktor yang baru dan tidak memanggil, seperti yang ditunjukkan dalam contoh berikut:
Salinan kode adalah sebagai berikut:
fungsi benjamin (nama pengguna, seks) {
this.username = nama pengguna;
this.sex = seks;
}
var benjamin = Benjamin baru ("zuojj", "laki -laki");
// outputs: Benjamin {sex: "Male", nama pengguna: "zuojj"}
Console.log (Benjamin);
var Ben = Benjamin ("Zhangsan", "Wanita");
// Output: Tidak ditentukan
Console.log (Ben);
Ketika konstruktor disebut sebagai fungsi normal, tidak ada nilai yang dikembalikan, dan ini menunjuk ke objek global. Jadi bagaimana kita bisa menghindari masalah yang disebabkan oleh kurangnya kata kunci baru?
Salinan kode adalah sebagai berikut:
fungsi benjamin (nama pengguna, seks) {
// Periksa apakah "ini" adalah objek "Benjamin"
if (instance dari benjamin) {
this.username = nama pengguna;
this.sex = seks;
}kalau tidak {
mengembalikan Benjamin baru (nama pengguna, seks);
}
}
var benjamin = Benjamin baru ("zuojj", "laki -laki");
// outputs: Benjamin {sex: "Male", nama pengguna: "zuojj"}
Console.log (Benjamin);
var Ben = Benjamin ("Zhangsan", "Wanita");
// outputs: benjamin {username: "zhangsan", sex: "female"}
Console.log (Ben);
Dalam contoh di atas, pertama -tama kami memeriksa apakah ini adalah contoh Benjammin, jika tidak, gunakan yang baru untuk secara otomatis memanggil konstruktor dan instantiate, yang berarti bahwa kami tidak perlu lagi khawatir tentang kehilangan konstruktor instantiasi kata kunci baru. Tentu saja, kita dapat mengembangkan kebiasaan buruk dengan cara ini. Bagaimana jika kita menghindari fenomena ini? Kita bisa melempar kesalahan seperti ini:
Salinan kode adalah sebagai berikut:
fungsi benjamin (nama pengguna, seks) {
// Periksa apakah "ini" adalah objek "Benjamin"
if (instance dari benjamin) {
this.username = nama pengguna;
this.sex = seks;
}kalau tidak {
// Jika tidak, lemparkan kesalahan.
Lempar kesalahan baru ("` Benjamin` dipanggil tanpa `new`");
}
}
2. Ini menunjuk pada objek yang memanggil fungsi
Lihat contoh berikut:
Salinan kode adalah sebagai berikut:
var x = 10;
var obj = {
X: 10,
output: function () {
// Output: Benar
Console.log (ini === OBJ);
kembalikan this.x;
},
innerrobj: {
X: 30,
output: function () {
// Output: Benar
console.log (ini === obj.innerobj);
kembalikan this.x;
}
}
};
// Output: 10
console.log (obj.output ());
// Output: 30
console.log (obj.innerobj.output ());
3. Ini menunjuk pada objek global
Saat membahas konstruktor di atas, kami juga membahas bahwa ketika baru tidak berlaku, ini akan menunjuk pada objek global. Mari kita lihat dua contoh umum yang rentan terhadap kesalahan:
Salinan kode adalah sebagai berikut:
var x = 100;
var obj = {
X: 10,
output: function () {
(fungsi() {
// Output: Benar
console.log (ini === Jendela);
// Output: Dalam: 100
console.log ("dalam:" + this.x);
}) ();
kembalikan this.x;
}
};
// Output: 10
console.log (obj.output ());
Saat menggunakan penutupan, ruang lingkup berubah, dan ini menunjuk ke jendela (di browser).
Salinan kode adalah sebagai berikut:
var x = 100;
var obj = {
X: 10,
output: function () {
kembalikan this.x;
}
};
output var = obj.output;
// Output: 10
console.log (obj.output ());
// Output: 100
console.log (output ());
var obj2 = {
X: 30,
Output: Obj.Output
}
// Output: 30
console.log (obj2.output ());
Pada saat ini ini selalu menunjuk pada objek pada saat panggilan fungsi.
4. Ini menunjuk ke objek yang ditetapkan oleh metode Apply/Call ()
Salinan kode adalah sebagai berikut:
var x = 100;
var obj = {
X: 10,
output: function () {
kembalikan this.x;
}
};
// Output: 10
console.log (obj.output ());
var obj2 = {
X: 40,
Output: Obj.Output
}
// Output: 40
console.log (obj.output.call (obj2));
// Output: 10
console.log (obj2.output.Apply (obj));
5. Ini dari fungsi callback menunjuk ke objek yang ditunjukkan oleh fungsi ini yang memanggil panggilan balik.
Salinan kode adalah sebagai berikut:
// <input type = "text" value = "3" id = "txt_username">
$ ("#username"). on ("click", function () {
Console.log (this.value);
});
6. Ini di function.prototype.bind
Metode Bind () menciptakan fungsi baru yang, ketika dipanggil, memiliki kata kunci ini yang disetel ke nilai yang disediakan, dengan urutan argumen yang diberikan sebelumnya yang disediakan ketika fungsi baru dipanggil.
Contoh 1:
Salinan kode adalah sebagai berikut:
function person () {
kembalikan nama ini;
}
//Function.prototype.bind
var per = person.bind ({
Nama: "Zuojj"
});
console.log (per);
var obj = {
Nama: "Ben",
orang: orang,
per: per
};
// Output: Ben, Zuojj
console.log (obj.person (), obj.per ());
Contoh 2:
Salinan kode adalah sebagai berikut:
this.x = 9;
var module = {
X: 81,
getx: function () {return this.x; }
};
// Output: 81
console.log (module.getx ());
var getx = module.getx;
// Output: 9, karena dalam hal ini, "ini" mengacu pada objek global
console.log (getx);
// Buat fungsi baru dengan 'ini' terikat ke modul
var boundgetx = getx.bind (modul);
// Output: 81
console.log (boundgetx ());