โค้ดเบิร์นของโอบเจกต์ JavaScript

ตัวอย่าง

function Person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;
}

ทดลองด้วยตัวเอง

用大写首字母对构造器函数命名是个好习惯。

对象类型（蓝图）（类）

前一章的实例是有限制的。它们只创建单一对象。

有时我们需要创建相同“类型”的许多对象的“蓝图”。

创建一种“对象类型”的方法，是使用对象构造器函数。

在上面的例子中，函数 Person() 就是对象构造器函数。

通过 new 关键词调用构造器函数可以创建相同类型的对象：

var myFather = new Person("Bill", "Gates", 62, "blue");
var myMother = new Person("Steve", "Jobs", 56, "green");

ทดลองด้วยตัวเอง

this 关键词

在 JavaScript 中，被称为 this 的事物是代码的“拥有者”。

this 的值，在对象中使用时，就是对象本身。

ในฟังก์ชันสร้างthis ไม่มีค่า มันเป็นสิ่งที่แทนที่ตัววัตถุใหม่ ตอนที่วัตถุใหม่ถูกสร้าง ค่าของ this จะกลายเป็นวัตถุใหม่นั้น

โปรดจำแนกเจตนา this มันไม่ใช่ตัวแปร มันคือคำสั่งพิเศษ。คุณไม่สามารถเปลี่ยนค่าของ this ได้

เพิ่มตัวแปรให้กับตัวแปร

การเพิ่มตัวแปรใหม่ให้กับตัวแปรที่มีอยู่แล้วง่ายดาย:

ตัวอย่าง

myFather.nationality = "English";

ทดลองด้วยตัวเอง

ตัวแปรใหม่ถูกเพิ่มไปที่ myFather ไม่ใช่ myMother หรือตัวแปร person อื่นๆ

เพิ่มวิธีการให้กับตัวแปร

การเพิ่มวิธีการใหม่ให้กับตัวแปรที่มีอยู่แล้วง่ายดาย:

ตัวอย่าง

myFather.name = function () {
    return this.firstName + " " + this.lastName;
};

ทดลองด้วยตัวเอง

วิธีการใหม่ถูกเพิ่มไปที่ myFather ไม่ใช่ myMother หรือตัวแปร person อื่นๆ

เพิ่มตัวแปรให้กับเครื่องสร้างตัวแปร

ต่างจากการเพิ่มตัวแปรใหม่ให้กับตัวแปรที่มีอยู่แล้ว คุณไม่สามารถเพิ่มตัวแปรใหม่ให้กับเครื่องสร้างตัวแปรของตัวแปรได้

ตัวอย่าง

Person.nationality = "English";

ทดลองด้วยตัวเอง

ถ้าคุณต้องการเพิ่มตัวแปรใหม่ให้กับเครื่องสร้างตัวแปร คุณจะต้องเพิ่มมันไปที่ฟังก์ชันเครื่องสร้างตัวแปร:

ตัวอย่าง

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
    this.nationality = "English";
}

ทดลองด้วยตัวเอง

ดังนั้น ตัวแปรของตัวแปรจะสามารถมีค่าเริ่มต้นได้

เพิ่มวิธีการให้กับเครื่องสร้างตัวแปร

ฟังก์ชันเครื่องสร้างตัวแปรของคุณก็สามารถกำหนดวิธีการได้:

ตัวอย่าง

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
    this.name = function() {return this.firstName + " " + this.lastName;};
}

ทดลองด้วยตัวเอง

ต่างจากการเพิ่มวิธีการใหม่ให้กับตัวแปรที่มีอยู่แล้ว คุณไม่สามารถเพิ่มวิธีการใหม่ให้กับเครื่องสร้างตัวแปรของตัวแปรได้

ต้องมีการเพิ่มวิธีการในภายในฟังก์ชันเครื่องสร้างตัวแปร:

ตัวอย่าง

function Person(firstName, lastName, age, eyeColor) {
    this.firstName = firstName;  
    this.lastName = lastName;
    this.age = age;
    this.eyeColor = eyeColor;
    this.changeName = function (name) {
        this.lastName = name;
    };
}

function changeName() ฟังก์ชันจะกำหนดค่าของ name ให้กับตัวแปร lastName ของ person。

ตอนนี้คุณสามารถทดสอบได้:

myMother.changeName("Jobs");

ทดลองด้วยตัวเอง

ด้วย myMother แทนที่ thisJavaScript สามารถรู้ได้ว่ามันกำลังจัดการกับ person ใดของตอนนี้。

constructor ที่มีอยู่ใน JavaScript

JavaScript มี constructor สำหรับสมบัติต้นแบบ:

ตัวอย่าง

var x1 = new Object();    // สมบัติ Object ใหม่
var x2 = new String();    // สมบัติ String ใหม่
var x3 = new Number();    // สมบัติ Number ใหม่
var x4 = new Boolean();   // สมบัติ Boolean ใหม่
var x5 = new Array();     // สมบัติ Array ใหม่
var x6 = new RegExp();    // สมบัติ RegExp ใหม่
var x7 = new Function();  // สมบัติ Function ใหม่
var x8 = new Date();      // สมบัติ Date ใหม่

ทดลองด้วยตัวเอง

Math() สมบัติไม่อยู่ในบรรดานี้. Math คือสมบัติโลกnew คำศัพท์ไม่สามารถใช้ใน Math。

คุณรู้ไหม?

เช่นที่เห็นได้จากบนนี้ JavaScript มีสมบัติตัวแปรต้นแบบ ของตัวแปรสตริง ตัวเลข และตัวแปรบูลทรรศน์ แต่ไม่มีเหตุผลที่จะสร้างสมบัติตัวแปรที่ซับซ้อน! ค่าต้นแบบดังกล่าวเร็วมากที่แสน!

กรุณาใช้ Object literal {} แทนที่ new Object()。

กรุณาใช้ String literal "" แทนที่ new String()。

กรุณาใช้ Number literal แทน Number()。

กรุณาใช้ Boolean literal แทน new Boolean()。

กรุณาใช้ Array literal [] แทนที่ new Array()。

กรุณาใช้ pattern literal แทน new RexExp()。

กรุณาใช้ Function expression () {} แทนที่ new Function()。

ตัวอย่าง

var x1 = {};            // สมบัติตัวแปรต้นแบบใหม่
var x2 = "";            // ตัวแปรสตริงต้นแบบใหม่
var x3 = 0;             // ตัวเลขต้นแบบใหม่
var x4 = false;         // ค่าตัวแปรต้นแบบใหม่
var x5 = [];            // วัตถุแบบมาตรา
var x6 = /()/           // วัตถุแบบแพทเทอร์น
var x7 = function(){};  // วัตถุฟังก์ชันใหม่

ทดลองด้วยตัวเอง

วัตถุตัวอักษร

โดยทั่วไป ตัวอักษรถูกสร้างเป็นค่าตัวเดี่ยว: var firstName = "Bill"

แต่ก็สามารถใช้ new ใช้คำสั่งเพื่อสร้างวัตถุตัวอักษร: var firstName = new String("Bill")

กรุณาใช้ JS ตัวอักษรในบทนี้เราจะเรียนรู้เหตุผลที่ไม่ควรทำให้ตัวอักษรเป็นวัตถุ

วัตถุตัวเลข

โดยทั่วไป ตัวเลขถูกสร้างเป็นค่าตัวเดี่ยว: var x = 456

แต่ก็สามารถใช้ new ใช้คำสั่งเพื่อสร้างวัตถุตัวเลข: var x = new Number(456)

กรุณาใช้ JS ตัวเลขในบทนี้เราจะเรียนรู้เหตุผลที่ไม่ควรทำให้ตัวเลขเป็นวัตถุ

วัตถุบูล

โดยทั่วไป ค่าทางหลักความคิดถูกสร้างเป็นค่าตัวเดี่ยว: var x = false

แต่ก็สามารถใช้ new ใช้คำสั่งเพื่อสร้างวัตถุทางหลักความคิด: var x = new Boolean(false)

กรุณาใช้ JS ทางหลักความคิดในบทนี้เราจะเรียนรู้เหตุผลที่ไม่ควรทำให้ค่าทางหลักความคิดเป็นวัตถุ