เรารู้ว่าใน JS ไม่มีแนวคิดของชั้นเรียน วัตถุอินสแตนซ์ทั้งหมดของคลาสสืบทอดคุณลักษณะจากวัตถุต้นแบบเดียวกันดังนั้นวัตถุต้นแบบจึงเป็นแกนหลักของคลาส
คลาสเป็นนามธรรมของวัตถุและวัตถุเป็นอินสแตนซ์ที่เป็นรูปธรรมของคลาส ชั้นเรียนเป็นนามธรรมและไม่ครอบครองหน่วยความจำในขณะที่วัตถุเป็นคอนกรีตและครอบครองพื้นที่เก็บข้อมูล --- สารานุกรม Baidu
ข้อกำหนด JavaScript ต้นนั้นง่ายมากโดยทั่วไปเขียนเป็นฟังก์ชั่นตามด้วยการเขียนเชิงกระบวนการ ต่อมามีการแนะนำแนวคิดการพัฒนาเชิงวัตถุค่อยๆได้รับการแนะนำและจากนั้นพวกเขาจะถูกเขียนช้าลงในชั้นเรียน
ใน JS สาระสำคัญของการเขียนลงในชั้นเรียนนั้นเป็นตัวสร้าง + ต้นแบบ ด้านล่างเรามาพูดคุยกันหลายวิธีในการเขียนคลาส JS:
วิธีการสร้าง
/*** คลาสบุคคล: กำหนดบุคคลที่มีแอตทริบิวต์ชื่อและเมธอด getName*/<script> ฟังก์ชั่นบุคคล (ชื่อ) {this.name = name; this.getName = function () {return this.name; }} // เรายกตัวอย่างวัตถุหลายอย่างที่นี่ var p1 = บุคคลใหม่ ("trigkit4"); var p2 = คนใหม่ ("ไมค์"); console.log (p1 instanceof person); // true console.log (p2 instanceof person); // true </script>จากเอาต์พุตคอนโซลข้างต้นเราจะเห็นว่า P1 และ P2 เป็นวัตถุอินสแตนซ์ของคลาสบุคคล ทางด้านซ้ายของตัวดำเนินการอินสแตนซ์ของตัวดำเนินการเป็นวัตถุของคลาสที่จะตรวจพบและทางด้านขวาเป็นตัวสร้างของคลาสที่กำหนดคลาส ที่นี่มีการใช้อินสแตนซ์เพื่อตรวจสอบว่า Object P1 เป็นของคลาสบุคคลหรือไม่
ข้อดีของวิธีนี้คือเราสามารถสร้างอินสแตนซ์วัตถุที่แตกต่างกันตามพารามิเตอร์ ข้อเสียคือทุกครั้งที่เราสร้างวัตถุอินสแตนซ์วิธี getName จะถูกสร้างขึ้นส่งผลให้เกิดการเสียหน่วยความจำ
เราสามารถใช้ฟังก์ชั่นภายนอกแทนวิธีการเรียนเพื่อให้แต่ละวัตถุแบ่งปันวิธีเดียวกัน คลาสที่เขียนใหม่มีดังนี้:
// ฟังก์ชั่นภายนอก <script> ฟังก์ชั่น getName () {return this.name; } ฟังก์ชันบุคคล (ชื่อ) {this.name = name; this.getName = getName; //} </script>วิธีต้นแบบ
<script> function person () {}; person.prototype.name = "trigkit4"; // คุณสมบัติของคลาสถูกวางไว้บน prototype person.prototype.getName = function () {return "I'm" + this.name; } var p1 = คนใหม่ (); var p2 = คนใหม่ (); console.log (p1.name); // trigkit4 console.log (p2.getName ()); // ฉัน Trigkit4 </script>ข้อเสียของวิธีต้นแบบคืออินสแตนซ์ของวัตถุไม่สามารถสร้างผ่านพารามิเตอร์ (โดยทั่วไปคุณสมบัติของแต่ละวัตถุจะแตกต่างกัน) ข้อได้เปรียบคืออินสแตนซ์ของวัตถุทั้งหมดแบ่งปันวิธี getName (สัมพันธ์กับวิธีตัวสร้าง) และไม่มีการสูญเสียหน่วยความจำ
ตัวสร้าง + ต้นแบบ
ใช้ข้อดีของสองคนแรก:
. ใช้ตัวสร้างเพื่อกำหนดคุณลักษณะคลาส (ฟิลด์)
ข. ใช้ต้นแบบเพื่อกำหนดวิธีการเรียน
<script> ฟังก์ชั่นบุคคล (ชื่อ) {this.name = name; } // คุณลักษณะต้นแบบอนุญาตให้อินสแตนซ์ของวัตถุแบ่งปันวิธีการ getName person.prototype.getName = function () {return "ฉัน" + this.name; } </script>ด้วยวิธีนี้เราสามารถสร้างวัตถุที่มีคุณลักษณะที่แตกต่างกันและปล่อยให้อินสแตนซ์ของวัตถุแบ่งปันวิธีการโดยไม่ทำให้หน่วยความจำเสีย
เพื่อให้รหัส JS มีขนาดกะทัดรัดมากขึ้นเราจึงย้ายรหัสวิธีต้นแบบไปยังวงเล็บปีกกาของคนฟังก์ชั่น
<script> ฟังก์ชั่นบุคคล (ชื่อ) {this.name = name; person.prototype.getName = function () {return name; // this.name ไม่เหมาะสม}} var p1 = บุคคลใหม่ ('trigkit4'); console.log (p1.getName ()); // Trigkit4 </script>ที่นี่เราจำเป็นต้องรู้วิธีการหลายวิธีในการกำหนดคลาสนอกเหนือจากตัวสร้างข้างต้นยังมี:
method object.create ()
ด้วยวิธีนี้ "คลาส" เป็นวัตถุไม่ใช่ฟังก์ชั่น
var person = {ชื่อ: "trigkit4", อายุ: 21, run: function () {alert ("ฉันชอบวิ่ง"); -จากนั้นใช้ object.create () โดยตรงเพื่อสร้างอินสแตนซ์โดยไม่ต้องใช้ใหม่
var p1 = object.create (บุคคล); การแจ้งเตือน (p1.age); // 21 p1.run (); // ฉันชอบวิ่ง
วิธีนี้ง่ายกว่า "วิธีการสร้าง" แต่ไม่สามารถใช้แอตทริบิวต์ส่วนตัวและวิธีการส่วนตัวและข้อมูลไม่สามารถแชร์ระหว่างวัตถุอินสแตนซ์ได้ดังนั้นการจำลอง "คลาส" จึงไม่ครอบคลุมเพียงพอ
วิธีการ createnew ()
วิธีนี้ไม่ต้องการสิ่งนี้และต้นแบบ มันคือการใช้วัตถุเพื่อจำลองคลาสจากนั้นกำหนดตัวสร้าง createNew () ในคลาสจากนั้นกำหนดวัตถุอินสแตนซ์ใน createNew () และใช้วัตถุอินสแตนซ์นี้เป็นค่าส่งคืน
<script> var person = {createNew: function () {var person = {}; person.name = "trigkit4"; person.run = function () {Alert ("ฉันชอบวิ่ง"); - คนกลับ; }} </script>เมื่อใช้งานให้เรียกใช้เมธอด createNew () เพื่อรับวัตถุอินสแตนซ์
var p1 = person.createnew (); p1.run (); // ฉันชอบวิ่ง
วิธีการเขียนนี้จริง ๆ แล้วคล้ายกับวิธีการเขียนของตัวอักษรวัตถุยกเว้นว่าหนึ่งถูกคั่นด้วยเครื่องหมายจุลภาคและอื่น ๆ ถูกคั่นด้วยอัฒภาค
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น