สำหรับผู้มาใหม่ JavaScript Prototype เป็นสิ่งที่ลำบากมาก อย่างแรกต้นแบบนั้นง่ายที่จะสับสนกับ __proto__ และที่สองทิศทางต่าง ๆ ระหว่างพวกเขามีความซับซ้อนจริงๆ ในความเป็นจริงมีบทความมากมายในตลาดที่พยายามทำให้ชัดเจน มีภาพคลาสสิกที่เรียกว่ามีเส้นต่าง ๆ ที่วาดไว้เชื่อมต่อภาพนี้และภาพนั้น พูดตามตรงฉันรู้สึกเวียนหัวตัวเองมาก ๆ ดังนั้นฉันจึงอยากลองด้วยตัวเองเพื่อดูว่าฉันสามารถแยกจุดความรู้ที่สำคัญในต้นแบบและอธิบายได้อย่างชัดเจนในรูปแบบแผนภูมิที่ง่ายที่สุด
เรารู้ว่าต้นแบบเป็นวัตถุที่วัตถุอื่นสามารถใช้แอตทริบิวต์การสืบทอด แต่นอกเหนือจากต้นแบบแล้วยังมี __proto__ อีกอันที่ใช้สำหรับ? ผู้คนจะแยกแยะได้อย่างไรถ้าพวกเขาดูคล้ายกันมาก? พวกเขาชี้ไปที่ใคร? คุณจำความโกลาหลได้อย่างไร? ห่วงโซ่ต้นแบบคืออะไร? ฉันเชื่อว่าผู้เริ่มต้นจำนวนมากที่มีประสบการณ์บางอย่างอาจไม่สามารถอธิบายได้อย่างสมบูรณ์ ต่อไปนี้เป็นรูปภาพง่ายๆสามภาพและรหัสตัวอย่างที่จะเข้าใจ
1. ความแตกต่างระหว่างต้นแบบและ __proto__
var a = {}; console.log (a.prototype); //undefinedConsole.log(a.__proto__); // วัตถุ {} var b = function () {} console.log (b.prototype); // b {} console.log (b .__ proto__); //การทำงาน() {} /*1. วิธีตัวอักษร*/var a = {}; console.log (a .__ proto__); // วัตถุ {} console.log (a .__ proto__ === A.Constructor.prototype); // true/*2 วิธีตัวสร้าง*/var a = function () {}; var a = new a (); console.log (a .__ proto__); // a {} console.log (a .__ proto__ === a.constructor.prototype); // true/*3 Object.create () เมธอด*/var a1 = {a: 1} var a2 = object.create (a1); console.log (a2 .__ proto__); // วัตถุ {a: 1} console.log (a .__ proto__ === a.constructor.prototype); // false (นี่คือข้อยกเว้นในรูปที่ 1) var a = function () {}; var a = new a (); console.log (a .__ proto__); // a {} (เช่นวัตถุต้นแบบของฟังก์ชั่นคอนสตรัคเตอร์ a) console.log (a .__ proto __.__ proto__); // Object {} (เช่นวัตถุต้นแบบของวัตถุฟังก์ชั่นคอนโซล) console.log (a .__ proto __.__ proto __.__ proto__); //โมฆะข้างต้นเป็นเรื่องเกี่ยวกับบทความนี้ บทความนี้ใช้สามภาพเพื่ออธิบายวัตถุต้นแบบและโซ่ต้นแบบของจาวาสคริปต์ ฉันหวังว่ามันจะเป็นประโยชน์กับทุกคนเมื่อเรียนรู้ JavaScript