มีหลายวิธีในการกำหนดคลาสใน JS:
1. วิธีโรงงาน
การคัดลอกรหัสมีดังนี้:
Function Car () {
var ocar = วัตถุใหม่;
ocar.color = "สีน้ำเงิน";
ocar.doors = 4;
ocar.showColor = function () {
document.write (this.color)
-
คืน ocar;
-
var car1 = car ();
var car2 = car ();
เมื่อมีการเรียกฟังก์ชั่นนี้วัตถุใหม่จะถูกสร้างขึ้นและมีการกำหนดคุณสมบัติและวิธีการทั้งหมด ใช้ฟังก์ชั่นนี้เพื่อสร้าง 2 วัตถุที่มีคุณสมบัติเดียวกัน แน่นอนพี่สาวของฉันสามารถแก้ไขวิธีนี้ได้โดยส่งพารามิเตอร์ไป
การคัดลอกรหัสมีดังนี้:
Function Car (สี, ประตู) {
var ocar = วัตถุใหม่;
ocar.color = สี;
ocar.doors = ประตู;
ocar.showColor = function () {
document.write (this.color)
-
คืน ocar;
-
var car1 = car ("สีแดง", 4);
var car2 = car ("สีน้ำเงิน", 4);
car1.showcolor () // output: "สีแดง"
car2.showcolor () // output: "Blue"
ตอนนี้คุณสามารถรับวัตถุที่มีค่าที่แตกต่างกันโดยผ่านพารามิเตอร์ที่แตกต่างกันไปยังฟังก์ชัน
ในตัวอย่างก่อนหน้าแต่ละครั้งที่เรียกใช้ฟังก์ชัน Car () เรียกว่า showcolor () ถูกสร้างขึ้นซึ่งหมายความว่าแต่ละวัตถุมีวิธีการแสดงของตัวเอง ()
แต่ในความเป็นจริงแต่ละวัตถุมีฟังก์ชั่นเดียวกัน
แม้ว่าวิธีการสามารถกำหนดไว้นอกฟังก์ชั่นได้ แต่โดยการชี้คุณสมบัติของฟังก์ชันไปยังวิธีการ
การคัดลอกรหัสมีดังนี้:
ฟังก์ชั่น showcolor () {
การแจ้งเตือน (this.color);
-
Function Car () {
var ocar = วัตถุใหม่ ();
ocar.color = สี;
ocar.doors = ประตู;
ocar.showColor = ShowColor;
คืน ocar;
-
แต่นี่ไม่เหมือนวิธีการฟังก์ชั่น
2. วิธีตัวสร้าง
วิธีตัวสร้างนั้นง่ายเหมือนวิธีโรงงานดังที่แสดงด้านล่าง:
การคัดลอกรหัสมีดังนี้:
Function Car (สี, ประตู) {
this.color = color;
this.doors = ประตู;
this.showColor = function () {
Alert (this.color)
-
-
var car1 = รถใหม่ ("สีแดง", 4);
var car2 = รถใหม่ ("สีน้ำเงิน", 4);
คุณจะเห็นว่าวิธีการสร้างไม่ได้สร้างวัตถุภายในฟังก์ชั่นและคำหลักที่ใช้ เนื่องจากวัตถุถูกสร้างขึ้นเมื่อเรียกตัวสร้างและสิ่งนี้สามารถใช้ในการเข้าถึงคุณสมบัติของวัตถุภายในฟังก์ชั่นเท่านั้น
ตอนนี้ใช้ใหม่เพื่อสร้างวัตถุดูเหมือนว่า! แต่มันก็เหมือนกับโรงงาน การโทรแต่ละครั้งจะสร้างวิธีการของตัวเองสำหรับวัตถุ
3. วิธีการต้นแบบ
วิธีนี้ใช้ประโยชน์จากแอตทริบิวต์ต้นแบบของวัตถุ ขั้นแรกให้สร้างชื่อคลาสด้วยฟังก์ชั่นที่ว่างเปล่าจากนั้นแอตทริบิวต์และวิธีการทั้งหมดจะถูกกำหนดให้กับแอตทริบิวต์ต้นแบบ
การคัดลอกรหัสมีดังนี้:
Function Car () {
-
car.prototype.color = "สีแดง";
car.prototype.doors = 4;
car.prototype.showColor = function () {
การแจ้งเตือน (this.color);
-
var car1 = รถใหม่ ();
var car2 = รถใหม่ ();
ในรหัสนี้ฟังก์ชั่นที่ว่างเปล่าจะถูกกำหนดไว้ก่อนจากนั้นคุณสมบัติของวัตถุจะถูกกำหนดผ่านแอตทริบิวต์ต้นแบบ เมื่อเรียกใช้ฟังก์ชั่นนี้คุณสมบัติทั้งหมดของต้นแบบจะถูกกำหนดให้กับวัตถุที่จะสร้างทันที วัตถุทั้งหมดในฟังก์ชั่นนี้จัดเก็บพอยน์เตอร์เพื่อแสดง () ซึ่งดูเหมือนว่าจะเป็นของวัตถุเดียวกัน
อย่างไรก็ตามฟังก์ชั่นนี้ไม่มีพารามิเตอร์และแอตทริบิวต์ไม่สามารถเริ่มต้นได้โดยการผ่านพารามิเตอร์ ค่าเริ่มต้นของแอตทริบิวต์จะต้องเปลี่ยนแปลงหลังจากสร้างวัตถุ
ปัญหาที่ร้ายแรงมากเกี่ยวกับวิธีการต้นแบบคือเมื่อแอตทริบิวต์ชี้ไปที่วัตถุเช่นอาร์เรย์
การคัดลอกรหัสมีดังนี้:
Function Car () {
-
car.prototype.color = "สีแดง";
car.prototype.doors = 4;
car.prototype.arr = อาร์เรย์ใหม่ ("a", "b");
car.prototype.showColor = function () {
การแจ้งเตือน (this.color);
-
var car1 = รถใหม่ ();
var car2 = รถใหม่ ();
car1.arr.push ("CC");
การแจ้งเตือน (car1.arr); // เอาท์พุท: AA, BB, CC
การแจ้งเตือน (car2.arr); // เอาท์พุท: AA, BB, CC
ที่นี่เนื่องจากค่าอ้างอิงของอาร์เรย์วัตถุรถยนต์ทั้งสองชี้ไปที่อาร์เรย์เดียวกันดังนั้นเมื่อเพิ่มค่าใน Car1 คุณสามารถเห็นได้ใน Car2
ยูเนี่ยนเป็นวิธีที่สามารถสร้างวัตถุเช่นภาษาการเขียนโปรแกรมอื่น ๆ โดยใช้ตัวสร้าง/ต้นแบบ มันเป็นวิธีการที่ใช้ตัวสร้างเพื่อกำหนดคุณสมบัติที่ไม่ใช้งานของวัตถุและใช้ต้นแบบเพื่อกำหนดวัตถุ
การคัดลอกรหัสมีดังนี้:
Function Car (สี, ประตู) {
this.color = color;
this.doors = ประตู;
this.arr = new Array ("AA", "BB");
-
car.prototype.showcolor () {
การแจ้งเตือน (this.color);
-
var car1 = รถใหม่ ("สีแดง", 4);
var car2 = รถใหม่ ("สีน้ำเงิน", 4);
car1.arr.push ("CC");
การแจ้งเตือน (car1.arr); // เอาท์พุท: AA, BB, CC
การแจ้งเตือน (car2.arr); // เอาท์พุท: AA, BB
5. วิธีการต้นแบบแบบไดนามิก
วิธีการต้นแบบแบบไดนามิกนั้นคล้ายกับวิธีการสร้าง/ต้นแบบแบบผสม ความแตกต่างเพียงอย่างเดียวคือตำแหน่งที่กำหนดให้กับวิธีการของวัตถุ
การคัดลอกรหัสมีดังนี้:
Function Car (สี, ประตู) {
this.color = color;
this.doors = ประตู;
this.arr = new Array ("AA", "BB");
if (typeof car._initialized == "undefined") {
car.prototype.showColor = function () {
การแจ้งเตือน (this.color);
-
car._initialized = true;
-
-
วิธีการต้นแบบแบบไดนามิกคือการใช้ธงเพื่อตรวจสอบว่าต้นแบบได้รับการกำหนดวิธีหรือไม่ สิ่งนี้ทำให้มั่นใจได้ว่าวิธีนี้จะถูกสร้างขึ้นเพียงครั้งเดียว
6. วิธีการผสมจากโรงงาน
ครูวัตถุประสงค์ของมันสร้างตัวสร้างปลอมที่ส่งคืนเฉพาะอินสแตนซ์ใหม่ของวัตถุอื่น
การคัดลอกรหัสมีดังนี้:
Function Car () {
var ocar = วัตถุใหม่ ();
ocar.color = "สีแดง";
ocar.doors = 4;
ocar.showColor = function () {
Alert (this.color)
-
คืน ocar;
-
ซึ่งแตกต่างจากวิธีการโรงงานวิธีนี้ใช้ตัวดำเนินการใหม่
ข้างต้นเป็นวิธีการทั้งหมดในการสร้างวัตถุ วิธีที่ใช้กันอย่างแพร่หลายที่สุดคือวิธีการสร้าง/ต้นแบบแบบไฮบริดและวิธีการต้นแบบแบบไดนามิกก็เป็นที่นิยมเช่นกัน ฟังก์ชั่นเทียบเท่ากับวิธีการสร้าง/ต้นแบบ
ข้างต้นเป็นเรื่องเกี่ยวกับบทความนี้ฉันหวังว่าคุณจะชอบมัน