คำอธิบายโดยละเอียดของตัวอย่างขอบเขต JavaScript

ขอบเขตเป็นหนึ่งในแนวคิดที่สำคัญที่สุดของ JavaScript หากคุณต้องการเรียนรู้ JavaScript เป็นอย่างดีคุณต้องเข้าใจหลักการทำงานของขอบเขต JavaScript และขอบเขต บทความของวันนี้แนะนำคำอธิบายโดยละเอียดเกี่ยวกับตัวอย่างขอบเขต JavaScript โดยหวังว่าจะช่วยให้ทุกคนเรียนรู้ JavaScript ได้ดีขึ้น

ภาษาการเขียนโปรแกรมใด ๆ มีแนวคิดของขอบเขต พูดง่ายๆคือขอบเขตคือขอบเขตที่เข้าถึงได้ของตัวแปรและฟังก์ชั่นนั่นคือขอบเขตควบคุมการมองเห็นและวงจรชีวิตของตัวแปรและฟังก์ชั่น ใน JavaScript ขอบเขตของตัวแปรเป็นระดับโลกและท้องถิ่น

1. ไม่มีขอบเขตระดับบล็อกใน JavaScript

มีขอบเขตระดับบล็อกใน Java หรือ C#นั่นคือการจัดฟันเป็นขอบเขต

 โมฆะคงที่สาธารณะ main () {ถ้า (1 == 1) {string name = "Seven";} system.out.println (ชื่อ);} // รายงานข้อผิดพลาดโมฆะสาธารณะคง

ไม่มีขอบเขตระดับบล็อกใน JavaScript

 ฟังก์ชั่นหลัก () {ถ้า (1 == 1) {var name = 'seven';} console.log (ชื่อ);} // output: เจ็ด

2. JavaScript ใช้ขอบเขตฟังก์ชัน

ใน JavaScript แต่ละฟังก์ชั่นทำหน้าที่เป็นขอบเขตและตัวแปรในขอบเขตภายในไม่สามารถเข้าถึงได้จากภายนอก

 ฟังก์ชั่น Main () {var innerValue = 'seven';} main (); console.log (innerValue); // ข้อผิดพลาด: uncerferenceReror: innerValue ไม่ได้กำหนดไว้

3. โซ่ขอบเขต JavaScript

เนื่องจากแต่ละฟังก์ชั่นใน JavaScript เป็นขอบเขตหากฟังก์ชั่นที่ซ้อนกันปรากฏขึ้นห่วงโซ่ขอบเขตจะปรากฏขึ้น

 xo = 'Alex'; ฟังก์ชั่น func () {var xo = "เจ็ด"; ฟังก์ชัน inner () {var xo = 'alvin'; console.log (xo);} inner ();} func ();

ตัวอย่างเช่นรหัสข้างต้นจะปรากฏในห่วงโซ่ขอบเขตประกอบด้วยสามขอบเขต หากห่วงโซ่ขอบเขตปรากฏขึ้นคำสั่งจะปรากฏขึ้นเมื่อมองหาตัวแปร สำหรับตัวอย่างข้างต้น:

เมื่อดำเนินการ console.log (XO) ลำดับการค้นหาคือการค้นหาจากด้านในไปยังภายนอกตามลำดับความสำคัญของห่วงโซ่ขอบเขต หากไม่มีเลเยอร์ด้านในจะค่อยๆค้นหาจนกว่าจะไม่พบข้อยกเว้น

4. โซ่ขอบเขตของ JavaScript ได้ถูกสร้างขึ้นก่อนการดำเนินการ

ขอบเขตของ JavaScript ถูกสร้างขึ้นก่อนที่จะดำเนินการ เมื่อมีการดำเนินการในอนาคตคุณจะต้องค้นหาตามโซ่ขอบเขตเท่านั้น

ตัวอย่างที่ 1:

 xo = 'Alex'; ฟังก์ชั่น func () {var xo = "เจ็ด"; ฟังก์ชัน inner () {console.log (xo);} return inner;} var ret = func (); ret ();

รหัสข้างต้นมีอยู่แล้วก่อนที่จะเรียกฟังก์ชัน:

•ขอบเขตทั่วโลก-> ขอบเขตฟังก์ชัน func-> ขอบเขตฟังก์ชันภายในขอบเขต

เมื่อดำเนินการ [ret ();] เนื่องจากมันหมายถึงฟังก์ชันภายในห่วงโซ่ขอบเขตของฟังก์ชั่นนี้ได้รับการกำหนดเป็น: ขอบเขตทั่วโลก -> ขอบเขตฟังก์ชัน Func ขอบเขต -> ขอบเขตฟังก์ชันภายในดังนั้นเมื่อดำเนินการ [ret ();] ตัวแปรจะพบตามโซ่ขอบเขตที่มีอยู่

ตัวอย่างที่ 2:

 xo = 'Alex'; ฟังก์ชั่น func () {var xo = "eirc"; ฟังก์ชั่น inner () {console.log (xo);} xo = 'เจ็ด'; return inner;} var ret = func (); ret ();

รหัสข้างต้นมีวัตถุประสงค์เดียวกันกับตัวอย่างที่ 1 และยังเน้นว่าห่วงโซ่ขอบเขตมีอยู่แล้วก่อนที่ฟังก์ชั่นจะเรียกว่า:

•ขอบเขตทั่วโลก-> ขอบเขตฟังก์ชัน func-> ขอบเขตฟังก์ชันภายในขอบเขต

แตกต่างกันเมื่อดำเนินการ [var ret = func ();] ค่าของตัวแปร xo ในขอบเขต func ได้รับการรีเซ็ตเป็น "เจ็ด" จาก "Eric" ดังนั้นเมื่อดำเนินการ [ret ();] ในภายหลังคุณสามารถค้นหา "เจ็ด"

ตัวอย่างที่ 3:

 xo = 'Alex'; <br> function bar () {console.log (xo);} ฟังก์ชั่น func () {var xo = "เจ็ด"; bar return;} var ret = func (); ret ();

ในรหัสข้างต้นมีการสร้างโซ่ขอบเขตสองอย่างก่อนที่จะดำเนินการฟังก์ชั่น:

•ขอบเขตฟังก์ชันทั่วโลก-> ขอบเขตฟังก์ชันบาร์

•ขอบเขตฟังก์ชัน Global-> ขอบเขตฟังก์ชัน func

เมื่อดำเนินการ [RET ();], RET หมายถึงฟังก์ชั่นแท่งและขอบเขตของห่วงโซ่ของฟังก์ชันแท่งมีอยู่แล้ว: ขอบเขตทั่วโลก -> ขอบเขตฟังก์ชั่นบาร์ดังนั้นเมื่อดำเนินการมันจะถูกค้นหาตามห่วงโซ่ขอบเขตที่มีอยู่

5. คำสั่งล่วงหน้า

หากคุณไม่ได้สร้างตัวแปรและใช้โดยตรงใน JavaScript จะมีการรายงานข้อผิดพลาด:

 console.log (xxoo); // ข้อผิดพลาด: uncerference referenceError: xxoo ไม่ได้กำหนดไว้

ใน JavaScript หากมีการสร้างค่าโดยไม่ต้องกำหนดค่าค่าจะไม่ถูกกำหนดเช่น:

 var xxoo; console.log (xxoo); // output: undefined

หากสิ่งนี้เขียนไว้ในฟังก์ชั่น:

 function foo () {console.log (xo); var xo = 'seven';} foo (); // output: undefined

รหัสข้างต้นไม่ได้รายงานข้อผิดพลาด แต่เอาต์พุตไม่ได้กำหนด เหตุผลก็คือก่อนที่จะดำเนินการฟังก์ชัน JavaScript พวกเขาจะประกาศตัวแปรทั้งหมดในนั้นโดยไม่ต้องกำหนดค่า ดังนั้นจึงเทียบเท่ากับตัวอย่างข้างต้นว่าฟังก์ชั่นได้ดำเนินการ var xo แล้วเมื่อ "precompiled"; ดังนั้นผลลัพธ์ของรหัสข้างต้นจึงไม่ได้กำหนด

ข้างต้นเป็นคำอธิบายโดยละเอียดของตัวอย่างขอบเขต JavaScript ที่แนะนำโดยตัวแก้ไข ฉันหวังว่ามันจะเป็นประโยชน์กับคุณ หากคุณมีคำถามใด ๆ โปรดฝากข้อความถึงฉันและบรรณาธิการจะตอบกลับคุณทันเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Wulin.com!