在Js中，除了Array、Date、Number等內建物件外，開發者可以通過Js程式碼建立自己的物件。

目錄

1. 物件特性：描述物件的特性

2. 建立物件方式：物件直接量、new 建構函式、Object.create() 等三種方式

3. 序列化物件：序列化和反序列化物件

4. 面向物件程式設計：描述自定義物件的面向物件模擬；包含例項成員、靜態成員等等

5. 繼承：描述物件的繼承特性。

1. 物件特性

① 結構類似'字典' ：物件的屬性類似鍵/值對；屬性的名稱為字串，屬性的值為任意型別。

② 原型繼承：Js的物件可繼承原型的屬性。

③ 動態結構：可動態新增、刪除物件的屬性。

④ 引用型別：js中的物件為引用型別。a為一個物件，b=a，修改b也會造成a的修改。

2. 建立物件方式

Js中建立自定義物件，主要通過三種方式：物件直接量、new 建構函式以及Object.create()方法。每一種建立方式繼承的原型物件都不同：

① 物件直接量：原型為Object.prototype。

② new 建構函式：原型為建構函式的prototype屬性。

③ Object.create()：原型為傳入的第一個引數，若第一個引數為null，以Object.prototype為原型。

2.1 物件直接量

說明：直接通過 屬性名/值來建立。

語法：var o = { name:'tom', age:22 };

原型：Object.prototype 

適用場景：應用在某一特定的作用域裡。

示例：

var o = {
    name: 'tom'
}
console.log(o.constructor.prototype); // => Object() ：物件直接量的原型為Object
console.log(o.constructor.prototype === Object.prototype); // true

2.2 new 建構函式

說明：建構函式也是種函式，但為了區分平常所用的函式，建構函式的函式名採用大駱駝峰寫法(首字母大寫)。

語法：var o = new ClassName();

原型：建構函式的prototype屬性。

示例：

// 1.建立建構函式
function People(name) {
    this.name;
}

var p = new People('Tom');
console.log(p.constructor.prototype); // => People{} ：原型為建構函式的prototype
console.log(p.constructor.prototype === People.prototype); // => true

// 2.自定義物件的多層繼承 ：constructor返回最先呼叫的建構函式 
function Student(age) {
    this.age = age;
}
Student.prototype = new People(); // 設定Student的原型為People物件

var s = new Student(22); // 物件初始化時，先呼叫People()，再呼叫Student()
console.log(s.constructor); // => function People ：物件s返回的建構函式為People
console.log(s.constructor.prototype); // => People{} ：原型物件為People
console.log(s.constructor.prototype === People.prototype); // => true

2.3 Object.create(prototype, propertyDescriptor) ：ECMAScript 5規範

說明：建立並返回一個指定原型和指定屬性的物件。

語法：Object.create(prototype, propertyDescriptor)

引數：

①prototype {prototype} ：建立物件的原型，可以為null。若為null，物件的原型為undefined。

②propertyDescriptor {propertyDescriptor} 可選：屬性描述符。

原型：默然原型型為①參；若①參為null，物件的原型為undefined。

示例：

// 1.建立一個原型為null的物件
var o = Object.create(null, {
    name: {
        value: 'tom'
    }
});
console.log(o.constructor); // => undefined 

// 2.建立一個原型為Array的物件
var array = Object.create(Array.prototype, {});
console.log(array.constructor); // => function Array 建構函式 
console.log(array.constructor.prototype); // => [] ：原型物件為陣列

// 3.建立一個原型為自定義類的物件
function People() { }
var p = Object.create(People.prototype, {});
console.log(p.constructor); // => function People 建構函式 
console.log(p.constructor.prototype); // => People{} ：原型物件People

3. 序列化

　　Js中通過呼叫JSON方法，可以將物件序列化成字串，也可以將字串反序列化成物件。

3.1 JSON.stringify(object) ：序列化物件；把物件轉換成一個字串。

引數：

①object {Object} ：任意物件

返回值：

{string} 返回一個轉換後的字串。

示例：

var o = {
    x: 1,
    y: 2
}

JSON.stringify(o); // => {"x":1,"y":2}：返回一個字串 

3.2 JSON.parse(jsonStr) ：將一個Json字串轉換為物件。

引數：

① jsonStr {JsonString} ：一個Json字串；字串中的屬性名稱要用引號框起來

返回值：

{Object} 返回一個轉換後的物件

示例：

var str = '{ "x":1,"y":2 }'; // 字串的屬性名要用引號框起來
var o = JSON.parse(str);
console.log(o.x); // => 1：輸出物件屬性x的值

4. 面向物件程式設計

　　模擬高階語言的中的物件；描述高階物件中的例項成員、靜態成員、繼承等特性。

4.1 this關鍵字

說明：在建立物件的建構函式、方法成員中，this指向為例項物件本身。

示例：

var o = {
    x: 1,
    y: 2,
    sayHello: function () {
        console.log(this.x); // => 1：讀取例項物件屬性x的值
        console.log(x); // => 報錯：讀取的是變數x
    }
};
o.sayHello();

4.2 例項成員

語法：例項物件.屬性名稱 或者 例項物件[屬性名稱]

有以下幾種新增方式：

① 在建立物件的方式中(建構函式、物件直接量等)，對this進行新增成員操作。

② 對類名的原型物件新增成員。

③ 對例項物件新增成員(隻影響新增的例項，其他例項不會有此成員)。

示例：

// 1.在建立物件方式中，對this進行操作
function People(name) {
    this.name = name;
}
var p = new People('tom');
console.log(p.name); // => tom ：讀取例項屬性name的值

// 2.在類的原型物件中進行擴充套件操作
People.prototype.sayHello = function () {
    alert('Hello:' + this.name);
}
p.sayHello(); // => 彈出 Hello:tom 

4.3 靜態成員

說明：通過類名直接呼叫

語法：類名.屬性名稱

新增方式：直接在類名上新增成員。

示例：

function People(name) {
    this.name = name;
}
// 給類新增一個靜態成員hasName：判斷People例項是否含有name屬性
People.hasName = function (p) {
    if (p.name && p.name.length > 0) {
        return true;
    }
    return false;
}

var p = new People('tom');
People.hasName(p); // => true

5. 繼承

　　js通過對原型的操作，可以模擬高階語言物件中的繼承特性。

5.1 單層繼承

說明：對類的原型物件(className.prototype)新增成員後，此類的所有例項物件都會增加此成員。

示例：

function People(name) {
    this.name = name;
}
var p1 = new People('張三');
var p2 = new People('李四');

// p1.sayName(); // 報錯，例項沒有此成員

// 對原型物件新增成員， 類的所有例項都會新增此成員
People.prototype.sayName = function () {
    alert(this.name);
}

p1.sayName(); // 彈出name屬性的值
p2.sayName(); // 彈出name屬性的值

5.2 多層繼承

說明：

若類的原型物件(className.prototype)指向為某個物件後，此類將會繼承物件的所有例項成員，但不會繼承物件的靜態成員。

示例：

function People(name) {
    this.name = name;
    this.sayName = function () {
        alert(this.name);
    }
}

function Student(age) {
    this.age = age;
}
Student.prototype = new People(); // 設定Student的原型物件為Prople例項物件

var st = new Student(22);
st.name = '張三';
st.sayName(); // => alert('張三') ：sayName成員繼承自People類