home

หน้าแรก
 Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Javascript

การปิดจะทำให้หน่วยความจำรั่วได้อย่างไร และจะป้องกันได้อย่างไร

ปิด

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

ในตัวอย่างต่อไปนี้ 'childFunction' คือฟังก์ชันภายในที่กำหนดไว้ภายใน 'parentFunction' ฟังก์ชันภายนอก เมื่อมีการเรียก 'parentFunction' ด้วยพารามิเตอร์ "outer val" ตัวแปรภายนอก a จะได้รับการกำหนดค่าเป็น "outer val" ฟังก์ชันจะส่งกลับพร้อมกับตัวชี้ไปยังฟังก์ชันภายใน "childFunction" ซึ่งมีอยู่ใน ตัวแปร 'val'

ตัวแปรท้องถิ่น a ของฟังก์ชันภายนอกจะยังคงมีอยู่แม้ว่าฟังก์ชันภายนอกจะส่งคืนแล้ว ใน javascript ทันทีที่เรียก parentFunction วัตถุขอบเขตที่มีคุณสมบัติ 'a' จะถูกสร้างขึ้น คุณสมบัตินี้มีค่าของ arg1 หรือที่เรียกว่า "outer val" ในทำนองเดียวกันเมื่อ parentFunction ส่งคืน มันจะส่งคืนฟังก์ชันภายใน (childFunction) ซึ่งมีอยู่ใน val ตัวแปร

เนื่องจากฟังก์ชัน inner มีการอ้างอิงถึงตัวแปรของฟังก์ชันภายนอก ดังนั้น scope object ที่มีคุณสมบัติ 'a' จะไม่ถูกรวบรวมเป็นขยะ

ตัวอย่าง 

<html>
<body>
<script>
   window.onload= function parentFunction(arg1) {
      var a = arg1;
      return function childFunction (arg2)
   {
      alert( a +" "+ arg2);
   };
   };
   var val = parentFunction("outer val");
   val("inner val");
</script>
</body>
</html>

หลีกเลี่ยงหน่วยความจำรั่ว

เพิ่มอีกหนึ่งฟังก์ชัน

โดยการเพิ่มฟังก์ชันอื่น จะมีฟังก์ชันภายในสองฟังก์ชัน เนื่องจากมีฟังก์ชันภายในอยู่ 2 ฟังก์ชัน จึงไม่มีฟังก์ชันใดอ้างอิงตัวแปรของฟังก์ชันภายนอกได้โดยการหยุดการปิดทั้งหมด

เมื่อไม่มีการปิด โอกาสที่หน่วยความจำจะรั่วก็จะน้อยลง

ตัวอย่าง

<html>
<body>
<script>
   window.onload=function parentFunction(){
      var Obj1 = function childFunction1()
      {
         document.write("the leak is avoided");
      };
   (function childFunction2(){
      var obj2 = document.getElementById("closure");
      obj2.onclick=Obj1
      })();
   };
</script>
<input type = "button" id="closure" value ="Click Here">
</body>
</html>

เมื่อโค้ดรันแล้ว ปุ่มจะแสดงดังนี้

การปิดจะทำให้หน่วยความจำรั่วได้อย่างไร และจะป้องกันได้อย่างไร

หลังจากกดปุ่มเราจะได้ผลลัพธ์ดังนี้

ผลลัพธ์

the leak is avoided