Penjelasan terperinci tentang penggunaan kata kunci ini di JavaScript

Ini adalah objek khusus di dalam fungsi. Ini mengacu pada objek lingkungan berdasarkan fungsi yang dieksekusi (kami akan membuat penjelasan tambahan di akhir artikel). Nilai ini tidak pasti sebelum memanggil fungsi. Metode panggilan yang berbeda akan menyebabkan nilai ini berubah.

 window.num = 22; var o = {num: 11}; function Saynum () {alert (this.num)} saynum (); // 22o.saynum = saynum; o.saynum (); // 11

Ingat: Nama fungsi hanyalah variabel yang berisi pointer. Oleh karena itu, bahkan jika dieksekusi di lingkungan yang berbeda, fungsi global saynum () masih merupakan fungsi yang sama dengan O.Saynum ().

1. Saat memanggil fungsi dalam lingkup global

Dipanggil dalam ruang lingkup global, objek ini mengacu pada jendela

Eksekusi fungsi anonim bersifat global, jadi objek ini biasanya menunjuk ke jendela juga.

 fungsi fn1 () {console.log (this);} fn1 ();

2. Dipanggil melalui operator baru

Ini merujuk objek instan

 function person (name) {this.name = name;} person.prototype.printname = function () {waspada (this.name); // byron}; var p1 = orang baru ('byron');

3. Metode Panggilan sebagai Objek

Ini merujuk objek

 var obj1 = {name: 'byron', fn: function () {console.log (this); }}; obj1.fn ();

4. Panggilan tidak langsung

hubungi dan lamar

Setiap fungsi berisi dua metode yang tidak dijamin: call () dan apply (). Tujuan dari kedua metode ini adalah untuk memanggil fungsi dalam ruang lingkup tertentu, yang sebenarnya setara dengan menetapkan nilai objek ini dalam badan fungsi. Dengan kata lain, fungsinya dipanggil secara langsung, dan lingkungan eksekusi ditentukan saat menelepon

 window.color = 'red'; var o = {color: 'blue'}; function Saycolor () {waspada (this.color);} waycolor.call (this); // redsaycolor.call (window); // redsaycolor.call (o); // biru

(1) Terapkan metode

Menerima dua parameter, satu adalah ruang lingkup fungsi yang berjalan dalam fungsi, dan yang lainnya adalah array parameter.

(2) Metode panggilan

Metode panggilan sama dengan metode Apply, perbedaannya adalah bahwa metode penerima parameter berbeda. Untuk metode panggilan, parameter pertama adalah bahwa nilai ini tidak berubah, dan perubahannya adalah bahwa parameter lain secara langsung diteruskan ke fungsi.

 function fn () {console.log (this) // windwow function innerfn () {console.log (this)} innerfn.call (this) // window} fn (); fungsi fn0 () {console.log (this) // window} function fn1 () {fn0.call (this); console.log (this); // window} fn1 (); function fn0 () {console.log (this) // objek} var o = {fn1: function fn1 () {fn0.call (this); console.log (this); // objek}} o.fn1 ();

5. Metode Besar

Metode ini membuat instance fungsi yang nilainya terikat pada nilai yang diteruskan ke fungsi Bind (). Dengan kata lain, fungsi baru akan dikembalikan dan ini di dalam fungsi akan menjadi parameter pertama yang dilewati.

 window.color = 'red'; var o = {color: 'blue'}; function Saycolor () {waspada (this.color)} var objeksaycolor = waycolor.bind (o); objectsaycolor (); // blue

Catatan Tambahan: Jalankan Definisi Lingkungan

Mendefinisikan variabel atau data lain yang berfungsi memiliki izin untuk mengakses. Setiap lingkungan eksekusi memiliki objek variabel yang terkait dengannya. Semua variabel dan fungsi yang ditentukan dalam lingkungan disimpan dalam objek ini. Kode yang kami tulis tidak dapat mengakses objek ini, tetapi parser akan menggunakannya di latar belakang saat memproses data.

1. Penciptaan lingkungan eksekusi:

1. Lingkungan Eksekusi Global

Di browser web, lingkungan eksekusi global dianggap sebagai objek jendela, sehingga semua variabel dan fungsi global dibuat sebagai properti dan metode objek jendela. Ketika kode dimuat ke dalam browser, lingkungan eksekusi global dibuat (lingkungan eksekusi global hanya dihancurkan ketika kita menutup halaman web atau browser).

2. Lingkungan Eksekusi Lokal

Setiap fungsi memiliki lingkungan eksekusi sendiri, sehingga lingkungan eksekusi lokal adalah objek fungsi. Ketika suatu fungsi dipanggil, lingkungan lokal dari fungsi dibuat (setelah kode dalam fungsi dieksekusi, lingkungan dihancurkan, dan semua variabel dan definisi fungsi yang disimpan di dalamnya juga dihancurkan).

Lingkungan eksekusi ini dan objek variabel terkait adalah konsep abstrak, dijelaskan sebagai berikut

 var a = 1; fungsi fn (num1, num2) {var b = 2; fungsi fninner () {var c = 3; Peringatan (A + B + C); } fninner (); // penciptaan lingkungan eksekusi lokal ketika fninner disebut} fn (4,5); // penciptaan lingkungan eksekusi lokal ketika FN disebut

2. Rantai lingkup

Eksekusi fungsi JavaScript menggunakan rantai lingkup. Rantai lingkup ini dibuat ketika fungsi didefinisikan. Ketika suatu fungsi didefinisikan, itu sebenarnya menyimpan rantai lingkup. Ketika fungsi ini dipanggil, ia membuat objek baru untuk menyimpan variabel lokalnya dan menambahkan objek ini ke rantai lingkup yang disimpan. Ujung depan rantai lingkup selalu merupakan objek variabel di lingkungan di mana kode yang saat ini dieksekusi berada. Akhir dari rantai ruang lingkup selalu merupakan objek variabel dari lingkungan eksekusi global. Tujuan dari rantai ruang lingkup adalah untuk memastikan bahwa semua variabel dan fungsi yang memiliki izin untuk mengakses lingkungan eksekusi diizinkan untuk diakses.

 var scope = 'global scope'; function checkscope () {var scope = 'local scope'; fungsi f () {return scope}; return f;} checkScope () (); // Lokal Lokal

Pemahaman: Ketika checkscope dipanggil, fungsi F didefinisikan dan terikat pada rantai lingkup checkscope sebagai variabel lokal. Oleh karena itu, di mana pun fungsi F disebut, ikatan ini masih valid, sehingga nilai pengembalian adalah ruang lingkup lokal.

 var num1 = 1; fungsi luar () {var num2 = 2; console.log (num1 + num2); // 3 function inner () {// Di sini Anda dapat mengakses num3, num2, num1 var num3 = 3; console.log (num1 + num2 + num3); // 6} // di sini Anda dapat mengakses num2, dalam (), num1 tetapi tidak num3 dalam ();} outer (); console.log (num1); // 1, lingkungan eksekusi // di sini Anda hanya dapat mengakses num1

Rantai Lingkup (Cari Up): Lingkungan internal dapat mengakses semua lingkungan eksternal melalui rantai lingkup, tetapi lingkungan eksternal tidak dapat mengakses variabel dan fungsi apa pun di lingkungan internal.

 var name = 'byron'; fungsi fn () {var name = 'csper'; console.log (name); // casper} fn ();

Semakin internal lingkungan, semakin tinggi bobot variabel.

Catatan: Variabel yang tidak secara langsung dideklarasikan dengan kata kunci VAR adalah variabel global. Misalnya, jika a = 1 dinyatakan langsung, A adalah variabel global saat ini.

Ketika mesin Javscript memasuki ruang lingkup, ia akan memproses kode dalam dua putaran. Babak pertama, inisialisasi variabel. Babak kedua, jalankan kode

 var a = 1; function penjara (a) {console.log (a); // 1 var a; console.log (a); // 1} penjara (1);

3. Eksekusi fungsi

Ketika panggilan fungsi memasuki lingkungan eksekusi, argumen proses pertama, inisialisasi parameter formal (nilai default tidak ditentukan), dan kemudian inisialisasi deklarasi fungsi dalam fungsi. Ketika kode dieksekusi langkah demi langkah, deklarasi variabel dalam fungsi diinisialisasi (ketika kode tidak dieksekusi setelah memasuki lingkungan, nilainya tidak ditentukan). Oleh karena itu, urutan inisialisasi dalam fungsi adalah parameter formal, deklarasi fungsi, dan deklarasi variabel. Itu dapat dilihat dari gambar di atas. Izinkan saya memberi Anda contoh (seluruh lingkungan global juga merupakan fungsi).

 waspada (typeof fn); // fungsi, deklarasi fungsi di muka peringatan (typeof fn0); // tidak terdefinisi, deklarasi variabel di muka tetapi tidak ditetapkan fungsi fn () {// function ekspresi} var fn0 = function () {// Function Definition} (typeof fn0);