เมื่อเร็ว ๆ นี้ฉันเห็นห้องสมุด JS ที่เขียนโดยคนอื่น ทันใดนั้นฉันก็มีความคิดบางอย่างเกี่ยวกับต้นแบบและมรดกใน JS ฉันเคยเห็นพวกเขามาก่อน แต่พวกเขาไม่ชัดเจนมาก ฉันใช้เวลาว่างของฉันในวันนี้เพื่อทำความเข้าใจพื้นที่นี้และฉันก็ยังรู้สึกว่ามีบางอย่างผิดปกติ ความคิดไม่ได้ถูกจัดระเบียบเพียงเพื่อการแบ่งปัน
1. อินสแตนซ์ของ
ใน JavaScript มีตัวดำเนินการอินสแตนซ์ของตัวดำเนินการซึ่งเป็นตัวดำเนินการไบนารี ใช้เมธอด Instancea Instance ของ A และค่าส่งคืนเป็นบูลีนซึ่งหมายถึงการพิจารณาว่า Instancea เป็นตัวอย่างของ A และสาระสำคัญของมันคือการตรวจสอบว่า a.prototype === Instancea .__ Proto__ เช่น
ฟังก์ชั่น f2 () {var f = function () {} var test = new f (); console.log (ทดสอบอินสแตนซ์ของ f); // true console.log ((f.prototype ==== ทดสอบ. __ proto __)); // true}ภาพพิมพ์ทั้งสองด้านบนเป็นจริง บ่งชี้ว่าการทดสอบเป็นตัวอย่างของ F; แอตทริบิวต์ __proto__ ของจุดทดสอบไปยังวัตถุต้นแบบของ F นั่นคือคุณสมบัติต้นแบบของ F เป็นวัตถุและวัตถุนี้เป็นอินสแตนซ์ของ F
2. วัตถุใน JS
ทุกอย่างเป็นวัตถุใน JS วัตถุแบ่งออกเป็นวัตถุฟังก์ชันและวัตถุธรรมดา ฟังก์ชั่นทั่วไปเป็นวัตถุฟังก์ชันจริงเช่น
// ฟังก์ชั่นวัตถุ var f = function () {} var f2 = ฟังก์ชันใหม่ ('str', 'console.log (str)') ฟังก์ชั่น f3 () {} // วัตถุธรรมดา var o = วัตถุใหม่ (); var o2 = {} var o3 = new f ()ดังที่แสดงไว้ด้านบน, F, F2 และ F3 เป็นวัตถุฟังก์ชั่นและ O, O2 และ O3 เป็นวัตถุธรรมดา
ความแตกต่างระหว่างวัตถุฟังก์ชันและวัตถุปกติ:
วัตถุทั้งหมดที่สร้างขึ้นโดยใช้ฟังก์ชั่นใหม่ () เป็นวัตถุฟังก์ชัน F และ F3 และในที่สุดพวกเขาก็ถูกสร้างขึ้นโดยใช้ฟังก์ชั่นใหม่ ();
เมื่อกำหนดวัตถุวัตถุจะมีคุณสมบัติที่กำหนดไว้ล่วงหน้าบางอย่างเช่นต้นแบบและ __proto__ แอตทริบิวต์ต้นแบบมีให้เฉพาะในวัตถุฟังก์ชันเท่านั้นและ __proto__ พร้อมใช้งานสำหรับวัตถุทั้งหมด ดังนั้นจึงสามารถกำหนดได้โดยแอตทริบิวต์ __proto__ ของวัตถุของวัตถุเพื่อตรวจสอบว่าวัตถุเป็นวัตถุฟังก์ชันหรือวัตถุปกติเช่น
// ฟังก์ชันวัตถุ var f = function () {} // วัตถุธรรมดา var o = วัตถุใหม่ (); console.log (f.prototype); // object {} console.log (o.prototype); // undefinedจากด้านบนเราสามารถพบว่าวัตถุฟังก์ชันมีแอตทริบิวต์ต้นแบบในขณะที่วัตถุต้นแบบของวัตถุธรรมดาไม่ได้กำหนด
3. ห่วงโซ่ต้นแบบ
จากข้างต้นเรารู้ว่าวัตถุทั้งหมดมีแอตทริบิวต์ __proto__ ซึ่งชี้ไปที่ต้นแบบวัตถุต้นแบบของวัตถุฟังก์ชันที่สร้างขึ้น เราเรียกสายโซ่นี้โดยใช้แอตทริบิวต์ __proto__ chain chain prototype เช่นต่อไปนี้เป็นห่วงโซ่ต้นแบบ
ภาพด้านบนเป็นตัวอย่างเป็นตัวอย่างแสดงให้เห็นถึงห่วงโซ่ต้นแบบ
var person = function () {} var person1 = คนใหม่ ();1. บุคคลเป็นวัตถุฟังก์ชั่น person1 เป็นตัวอย่างของบุคคล
2. แอตทริบิวต์ __proto__ ของ person1 เป็นวัตถุต้นแบบของบุคคล prototype
3. เนื่องจากบุคคลวัตถุต้นแบบของบุคคล prototype เป็นวัตถุมันยังมีแอตทริบิวต์ __proto__ ซึ่งชี้ไปที่วัตถุวัตถุต้นแบบวัตถุวัตถุ
4. วัตถุวัตถุต้นแบบวัตถุของ Object.prototype เป็นวัตถุซึ่งมีแอตทริบิวต์ __proto__ และวัตถุต้นแบบของแอตทริบิวต์นี้เป็นโมฆะ
4. มรดกบางอย่าง
ใน JS เราจะกำหนดวัตถุฟังก์ชันเช่น
var person = function () {}ข้างต้นเรากำหนดวัตถุฟังก์ชันซึ่งไม่มีคุณสมบัติและเป็นวัตถุที่ว่างเปล่า เนื่องจากเป็นวัตถุคุณสามารถเพิ่มคุณสมบัติให้กับมันได้
var person = function () {} person.name1 = 'js'console.log (person.name1) // jsรหัสข้างต้นได้เพิ่มแอตทริบิวต์ชื่อให้กับบุคคลและกำหนดค่าให้กับ JS และค่าของแอตทริบิวต์ชื่อสามารถพิมพ์ออกมาได้
แต่เมื่อเราสร้างตัวอย่างของ person1 ดังนี้
var person = function () {}; person.name1 = 122; console.log (person.name1); var person1 = คนใหม่ (); console.log (person1.name1); // undefinedคุณจะเห็นว่า Person1 ไม่มีแอตทริบิวต์ NAME1 ดังนั้นเราจะมั่นใจได้อย่างไรว่าอินสแตนซ์ของบุคคลนั้นมีแอตทริบิวต์ NAME1 ได้อย่างไร
var person = function () {}; person.name1 = 122; // ใช้วัตถุต้นแบบเพื่อเพิ่มแอตทริบิวต์ลงในวัตถุเพื่อให้อินสแตนซ์จะมีบุคคลที่มีคุณสมบัตินี้ prototype.name1 = '12 '; console.log (person.name1); var person1 = คนใหม่ (); console.log (person1.name1); // 12ด้านบนใช้ person.protoype.name1 = '12 'เพื่อให้อินสแตนซ์ทั้งหมดมีแอตทริบิวต์ NAME1 แอตทริบิวต์ที่เพิ่มเข้ามาในวิธีนี้จะถือเป็นคุณลักษณะทั่วไปของอินสแตนซ์เมื่อสร้างอินสแตนซ์
บทความข้างต้นขึ้นอยู่กับต้นแบบและการสืบทอดใน JS เนื้อหาทั้งหมดที่ฉันแบ่งปันกับคุณคือบรรณาธิการ ฉันหวังว่ามันจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น