Analisis singkat tentang ruang lingkup dalam JavaScript (disarankan)

Lingkup yang disebut dapat dengan mudah dipahami sebagai ruang lingkup (area) yang dapat dibaca dan ditulis. Beberapa siswa dengan pengalaman di JS mungkin mengatakan: "JS tidak memiliki ruang lingkup tingkat blok". Selain ruang lingkup global, hanya fungsi yang dapat membuat lingkup. Salah satu keuntungan dari ruang lingkup adalah dapat mengisolasi variabel.

Kami menggunakan beberapa contoh untuk membantu kami memahami ruang lingkup di JS.

 waspada (a); var a = 1;

Jika siswa yang tidak tahu ruang lingkup sama sekali mungkin mengatakan bahwa peringatan adalah 1 atau melaporkan kesalahan; Tapi itu sebenarnya tidak terdefinisi;

Berbicara tentang hal ini, mari kita bicara tentang beberapa persiapan yang dibuat sebelum JS mem -parsing kode baris demi baris.

Sebelum membaca kode baris demi baris, JS akan melakukan beberapa pekerjaan "pra-peluang" dan akan menemukan beberapa "hal-hal kecil" terlebih dahulu. Tentu saja, "JS Parser" tidak akan menemukan beberapa data dengan santai, itu akan menemukannya sesuai dengan var, fungsi, dan parameter.

"JS parser" relatif "malas". Sebelum secara resmi menjalankan kode, itu akan menetapkan variabel yang dinyatakan oleh Var untuk tidak ditentukan, yaitu var a = tidak terdefinisi; Ini akan menganggap seluruh fungsi sebagai blok kode, terlepas dari berapa banyak kode yang ada. Parameter akan dikatakan dalam contoh nanti.

Setelah semua persiapan dilakukan, "JS Parser" mulai menjalankan kode baris demi baris. Sekarang, mari kita analisis contoh yang kita mulai dan mudah untuk dipahami mengapa itu tidak terdefinisi.

Mari kita lihat contoh berikut

 waspada (a); var a = 1; waspada (a); var a = 2; waspada (a);

Mari kita analisis ini sedikit

"Persiapan" pertama: Parser akan mencari var

Saat membaca baris kedua A = tidak terdefinisi;

Saat membaca baris keempat, masih A = tidak terdefinisi;

Eksekusi Kode Line-By-Line Formal:

Peringatan Baris Pertama: Tidak Ditentukan

Baris kedua a = 1;

Baris 3 Peringatan: 1;

Peringatan Elemen Kelima: 2

Mari kita lihat contoh di bawah ini

 waspada (a); var a = 1; waspada (a); function a () {alert (2); } peringatan (a); var a = 3; waspada (a); function a () {alert (4); } peringatan (a);

Mari kita analisis sedikit demi sedikit

Pertama, "Pra-Parse": Parser akan mencari fungsi VAR;

Saat membaca baris kedua A = tidak terdefinisi;

Saat membaca baris keempat a = fungsi a () {alert (2);} // Semua fungsi adalah seluruh blok fungsi sebelum secara resmi menjalankan kode; Ketika variabel menemukan nama duplikat, hanya satu variabel yang tersisa. Jika variabel dan fungsinya adalah nama duplikat, hanya fungsi yang tersisa.

Saat membaca baris keenam, a = function a () {alert (2);}

Saat membaca baris kedelapan, a = function a () {alert (4);}

Eksekusi Kode Line-By-Line Formal:

Peringatan Baris Pertama: Fungsi a () {alert (4);}

Baris kedua a = 1; // Ekspresi dapat memodifikasi nilai pra-parsed!

Baris 3 Peringatan: 1;

Baris fungsi keempat tidak disebut, lewati;

Peringatan Elemen Kelima: 1;

Baris enam a = 3;

Baris 7 Peringatan: 3

Fungsi garis kedelapan tidak disebut, lewati;

LINE 9 ALERT: 3

Seperti yang ditunjukkan pada gambar:

Terus lihat contohnya:

 var a = 1; function fn1 () {alert (a); // var a = 2;} fn1 (); waspada (a); // 1

"Persiapan" pertama: parser akan mencari fungsi var

Saat membaca baris pertama A = tidak terdefinisi;

Saat membaca baris kedua fn1 = fungsi fn1 () {waspada (2); var a = 2;}

Eksekusi Kode Line-By-Line Formal: Baris pertama A = 1;

Panggilan fungsi baris keenam, masukkan ruang lingkup fungsi dan masih pra-parse dalam ruang lingkup fungsi, dan kemudian jalankan garis demi baris.

Persiapan dalam fungsi: a = tidak terdefinisi;

Eksekusi: Peringatan: tidak ditentukan;

a = 2; // A saat ini hanya dalam lingkup fungsi dan tidak akan mempengaruhi A dalam global

Fungsi dijalankan dan kembali ke ruang lingkup global;

Line Seven Alert: 1;

melanjutkan:

 var a = 1; function fn1 () {alert (a); // 1 a = 2;} fn1 (); waspada (a); // 2

Satu -satunya perbedaan antara contoh di atas adalah bahwa A dalam fungsi tidak memiliki VAR, dan hanya menganalisis poin -poin kunci.

Dalam peringatan baris ketiga (a), dalam ruang lingkup fungsi, karena tidak ada var A dalam fungsi, "parser" akan mencari A ke ruang lingkup tingkat atas dari ruang lingkup fungsi (penentuan hubungan tingkat atas dan tingkat bawah tergantung pada ruang lingkup yang dibuat, dan di bawah ruang lingkupnya dibuat, ruang lingkupnya adalah level yang lebih rendah). Pada saat ini, tingkat atas fungsi adalah ruang lingkup global. Dalam ruang lingkup global, a = 1, jadi pada saat ini, peringatan baris ketiga: 1, dan kemudian baris keempat, a = 2 memberikan nilainya, masih tidak ada A dalam lingkup fungsi, jadi temukan A dalam ruang lingkup tingkat atas, yaitu, ruang lingkup global, dan memodifikasi A dalam lingkup global, jadi A = 2 akan membuat di ruang lingkup global = 2, sehingga So the Global The Scope = 2, So the The Global Seceph

Poin ini harus dipahami dengan jelas dan memperhatikan perbedaan antara VAR atau tidak.

Berikutnya:

 var a = 1; fungsi fn1 (a) {alert (a); // tidak terdefinisi a = 2; } fn1 (); waspada (a); // 1

Perbedaan antara contoh ini dan yang sebelumnya adalah bahwa ada parameter tambahan. Fungsi parameter setara dengan variabel lokal, yaitu, akan ada var a = tidak terdefinisi dalam pra-pengasuhan dalam fungsi. Oleh karena itu, peringatan baris ketiga: tidak terdefinisi, dan baris keempat A = 2 mengubah A dalam lingkup fungsi, yang tidak mempengaruhi A dalam konteks global. Peringatan Baris Ketujuh: 1;

Kemudian:

 var a = 1; function fn1 (a) {alert (a); // 1a = 2;} fn1 (a); peringatan (a); // 1

Contoh ini agak berbeda dari yang sebelumnya. Ketika fungsi dipanggil di baris keenam, parameter dilewatkan. Parameter aktual A dari fungsi garis keenam adalah 1 dari variabel global A = 1. Ketika fungsi dieksekusi, baris kedua A = 1, sehingga peringatan baris ketiga: 1, dan peringatan baris ketujuh: 1.

Perhatikan perbedaan antara contoh -contoh ini dan jangan membingungkannya.

Satu lagi:

 var a = 1; function en () {var a = 2; fn ();} function fn () {alert (a); // 1} en ();

A di FN tidak dinyatakan, dan Anda perlu mengambil nilai dalam ruang lingkup di mana fungsi dibuat - itu "dibuat", bukan "memanggil" ruang lingkup fungsi.

PS: Lingkup dan Konsep Konteks dalam JavaScript

Lingkup dan konteks dalam JavaScript adalah unik untuk bahasa ini, sebagian berkat fleksibilitas yang mereka bawa. Setiap fungsi memiliki konteks dan ruang lingkup variabel yang berbeda. Konsep -konsep ini didukung oleh beberapa pola desain yang kuat di JavaScript. Namun, ini juga membawa kebingungan besar bagi pengembang. Berikut ini sepenuhnya mengungkapkan perbedaan dalam konteks dan ruang lingkup dalam JavaScript dan bagaimana berbagai pola desain menggunakannya.

Konteks vs ruang lingkup

Pertanyaan pertama yang diklarifikasi adalah konteks dan ruang lingkup adalah konsep yang berbeda. Selama bertahun -tahun saya telah memperhatikan bahwa banyak pengembang sering membingungkan kedua istilah ini, secara keliru menggambarkan satu sebagai yang lain. Agar adil, istilah -istilah ini menjadi sangat membingungkan.

Setiap panggilan fungsi memiliki ruang lingkup dan konteks yang terkait dengannya. Pada dasarnya, ruang lingkup berbasis fungsi dan konteks berbasis objek. Dengan kata lain, ruang lingkup terkait dengan mengakses variabel setiap kali fungsi disebut, dan setiap panggilan independen. Konteks selalu merupakan nilai kata kunci ini, referensi ke objek yang memanggil kode yang dapat dieksekusi saat ini.

Di atas adalah ruang lingkup JavaScript yang diperkenalkan kepada Anda oleh editor (disarankan). Saya harap ini akan membantu Anda. Jika Anda memiliki pertanyaan, silakan tinggalkan saya pesan dan editor akan membalas Anda tepat waktu. Terima kasih banyak atas dukungan Anda ke situs web Wulin.com!