คำอธิบายโดยละเอียดเกี่ยวกับขอบเขตที่สับสนมากที่สุดการเพิ่มประสิทธิภาพและความรู้ปิดใน JavaScript (แนะนำ)

1. ขอบเขตฟังก์ชัน

1. ขอบเขตฟังก์ชัน

หมายความว่าขอบเขตอยู่ใน "ฟังก์ชั่น" และตัวแปรทั้งหมดที่เป็นของฟังก์ชั่นนี้สามารถใช้และมัลติเพล็กซ์ภายในขอบเขตฟังก์ชันทั้งหมด

 function foo (a) {var b = 2; function bar () {// ... } var c = 3;} bar (); // ล้มเหลว console.log (a, b, c); // ทั้งสามล้มเหลว

หากตัวระบุหลายตัวในฟังก์ชั่น "Foo" ด้านบนจะถูกรายงานหากวางไว้นอกฟังก์ชั่นและเข้าถึง

2. ดำเนินการนิพจน์ฟังก์ชั่นทันที

การเพิ่มฟังก์ชั่น wrapper นอกตัวอย่างโค้ดใด ๆ สามารถ "ซ่อน" ตัวแปรภายในและคำจำกัดความของฟังก์ชั่นและขอบเขตภายนอกไม่สามารถเข้าถึงสิ่งใดภายในฟังก์ชั่น wrapper

ตัวอย่างเช่นแถบข้างต้น A และตัวระบุอื่น ๆ สิ่งนี้จะปกป้องตัวแปรจากการปนเปื้อน

เมื่อเขียนปลั๊กอินคุณมักจะใช้ทันทีเพื่อดำเนินการนิพจน์ฟังก์ชั่นเพื่อป้องกันตัวแปรภายใน

 var a = 2; (function foo () {var a = 3; console.log (a); // 3}) (); console.log (a); // 2

First () ใน "foo" จะเปลี่ยนฟังก์ชั่นเป็นนิพจน์และบทที่สอง () จะดำเนินการฟังก์ชั่นนี้

มีคำศัพท์พิเศษ: IIFE ซึ่งแสดงถึงการแสดงออกของฟังก์ชั่นที่เรียกทันที

1. การใช้งานขั้นสูงคือการเรียกพวกเขาว่าเป็นฟังก์ชันและผ่านพารามิเตอร์ใน

 (ฟังก์ชั่น iife (ทั่วโลก) {var a = 3; console.log (a); // 3console.log (global.a); // 2}) (หน้าต่าง);

2. จุดประสงค์ที่เปลี่ยนแปลงคือการกลับคำสั่งที่รันของรหัสซึ่งใช้กันอย่างแพร่หลายในโครงการ CMD หรือ AMD

 (ฟังก์ชั่น iife (โรงงาน) {โรงงาน (หน้าต่าง);}) (ฟังก์ชั่น def (ทั่วโลก) {var a = 3; console.log (a); // 3console.log (global.a); // 2});

2. ขอบเขตบล็อก

JavaScript ไม่รองรับขอบเขตบล็อก

 สำหรับ (var i = 0; i <10; i ++) {console.log (i);}

"ฉัน" ในรหัสข้างต้นเทียบเท่ากับสิ่งต่อไปนี้

 var i; สำหรับ (i = 0; i <10; i ++) {console.log (i);}

แต่มีข้อยกเว้น "ลอง/จับ" Catch เป็นขอบเขตบล็อก

 ลอง {undefined (); // ดำเนินการที่ผิดกฎหมายเพื่อบังคับข้อยกเว้น} catch (err) {console.log (err); // สามารถดำเนินการตามปกติ! } console.log (err); // ReferenceRoror: ไม่พบ ERR

ES6 ได้เปลี่ยนสถานะเดิมและแนะนำคำหลักใหม่ซึ่งสามารถผูกตัวแปรกับขอบเขตใด ๆ (โดยปกติจะอยู่ภายใน {.. }) กล่าวอีกนัยหนึ่งตัวแปรที่ประกาศให้ปล่อยให้อยู่ในขอบเขตบล็อกโดยปริยาย

3. การปรับปรุง

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

1) การรวบรวมและดำเนินการ

การประกาศทั้งหมดของตัวแปรและฟังก์ชั่นจะถูกประมวลผลก่อนก่อนที่จะดำเนินการรหัสใด ๆ คุณสามารถดูตัวอย่างรหัสต่อไปนี้

 a = 2; var a; console.log (a); // 2

รหัสนี้เทียบเท่ากับ:

 var a; // การประกาศคำจำกัดความจะดำเนินการในขั้นตอนการรวบรวม A = 2; // การประกาศการกำหนดจะถูกทิ้งไว้เพื่อรอการดำเนินการคอนโซลขั้นตอนการดำเนินการ log (a);

2) ลำดับความสำคัญของฟังก์ชั่น

ฟังก์ชั่นจะได้รับการส่งเสริมก่อนจากนั้นตัวแปรจะเป็น

 foo (); // 1var foo; function foo () {console.log (1);} foo = function () {console.log (2);};

การแสดงออกของฟังก์ชั่น var foo แม้ว่าก่อนการประกาศฟังก์ชัน foo () เป็นคำประกาศซ้ำ (และดังนั้นจึงไม่สนใจ) เนื่องจากการประกาศฟังก์ชันจะได้รับการส่งเสริมก่อนตัวแปรปกติ

และรหัสข้างต้นเทียบเท่ากับ:

 function foo () {console.log (1);} foo (); // 1foo = function () {console.log (2);};

4. ปิด

การปิดอ้างถึงฟังก์ชั่นที่มีการเข้าถึงตัวแปรในขอบเขตฟังก์ชันอื่น วิธีที่พบบ่อยที่สุดในการสร้างการปิดคือการสร้างฟังก์ชั่นอื่นภายในฟังก์ชั่นหนึ่ง

การเข้าถึงตัวแปรท้องถิ่นของฟังก์ชั่นนี้ผ่านฟังก์ชั่นอื่นโดยใช้การปิดสามารถผ่านโดเมน Action Chain และผ่านตัวแปรและวิธีการภายในฟังก์ชั่นไปด้านนอก

คุณสมบัติการปิด:

1. ฟังก์ชั่นซ้อนกันโดยเนื้อแท้

2. ฟังก์ชั่นภายในสามารถอ้างถึงพารามิเตอร์และตัวแปรภายนอก

3. พารามิเตอร์และตัวแปรจะไม่ถูกรวบรวมโดยกลไกการรวบรวมขยะ

1) คำจำกัดความ

เมื่อฟังก์ชั่นสามารถจดจำและเข้าถึงขอบเขตที่ตั้งอยู่การปิดจะถูกสร้างขึ้นแม้ว่าฟังก์ชั่นจะถูกดำเนินการนอกขอบเขตปัจจุบัน

 function foo () {var a = 2; function bar () {console.log (a);} return bar;} var baz = foo (); baz (); // 2 - นี่คือผลของการปิด

1. กำหนดฟังก์ชั่น "บาร์" เป็น "baz" และดำเนินการ "baz" ขอบเขตปัจจุบันไม่ได้อยู่ในขอบเขตของ "บาร์" แต่สามารถดำเนินการได้

2. การปิดจะป้องกันการเก็บขยะ เมื่อมีการดำเนินการ "foo" ขอบเขตภายในยังคงมีอยู่ ด้วยวิธีนี้ "BAZ" สามารถดำเนินการได้

2) ผ่านฟังก์ชั่นเป็นพารามิเตอร์

 function foo () {var a = 2; function baz () {console.log (a); // 2} bar (baz);} function bar (fn) {fn (); // นี่คือการปิด! -

ผ่านฟังก์ชั่นภายใน baz ไปยังบาร์และเมื่อฟังก์ชั่นภายในนี้เรียกว่า (FN) การปิดขอบเขตภายในของ foo () มันครอบคลุมสามารถสังเกตได้เนื่องจากสามารถเข้าถึงได้

หากคุณปฏิบัติต่อฟังก์ชั่นเป็นประเภทค่าในระดับแรกและผ่านไปทุกที่คุณจะเห็นแอปพลิเคชันการปิดในฟังก์ชั่นเหล่านี้

ในตัวจับเวลาผู้ฟังเหตุการณ์คำขอ AJAX การสื่อสารข้ามหน้าต่างงานเว็บหรืองานอื่น ๆ แบบอะซิงโครนัส (หรือซิงโครนัส) ตราบใดที่ใช้ฟังก์ชั่นการโทรกลับ

3) ลูปและปิด

 สำหรับ (var i = 1; i <= 5; i ++) {settimeout (ฟังก์ชันตัวจับเวลา () {console.log (i);}, i * 1000);}

ทุกครั้งที่พิมพ์มันจะเป็น 6 และการโทรกลับของฟังก์ชั่นการหน่วงเวลาจะถูกดำเนินการเฉพาะตอนท้ายของลูป

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

ตอนนี้ใช้การปิดเพื่อใช้การพิมพ์ที่แตกต่างกันในแต่ละครั้ง

 สำหรับ (var i = 1; i <= 5; i ++) {(ฟังก์ชั่น (j) {settimeout (ตัวจับเวลาฟังก์ชัน () {console.log (j);}, j * 1000);}) (i);}

IIFE สร้างขอบเขตโดยการประกาศและดำเนินการฟังก์ชั่นทันที การโทรกลับใน Settimeout สามารถจดจำขอบเขตปัจจุบันและพารามิเตอร์ "J" ในแต่ละขอบเขตจะแตกต่างกัน

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