คำนำ
มีหลายวิธีในการสร้างวัตถุโดยใช้ JavaScript ทีนี้มาแสดงรายการสี่รายการและแสดงรายการข้อดีและข้อเสียของแต่ละวิธีเพื่อให้คุณสามารถเลือกและใช้งานได้ มาดูกันเถอะ
รูปแบบโรงงาน
ฟังก์ชั่น createperson (ชื่อ, อายุ) {var obj = วัตถุใหม่ (); obj.name = ชื่อ; obj.age = อายุ; คืน OBJ; // อย่าลืมกลับมามิฉะนั้นไม่ได้กำหนด: undefined} var person1 = ใหม่ createperson ('หนุ่ม', 18); console.log (person1.name + ':' + person1.age);ข้อดี: รูปแบบจากโรงงานสามารถแก้ปัญหาการสร้างวัตถุที่คล้ายกันหลายรายการ
ข้อเสีย: ปัญหาการรู้จำวัตถุยังไม่ได้รับการแก้ไข (วิธีการกำหนดประเภทของวัตถุ)
โหมดตัวสร้าง
ฟังก์ชั่นบุคคล (ชื่ออายุ) {this.name = name; this.age = อายุ; } var person1 = คนใหม่ ('หนุ่ม', 18); console.log (person1.name + ':' + person1.age);ก่อนที่จะพูดถึงข้อดีและข้อเสียของเธอมาพูดคุยเกี่ยวกับเรื่องราวของเธอก่อน
ใช้ตัวสร้างเป็นฟังก์ชั่น
ฟังก์ชั่นบุคคล (ชื่ออายุ) {this.name = name; this.age = อายุ; this.sayName = function () {return this.name; }} // ใช้ var person1 = คนใหม่ ('หนุ่ม', 18); person1.SayName (); console.log (person1.name + ':' + person1.age); // โทรหาบุคคล ('ลม', 18); console.log (window.sayname ()); // การเรียก var obj = วัตถุใหม่ (); person.call (obj, 'นก', 100); console.log (obj.sayname ());ข้อดีและข้อเสียของผู้สร้าง
ข้อดี: อินสแตนซ์ของมันสามารถระบุได้ว่าเป็นประเภทเฉพาะ
ข้อเสีย: แต่ละวิธีจะต้องสร้างใหม่ในแต่ละอินสแตนซ์ แน่นอนคุณสามารถเปลี่ยนได้เช่นนี้:
ฟังก์ชั่นบุคคล (ชื่ออายุ) {this.name = name; this.age = อายุ; this.sayname = sayname; } ฟังก์ชั่น saysname () {return this.name; -ให้โทรหาฟังก์ชั่นทั่วโลกแทนดังนั้นจึงไม่มีการห่อหุ้ม - - โหมดต้นแบบต่อไปนี้สามารถทำขึ้นสำหรับข้อบกพร่องนี้
โหมดต้นแบบ
ฟังก์ชั่นบุคคล () {} person.prototype.name = 'Young'; person.prototype.age = 18; person.prototype.sayname = function () {return this.name; } var person1 = คนใหม่ (); console.log (person1.sayname ()); var person2 = คนใหม่ (); console.log (person1.sayname ()); การแจ้งเตือน (person1.sayname === person2.sayname); // person1 และ person2 เข้าถึงฟังก์ชั่น sayname () เดียวกันของกลุ่มคุณลักษณะเดียวกันแม้ว่าค่าที่บันทึกไว้ในต้นแบบสามารถเข้าถึงได้ผ่านอินสแตนซ์ของวัตถุ แต่ค่าที่เก็บไว้ในต้นแบบไม่สามารถเขียนใหม่ผ่านวัตถุอินสแตนซ์
ฟังก์ชั่นบุคคล () {} person.prototype.name = 'Young'; person.prototype.age = 18; person.prototype.sayname = function () {return this.name; } var person1 = คนใหม่ (); var person2 = คนใหม่ (); person1.name = 'ลม'; console.log (person1.sayname ()); // wind console.log (person2.sayname ()); // การแจ้งเตือนหนุ่ม (person1.sayname == person2.sayname); // true true เมื่อเราโทรหา person1.sayName เราจะทำการค้นหาสองครั้งติดต่อกัน ตัวแยกวิเคราะห์แรกกำหนดว่าบุคคลอินสแตนซ์ 1 มีแอตทริบิวต์ sayName หรือไม่ หากมีเราจะเรียกคุณลักษณะของเราเอง หากไม่มีเราจะค้นหาคุณลักษณะในต้นแบบ
ฟังก์ชั่นบุคคล () {} person.prototype.name = 'Young'; person.prototype.age = 18; person.prototype.sayname = function () {return this.name; } var person1 = คนใหม่ (); var person2 = คนใหม่ (); person1.name = 'ลม'; console.log (person1.sayname ()); // wind console.log (person2.sayname ()); // หนุ่มลบ person1.name; console.log (person1.sayname ()); // young console.log (person2.sayname ()); // young ใช้วิธี hasOwnPropertyType เพื่อตรวจสอบว่ามีคุณสมบัติอยู่ในต้นแบบหรือในอินสแตนซ์ วิธีการที่สืบทอดมาจากวัตถุจริงในอินสแตนซ์และเท็จในต้นแบบ
ใช้เมธอด Object.keys() เพื่อระบุคุณสมบัติอินสแตนซ์บนวัตถุ
ฟังก์ชั่นบุคคล () {} person.prototype.name = 'Young'; person.prototype.age = 18; person.prototype.sayname = function () {return this.name; } var keys = object.keys (person.prototype); console.log (ปุ่ม); // ["ชื่อ", "อายุ", "sayname"]ข้อดีและข้อเสียของโหมดต้นแบบ
ข้อดี: ไม่จำเป็นต้องย้ำทุกวิธีในแต่ละอินสแตนซ์
ข้อเสีย: มีเพียงไม่กี่คนที่ใช้โหมดต้นแบบเพียงอย่างเดียว - รายการคำถามในรายละเอียด
ฟังก์ชั่นบุคคล () {} person.prototype = {constructor: บุคคล, ชื่อ: 'หนุ่ม', อายุ: 18, เพื่อน: ['ใหญ่', 'หมู'], sayname: function () {return this.name; - var p1 = คนใหม่ (); var p2 = คนใหม่ (); p1.friends.push ('mon'); console.log (p1.friends); // ["ใหญ่", "หมู", "mon"] console.log (p2.friends); // ["ใหญ่", "หมู", "mon"] มันเป็นเพราะกรณีโดยทั่วไปมีคุณลักษณะของตัวเองและเราวางไว้ใน Person.prototype ที่นี่ดังนั้นด้วยการปรับเปลี่ยนของ P1 อินสแตนซ์ทั้งหมดและต้นแบบได้รับการแก้ไข จากนั้นเราสามารถใช้การรวมกันของโหมดตัวสร้างและโหมดต้นแบบ
ใช้โหมดตัวสร้างและโหมดต้นแบบร่วมกัน
ฟังก์ชั่นบุคคล (ชื่ออายุ) {this.name = name; this.age = อายุ; this.friends = ['big', 'หมู']; } person.prototype = {sayname: function () {return this.name; - var p1 = คนใหม่ ('หนุ่ม', 18); var p2 = คนใหม่ ('ลม', 78); p1.friends.push ('raganya'); console.log (p1.friends); // ["ใหญ่", "หมู", "raganya"] console.log (p2.friends); // ["ใหญ่", "หมู"] console.log (p1.friends == p2.friends); //รูปแบบนี้เป็นวิธีที่ใช้กันอย่างแพร่หลายและเป็นที่รู้จักมากที่สุดในการสร้างประเภทที่กำหนดเอง เป็นโหมดเริ่มต้นที่ใช้ในการกำหนดประเภทการอ้างอิง
สรุป
ข้างต้นคือทั้งหมดที่เกี่ยวกับการวิเคราะห์วิธีการสร้างวัตถุใน JavaScript สี่วิธีและข้อดีและข้อเสียของพวกเขาได้รับการสรุปโดยบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์สำหรับทุกคนในการเรียนรู้ที่จะใช้ JavaScript