ลองมาดูจุดประสงค์ในการปิด ในความเป็นจริงโดยใช้การปิดเราสามารถทำสิ่งต่าง ๆ ได้มากมาย ตัวอย่างเช่นจำลองรูปแบบรหัสเชิงวัตถุ Express Code อย่างสง่างามและรัดกุมมากขึ้น และปรับปรุงประสิทธิภาพการดำเนินการโค้ดในบางด้าน
1 ฟังก์ชั่นการดำเนินการด้วยตนเองที่ไม่ระบุชื่อ
เรารู้ว่าหากตัวแปรทั้งหมดไม่ได้ถูกเพิ่มด้วยคำหลัก VAR ค่าเริ่มต้นจะถูกเพิ่มลงในคุณสมบัติของวัตถุทั่วโลก มีข้อเสียมากมายในการเพิ่มตัวแปรชั่วคราวลงในวัตถุทั่วโลก
ตัวอย่างเช่น: ฟังก์ชั่นอื่น ๆ อาจใช้ตัวแปรเหล่านี้ในทางที่ผิด ทำให้วัตถุทั่วโลกมีขนาดใหญ่เกินไปและส่งผลต่อความเร็วในการเข้าถึง (เนื่องจากค่าของตัวแปรจะต้องถูกข้ามจากห่วงโซ่ต้นแบบ)
นอกเหนือจากการใช้คำหลัก VAR ทุกครั้งที่เราใช้ตัวแปรเรามักจะพบกับสถานการณ์ที่บางฟังก์ชั่นจำเป็นต้องดำเนินการเพียงครั้งเดียวและตัวแปรภายในของพวกเขาไม่จำเป็นต้องได้รับการดูแล
ตัวอย่างเช่นในการเริ่มต้นของ UI เราสามารถใช้การปิด:
การคัดลอกรหัสมีดังนี้:
var dataModel = {
โต๊ะ : [],
ต้นไม้ : {}
-
(ฟังก์ชั่น (DM) {
สำหรับ (var i = 0; i <dm.table.rows; i ++) {
var row = dm.table.rows [i];
สำหรับ (var j = 0; j <row.cells; i ++) {
drawcell (i, j);
-
-
// สร้าง dm.tree
}) (DataModel);
เราสร้างฟังก์ชั่นที่ไม่ระบุชื่อและดำเนินการทันทีเนื่องจากภายนอกไม่สามารถอ้างอิงตัวแปรภายในได้
ดังนั้นจะมีการปล่อยตัวในไม่ช้าหลังจากดำเนินการ กุญแจสำคัญคือกลไกนี้จะไม่ก่อให้เกิดมลพิษจากวัตถุระดับโลก
2 แคช
มาลองอีกตัวอย่างหนึ่ง ลองนึกภาพว่าเรามีวัตถุฟังก์ชั่นที่ใช้เวลานานมากซึ่งใช้เวลานานในการประมวลผลการโทรแต่ละครั้ง
จากนั้นเราต้องเก็บค่าที่คำนวณไว้ เมื่อเรียกใช้ฟังก์ชั่นนี้ก่อนอื่นเราค้นหาในแคช หากไม่พบเราจะทำการคำนวณ
จากนั้นอัปเดตแคชและส่งคืนค่า หากพบเพียงแค่ส่งคืนค่าที่พบโดยตรง การปิดทำสิ่งนี้อย่างแน่นอนเพราะมันไม่ได้ปล่อยการอ้างอิงภายนอก
ดังนั้นค่าภายในฟังก์ชั่นสามารถเก็บรักษาไว้ได้
การคัดลอกรหัสมีดังนี้:
var cachedSearchbox = (function () {
var cache = {}
นับ = [];
กลับ {
attachSearchBox: function (dSID) {
ถ้า (dsid ในแคช) {// ถ้าผลลัพธ์อยู่ในแคช
ส่งคืนแคช [dsid]; // กลับไปที่วัตถุโดยตรงในแคช
-
var fsb = ใหม่ uikit.webctrl.searchbox (dsid); // ใหม่
แคช [dsid] = fsb; // อัปเดตแคช
if (count.length> 100) {// ขนาดของแคชรับประกันได้ <= 100
ลบแคช [count.shift ()];
-
คืน FSB;
-
ClearSearchBox: ฟังก์ชั่น (DSID) {
if (dsid ในแคช) {
แคช [DSID] .ClearSelection ();
-
-
-
-
cachedsearchbox.attachsearchbox ("input1");
ด้วยวิธีนี้เมื่อเราเรียก cachedsearchbox.attachserachbox ("input1") เป็นครั้งที่สอง
เราสามารถเข้าถึงวัตถุจากแคชโดยไม่ต้องสร้างวัตถุ SearchBox ใหม่
3 ใช้บรรจุภัณฑ์
ก่อนอื่นให้ดูตัวอย่างเกี่ยวกับการห่อหุ้ม ตัวแปรภายในไม่สามารถเข้าถึงได้นอกบุคคล แต่เข้าถึงได้โดยการปิดการปิด:
การคัดลอกรหัสมีดังนี้:
var person = function () {
// ขอบเขตของตัวแปรอยู่ภายในฟังก์ชั่นและไม่สามารถเข้าถึงได้นอกฟังก์ชั่น
var name = "default";
กลับ {
getName: function () {
ชื่อคืน;
-
setName: function (newName) {
ชื่อ = newName;
-
-
-
พิมพ์ (person.name); // การเข้าถึงโดยตรงผลลัพธ์ไม่ได้กำหนดไว้
พิมพ์ (person.getName ());
person.setName ("Abruzzi");
พิมพ์ (person.getName ());
ผลลัพธ์มีดังนี้:
ไม่ได้กำหนด
ค่าเริ่มต้น
ปักกรุซซี่
4 จุดประสงค์ที่สำคัญอีกประการหนึ่งของการปิดคือการใช้วัตถุเชิงวัตถุ ภาษาวัตถุแบบดั้งเดิมมีกลไกเทมเพลตคลาส
ด้วยวิธีนี้วัตถุที่แตกต่างกัน (อินสแตนซ์ของคลาส) มีสมาชิกอิสระและรัฐและไม่รบกวนกันและกัน แม้ว่าจะไม่มีกลไกเช่นคลาสใน JavaScript โดยใช้การปิด
เราสามารถจำลองกลไกดังกล่าวได้ มาพูดถึงตัวอย่างข้างต้น:
การคัดลอกรหัสมีดังนี้:
ฟังก์ชั่นบุคคล () {
var name = "default";
กลับ {
getName: function () {
ชื่อคืน;
-
setName: function (newName) {
ชื่อ = newName;
-
-
-
var john = person ();
พิมพ์ (john.getName ());
John.setName ("John");
พิมพ์ (john.getName ());
var jack = person ();
พิมพ์ (jack.getName ());
Jack.setName ("Jack");
พิมพ์ (jack.getName ());
ผลการดำเนินการมีดังนี้:
ค่าเริ่มต้น
จอห์น
ค่าเริ่มต้น
แจ็ค
จากรหัสนี้เราจะเห็นว่าทั้งจอห์นและแจ็คสามารถเรียกได้ว่าอินสแตนซ์ของชั้นเรียนบุคคลเนื่องจากการเข้าถึงสมาชิกชื่อนั้นเป็นอิสระและไม่ส่งผลต่อกันและกัน
ข้างต้นเป็นฟังก์ชั่นของการปิด JS ซึ่งง่ายและเข้าใจง่ายมาก ฉันหวังว่ามันจะเป็นประโยชน์กับเพื่อนของฉัน