Rumah >hujung hadapan web >tutorial js >Memahami Kata Kunci `ini` dalam JavaScript: Panduan Lengkap
Kata kunci ini dalam JavaScript adalah salah satu aspek bahasa yang paling berkuasa namun sering disalahfahamkan. Nilainya ditentukan oleh bagaimana fungsi dipanggil dan bukannya di mana ia ditakrifkan, menjadikannya penting untuk mengurus konteks dalam kod anda.
Dalam panduan ini, kami akan meneroka nuansa ini dengan contoh praktikal dan menyelami cara mengawalnya secara eksplisit menggunakan panggilan, gunakan dan ikat.
Dalam JavaScript, ini merujuk kepada objek yang sedang melaksanakan kod tersebut. Peraturan untuk menentukan nilainya bergantung pada jenis panggilan fungsi:
Apabila fungsi dipanggil sebagai kaedah objek, ini merujuk kepada objek sebelum titik.
const car = { model: "Tesla", displayModel: function () { console.log(this.model); } }; car.displayModel(); // Output: "Tesla"
Dalam contoh ini, this.model menunjuk kepada sifat model objek kereta kerana kereta ialah pemanggil.
Apabila anda memerlukan kawalan tepat ke atas nilai ini, anda boleh menggunakan panggilan, mohon atau ikat.
Kaedah panggilan serta-merta menggunakan fungsi dengan nilai ini yang ditentukan dan hujah individu.
function greet(greeting, punctuation) { console.log(`${greeting}, ${this.name}${punctuation}`); } const person = { name: "Jack" }; greet.call(person, "Hello", "!"); // Output: "Hello, Jack!"
Di sini, panggilan memastikan this.name merujuk kepada sifat nama objek orang itu.
Kaedah guna adalah serupa dengan panggilan tetapi mengambil argumen sebagai tatasusunan dan bukannya secara individu.
greet.apply(person, ["Hi", "."]); // Output: "Hi, Jack."
Ini menjadikan penggunaan amat berguna apabila anda mempunyai pelbagai hujah untuk dihantar.
Kaedah bind mengembalikan fungsi baharu dengan ini ditetapkan secara kekal kepada objek yang ditentukan, membenarkan seruan tertunda.
const boundGreet = greet.bind(person, "Welcome"); boundGreet("?"); // Output: "Welcome, Jack?"
Dengan bind, anda mencipta fungsi boleh guna semula yang terikat pada konteks tertentu.
Apabila fungsi dipanggil dengan kata kunci baharu, ini merujuk kepada objek baharu yang sedang dibuat.
function Person(name) { this.name = name; } const jack = new Person("Jack"); console.log(jack.name); // Output: "Jack"
Pengendali baharu menetapkan ini kepada objek yang baru dibuat, membolehkan anda menentukan pelan tindakan objek boleh guna semula.
Jika tiada peraturan di atas digunakan, ini akan menjadi lalai kepada objek global. Walau bagaimanapun, dalam mod ketat ('gunakan ketat'), ini tidak ditentukan dalam kes sedemikian.
const car = { model: "Tesla", displayModel: function () { console.log(this.model); } }; car.displayModel(); // Output: "Tesla"
Berhati-hati dengan pengikatan global kerana ia boleh membawa kepada tingkah laku yang tidak diingini.
Berikut ialah perbandingan pantas:
Method | Purpose | Execution | Argument Passing |
---|---|---|---|
call | Immediate invocation | Yes | Individually |
apply | Immediate invocation | Yes | Array of arguments |
bind | Delayed invocation (returns new function) | No | Individually or partially |
Menguasai kata kunci ini adalah penting untuk menulis kod JavaScript yang bersih dan memahami konteks. Dengan memahami ikatan tersirat, eksplisit, baharu dan global, anda boleh mengurus perkara ini dengan yakin merentas pelbagai senario. Alat seperti memanggil, memohon dan mengikat menawarkan kawalan berbutir, menjadikan fungsi anda fleksibel dan boleh digunakan semula.
Ikuti saya di : Github Linkedin
Atas ialah kandungan terperinci Memahami Kata Kunci `ini` dalam JavaScript: Panduan Lengkap. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!