ในการหาห่วงโซ่ต้นแบบคุณต้องหาประเภทฟังก์ชั่นก่อน คลาสมีคุณสมบัติที่สำคัญมากซึ่งก็คือมันสามารถสร้างวัตถุด้วยมันเป็นเทมเพลตตามตัวสร้าง ใน JavaScript ฟังก์ชั่นมี 2 ฟังก์ชั่น
อันดับแรกเป็นการโทรฟังก์ชั่นทั่วไป
ประการที่สองตัวสร้างของวัตถุต้นแบบเป็นของใหม่ ()
มาเป็นตัวอย่างกัน
การคัดลอกรหัสมีดังนี้:
ฟังก์ชัน A () {
this.name = 'a';
-
จะเกิดอะไรขึ้นเมื่อสร้างฟังก์ชั่น?
ก่อนอื่นมันจะสร้างวัตถุฟังก์ชันนั่นคือตัวเอง
ประการที่สองมันจะสร้างวัตถุต้นแบบ @A (แสดงโดย @)
ประการที่สามวัตถุฟังก์ชันจะมีตัวชี้ต้นแบบซึ่งชี้ไปที่วัตถุต้นแบบที่สอดคล้องกันและที่นี่มันชี้ไปที่ @A
ประการที่สี่มีตัวชี้ตัวสร้างในวัตถุ @a ชี้ไปที่ตัวสร้างที่นี่มันชี้ไปที่ก
http://img.blog.csdn.net/20140222125611500?watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvbgpmtu3mdex/font/5a6l5l2t/fontsize /ตะวันออกเฉียงใต้
การใช้แอตทริบิวต์ต้นแบบนี้คืออะไร?
ในความเป็นจริงแอตทริบิวต์ต้นแบบแสดงถึงช่วงที่ฟังก์ชั่นปัจจุบันสามารถควบคุมได้ (หรือระบุว่าใครก็ตามที่สร้างฟังก์ชั่นปัจจุบัน) .
การคัดลอกรหัสมีดังนี้:
ฟังก์ชัน A () {
this.name = 'a';
-
var a1 = ใหม่ a ();
สิ่งนี้คล้ายกับภาษาทั่วไปอื่น ๆ
จากนั้นการแก้ไขคุณสมบัติของต้นแบบที่ชี้ไปที่วัตถุจะส่งผลกระทบต่อทุกกรณีที่สร้างขึ้นด้วยเทมเพลต
การคัดลอกรหัสมีดังนี้:
ฟังก์ชัน A () {
this.name = 'a';
-
var a1 = ใหม่ a ();
A.prototype.age = 1;
การแจ้งเตือน (a1.age);
ผลลัพธ์: 1
แล้วทำไมวัตถุ A1 จึงสามารถเข้าถึงแอตทริบิวต์อายุได้โดยตรง ฉันไม่ได้กำหนดแอตทริบิวต์อายุในวัตถุ A1
นั่นเป็นเพราะจะมีการอ้างอิงในทุกกรณี _proto_ (สามารถเข้าถึงได้โดยตรงภายใต้ firfox, chrome แต่คือไม่รองรับ) ชี้ไปที่ต้นแบบนี้ที่นี่มันชี้ไปที่ @a,
การคัดลอกรหัสมีดังนี้:
ฟังก์ชัน A () {
this.name = 'a';
-
var a1 = ใหม่ a ();
การแจ้งเตือน (a1._proto_ == a.prototype)
ผลลัพธ์: จริง
เมื่อเข้าถึงแอตทริบิวต์คุณจะค้นหาในวัตถุ A1 ก่อน ไม่พบคุณจะกลับมาที่ไม่ได้กำหนด
ณ จุดนี้ความหมายของห่วงโซ่ต้นแบบออกมา Object.prototype เป็นต้นแบบระดับบนสุดดังนั้นหากมีการแก้ไขคุณสมบัติ Object.prototype มันจะส่งผลกระทบต่อวัตถุทั้งหมด
กำลังดูรหัสชิ้นหนึ่ง
การคัดลอกรหัสมีดังนี้:
ฟังก์ชัน A () {
this.name = 'a';
-
ฟังก์ชั่น b () {
this.age = 1;
-
b.prototype = new a ();
การแจ้งเตือน (ใหม่ B (). ชื่อ);
เราแสดงให้เห็นว่า B ชี้ต้นแบบของ B ไปยังอินสแตนซ์ของ A และจากนั้นอินสแตนซ์ของ B ยังสามารถเข้าถึงคุณสมบัติของ A นี่คือมรดกของ JavaScript ดังนั้นทำไม B.Prototype จึงชี้ไปที่อินสแตนซ์ของ A แทนที่จะชี้ไปที่ A.Prototype โดยตรง?
การคัดลอกรหัสมีดังนี้:
b.prototype = ใหม่ a.prototype;
หากคุณปรับเปลี่ยนคุณสมบัติใน P.Prototype ตามที่เขียนไว้ข้างต้นต้นแบบของ A จะเปลี่ยนไปเช่นกันซึ่งเทียบเท่ากับคลาสย่อยที่ปรับเปลี่ยนคลาสแม่และคุณสมบัติของคลาสย่อยและคลาสพาเรนต์รวมกันซึ่งเห็นได้ชัดว่าเห็นได้ชัด ไม่เหมาะสม กล่าวอีกนัยหนึ่ง B ก็กลายเป็นตัวสร้างของ @A และ A และ B กลายเป็นความสัมพันธ์แบบขนาน
เราสามารถกำหนดได้ต่อไป:
ฟังก์ชั่น A ฟังก์ชั่นการสืบทอด B ซึ่งเป็นตัวสร้างที่ทำให้ฟังก์ชั่นกลายเป็นอินสแตนซ์ของต้นแบบของฟังก์ชัน B
การคัดลอกรหัสมีดังนี้:
var $ = jQuery = function (ตัวเลือกบริบท) {
// มันเป็นไปไม่ได้ที่จะสร้างตัวเองอีกครั้งในคอนสตรัคเตอร์ของคุณเองดังนั้นอินสแตนซ์ของตัวสร้างอื่นจึงถูกส่งคืน
ส่งคืน init ใหม่ (ตัวเลือกบริบท);
-
jQuery.fn = jQuery.prototype = {
ขนาด: ฟังก์ชัน () {
ส่งคืนสิ่งนี้ความยาว;
-
-
ฟังก์ชั่น init (ตัวเลือกบริบท) {
-
init.prototype = jQuery.fn ;;
-
นี่คือซอร์สโค้ดของ JQuery เมื่อเราใช้ jQuery เราไม่ได้ใช้คำหลักใหม่
การใช้ความรู้ข้างต้นสามารถอธิบายได้ว่า jQuery เป็นเพียงการเรียกใช้ฟังก์ชั่นทั่วไปซึ่งส่งคืนวัตถุที่สร้างขึ้นโดยตัวสร้างรายอื่นของต้นแบบ jQuery นั่นคือ init ใหม่ ()