Pemahaman fleksibel tentang penunjuk ini dalam kemahiran JavaScript_javascript

Ini adalah salah satu kata kunci dalam JavaScript Ia sering digunakan semasa menulis atur cara Ia amat penting untuk memahami dan menggunakan kata kunci ini dengan betul. Pertama sekali, mesti dikatakan bahawa titik ini tidak dapat ditentukan apabila fungsi itu ditakrifkan Hanya apabila fungsi itu dilaksanakan, ia boleh ditentukan kepada siapa ini sebenarnya, ini akhirnya menunjuk kepada objek yang memanggilnya (. ayat ini agak Masalah, saya akan menerangkan mengapa ada masalah nanti Walaupun kebanyakan artikel di Internet mengatakan ini, walaupun dalam banyak kes tidak akan ada masalah jika anda memahaminya, sebenarnya, ia tidak tepat untuk difahami. dengan cara itu, jadi sebelum anda memahami Akan ada perasaan tidak dapat memahami perkara ini), jadi saya akan meneroka isu ini secara mendalam seterusnya.

Mengapa anda perlu belajar ini? Jika anda telah mempelajari pengaturcaraan berfungsi atau pengaturcaraan berorientasikan objek, maka anda pasti tahu untuk apa ia digunakan Jika anda belum mempelajarinya, anda tidak perlu membaca artikel ini buat masa ini ia jika anda berminat Lagipun, ini adalah sesuatu yang mesti dikuasai.

Contoh 1:

function a(){
var user = "追梦子";
console.log(this.user); //undefined
console.log(this); //Window
}
a();

Seperti yang kita katakan di atas, ini akhirnya menunjuk kepada objek yang memanggilnya , fungsi a di sini sebenarnya ditunjukkan oleh objek Window, seperti yang boleh dibuktikan oleh kod berikut.

function a(){
var user = "追梦子";
console.log(this.user); //undefined
console.log(this);　　//Window
}
window.a();

Ia adalah sama seperti kod di atas, makluman juga merupakan atribut tetingkap dan juga diklik oleh tetingkap.

Contoh 2:

var o = {
user:"追梦子",
fn:function(){
console.log(this.user); //追梦子
}
}
o.fn();

Ini di sini menunjuk kepada bantahan o, kerana anda memanggil ini fn Ia adalah dilaksanakan melalui o.fn(), jadi titik semula jadi ialah objek o Biar saya tekankan sekali lagi bahawa titik ini tidak boleh ditentukan apabila fungsi itu diciptakan apabila ia dipanggil kepadanya.

Sebenarnya, Contoh 1 dan Contoh 2 tidak cukup tepat Contoh berikut boleh membatalkan teori di atas.

Jika anda ingin memahami sepenuhnya perkara ini, anda mesti membaca beberapa contoh seterusnya

Contoh 3:

var o = {
user:"追梦子",
fn:function(){
console.log(this.user); //追梦子
}
}
window.o.fn();

Kod ini hampir sama dengan kod di atas, tetapi mengapa ini di sini tidak menghala ke tetingkap Jika mengikut teori di atas, akhirnya ini menunjukkan kepada objek yang memanggilnya, di sini? Biar saya mulakan dengan mengatakan sesuatu yang lebih Tetingkap ialah objek global dalam js Pembolehubah yang kita cipta sebenarnya menambah atribut pada tetingkap, jadi kita boleh menggunakan objek tetingkap o di sini.

Jangan jelaskan mengapa ini dalam kod di atas tidak menunjuk ke tetingkap. Mari lihat sekeping kod.

var o = {
a:10,
b:{
a:12,
fn:function(){
console.log(this.a); //12
}
}
}
o.b.fn();

Objek o juga diklik di sini, tetapi ini juga tidak melaksanakannya Kemudian anda pasti akan mengatakan bahawa saya berkata pada permulaan Bukankah itu semua salah? Sebenarnya tidak, cuma apa yang saya katakan pada mulanya adalah tidak tepat Seterusnya saya akan menambah satu ayat saya percaya anda boleh memahami sepenuhnya masalah yang ditunjukkan oleh ini.

Kes 1: Jika terdapat ini dalam fungsi, tetapi ia tidak dipanggil oleh objek peringkat atas, maka ini menunjukkan kepada tetingkap Apa yang perlu dijelaskan di sini ialah dalam strict versi js, ini Ia tidak menunjuk ke tetingkap, tetapi kami tidak akan membincangkan versi yang ketat di sini Jika anda ingin mengetahui lebih lanjut, anda boleh mencari dalam talian.

Kes 2: Jika terdapat ini dalam fungsi, dan fungsi ini dipanggil oleh objek peringkat atas, maka ini menunjukkan kepada objek peringkat atas.

Kes 3: Jika terdapat ini dalam fungsi, fungsi ini mengandungi berbilang objek Walaupun fungsi ini dipanggil oleh objek paling luar, ini hanya menunjuk ke peringkat atasnya, Contoh 3 boleh membuktikan Jika anda tidak percaya, mari kita teruskan melihat beberapa contoh.

var o = {
a:10,
b:{
// a:12,
fn:function(){
console.log(this.a); //undefined
}
}
}
o.b.fn();

Walaupun tiada atribut a dalam objek b, ini juga menunjukkan objek b, kerana ini hanya akan menunjuk ke atasnya Tahap Objek, tidak kira sama ada terdapat sesuatu yang dikehendaki dalam objek ini.

Ada satu lagi kes istimewa, Contoh 4:

var o = {
a:10,
b:{
a:12,
fn:function(){
console.log(this.a); //undefined
console.log(this); //window
}
}
}
var j = o.b.fn;
j();

Ini menunjukkan ke tetingkap , adakah anda sedikit keliru? Malah, ia adalah kerana anda tidak memahami ayat, yang juga penting.

Ini sentiasa menunjuk kepada objek yang memanggilnya terakhir, iaitu, yang memanggilnya apabila ia dilaksanakan Dalam Contoh 4, walaupun fungsi fn dirujuk oleh objek b, apabila fn diberikan nilai Apabila pembolehubah j diberikan, ia tidak dilaksanakan, jadi ia akhirnya menunjuk ke tetingkap Ini berbeza daripada Contoh 3, yang secara langsung melaksanakan fn.

Ini sebenarnya perkara yang sama, tetapi ia akan menunjukkan sesuatu yang berbeza dalam situasi yang berbeza Terdapat beberapa ralat kecil dalam ringkasan di atas, dan ia tidak boleh dikatakan sebagai ralat situasi akan berbeza dalam persekitaran yang berbeza, jadi saya tidak dapat menerangkannya dengan jelas sekaligus, anda hanya boleh mengalaminya secara perlahan-lahan.

Versi pembina ini:

function Fn(){
this.user = "追梦子";
}
var a = new Fn();
console.log(a.user); //追梦子

Sebab mengapa objek a boleh menunjukkan pengguna dalam fungsi Fn adalah kerana kata kunci baharu boleh menukar titik ini dan arahkan ini kepada objek a Mengapa saya katakan a ialah objek Kerana menggunakan kata kunci baharu ialah untuk mencipta objek. Untuk memahami ayat ini, anda boleh memikirkan contoh kami 3. Di sini kami mencipta contoh Fn menggunakan pembolehubah a (bersamaan dengan menyalin salinan Fn ke dalam objek a). hanya dicipta dan tidak dilaksanakan Objek yang memanggil fungsi ini Fn ialah objek a, jadi ini secara semula jadi menunjuk ke objek, jadi mengapa ada pengguna dalam objek Fn Kerana anda telah menyalin salinan fungsi Fn ke objek a, dan menggunakan kata kunci baharu adalah bersamaan dengan menyalin satu.

Sebagai tambahan kepada perkara di atas, kami juga boleh mengubah perkara ini dengan diri kami sendiri Berkenaan mengubah perkara ini sendiri, sila lihat ringkasan kaedah panggilan, gunakan dan ikatan dalam JavaScript. . Artikel ini menerangkan secara terperinci Bagaimana kita menukar penunjuk ini secara manual.

Di atas adalah kandungan memahami secara fleksibel perkara ini yang menunjuk kepada kemahiran _javascript dalam JavaScript Untuk kandungan yang lebih berkaitan, sila beri perhatian kepada tapak web PHP Cina (www.php.cn)!