建立對象的4種方式

建立對象的4種方式

• 方式一：經過對象字面量表示法（又稱爲直接量、原始方式）。object literals
• 方式二：經過new和構造函數Object()、String()等。
• 方式三：用自定義構造函數來初始化新對象。
• 方式四：經過Object.create()

方式一：經過對象字面量表示法（又稱爲直接量、原始方式）object literals

var obj = {name:"zyx456"};

對象字面量是一個名/值對列表，每一個名/值對之間用逗號分隔，名和值之間用冒號分隔，最後總體用一個花括號括起來。

屬性名可使用數值，好比5。數值屬性名會自動轉換爲字符串。

var person = {"name" : "Nicholas","age" : 29,5 : true};

屬性名通常不加引號，如下狀況必須加引號：

• 屬性名中有空格，
• 有連字符「-」
• 有關鍵字，好比「for」。

在ES5（以及ES3的一些實現）中，保留字能夠用作不帶引號的屬性名。然而對於ES3來講，使用保留字做爲屬性名必須使用引號引發來。

例子：

var person = {
    name : "Nicholas",
    age : 29};

在ES5中，對象直接量中的最後一個屬性後的逗號能夠省略，且在ES3的大部分實現中也能夠忽略這個逗號，但在IE中則報錯。

使用對象字面量語法時，若是留空其花括號，則能夠定義只包含默認屬性和方法的空對象。

var obj = {};

對象字面量也能夠先建立，再添加屬性和方法。

var person = {};         //與new Object()相同
person.name = "Nicholas";
person.age = 29;

在經過對象字面量定義對象時，實際上不會調用Object構造函數。

對象能夠嵌套對象：

例如：

var myHome={
        population : "10,000" ,
        area : "10,000" ,
        adress : {  // 屬性
                country : "China" ,
                province : "shanxi" ,
                city : "xian"
            },
        say : function(){  // 方法
                return "My hometown is very beautiful ! ";
            }
    }

或

//構造嵌套的對象
var SchoolData = {
    code: "0123-456-789",
    Tel: "0551-1234567",
    Fax: "0551-7654321"
};
//構造被嵌入的對象
var ZGKJDX = {
    name: "中國科技大學",
    address: "安徽·合肥",
    grade: "高等學府",
    number: "13400",
    //嵌套對象SchoolData
    data: SchoolData,
};

有一個缺點：若是咱們想在其餘地方建立一個一樣的對象，就得把這個對象的全部代碼都複製粘貼過去。咱們須要一種可以批量建立一樣對象的方法，而不是隻建立一個對象。

有一個問題：即沒法保證屬性的順序。

添加屬性的順序可能並非遍歷輸出屬性時的順序。

例如

var o = {}
o.a = 1
o.b = 2
o.c = 3
for(key in o) console.log(key); // expected a,b,c - but not guaranteed to be in that order

Object 對象也缺少forEach的方法，不能對object使用一般的迭代方法。

o.forEach // undefined

方式二：經過new和構造函數Object()、String()等。

var obj = new Object();

這裏的函數稱作構造函數（constructor）。

以下所示：

var person = new Object();
person.name = "Nicholas";
person.age = 29

若是構造函數無參數，括號則不是必需的。

所以能夠採用下面的形式重寫上面的兩行代碼：

var oObject = new Object;
var oStringObject = new String;

var str  = new String();
console.log(str); // 輸出的是 String{length:0,[[PrimitiveValue]]:""}
console.log(typeof str);//object;

結果：

JS原始類型都包含內置構造函數。例如：

var o = new Object();           // 建立一個空對象，和{}同樣
var a = new Array();            // 建立一個空數組，和[]同樣
var d = new Date();             // 建立一個表示當前時間的Date對象
var r = new RegExp("js");       //建立一個能夠進行模式匹配的EegExp對象

在JS中，經過 new 運算符來做用與一個函數，實質上會發生這樣的過程：

首先，建立一個空對象，而後用函數的apply方法，將這個空對象傳入做爲 apply 的第一個參數，做爲上下文參數。也就是this的指向。

var triangle = new Shape("triangle");
    //上一句至關於下面的代碼
var triangle = {};
Shape.apply(triangle, ["triangle"]);

方式三：用自定義構造函數來初始化新對象。

function A(o){
this.name = "moyu"
}
let obj = new a();

例子：

function person(firstname,lastname,age,eyecolor){
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
}
var myFather=new person("Bill","Gates",56,"blue");
var myMother=new person("Steve","Jobs",48,"green");

在自定義構造函數的內部定義對象的方法：

function person(firstname,lastname,age,eyecolor)
{
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
 
    this.changeName=changeName;
    function changeName(name)
    {
        this.lastname=name;
    }
}

changeName() 函數 name 的值賦給 person 的 lastname 屬性。

myMother.changeName("Ballmer");

---

方式四：經過Object.create()

Object.create()是一個靜態函數，而不是提供給某個對象實例調用的方法。

var o1 = Object.create({x:1, y:2}); // o1繼承了屬性x和y

能夠經過任意原型建立新對象（換句話說，能夠繼承任意對象）。

第一個參數是這個新對象的原型。

第二個參數屬性描述符對象propertiesObject，用於對對象的屬性進行進一步描述。可選。

屬性描述符對象中的屬性，默認不可枚舉，是繼承的屬性。

若是propertiesObject指定爲 undefined，那麼是空對象{}。

若是是null或非原始包裝對象，則拋出一個 TypeError 異常。

o = Object.create(Object.prototype, {
    // foo會成爲所建立對象的數據屬性
    foo: {
        writable:true,
        configurable:true,
        value: "hello"
    },
    // bar會成爲所建立對象的訪問器屬性
    bar: {
        configurable: false,
        get: function() { return 10 },
        set: function(value) {
            console.log("Setting `o.bar` to", value);
        }
    }
});

返回一個新對象，帶着指定的原型對象和屬性。

例子：

var obj = Object.create({}, {p: {value: 42}});
Object.values(obj); // => []

上面代碼中，Object.create()方法的第二個參數添加的對象屬性（屬性p），若是不顯式聲明，默認是不可遍歷的，由於p是繼承的屬性，而不是對象自身的屬性。

能夠經過傳入參數null來建立一個沒有原型的新對象，但經過這種方式建立的對象不會繼承任何東西，甚至不包括基礎方法，好比toString()，也就是說，它將不能和「+」運算符一塊兒正常工做：

var o2 = Object.create(null);      //o2不繼承任何屬性和方法

若是想建立一個普通的空對象（好比經過{}或new Object()建立的對象），須要傳入Object.prototype：

var o3 = Object.create(Object.prototype);  //o3和{}和new Object()同樣

例子：經過原型繼承建立一個新對象。

inherit() 返回了一個繼承自原型對象p的新對象。

這裏使用ES5中的Object.create()函數(若是存在的話)。

若是不存在Object.create()，則退化使用其餘方法。

function inherit(p) {
        if (p == null) throw TypeError();       // p是一個對象，但不能是null
        if (Object.create)   return Object.create(p);   // 若是Object.create()存在，直接使用它
        var t = typeof p;                       // 不然進行進一步檢測
        if (t !== "object" && t !== "function") throw TypeError();
        function f() {};                        // 定義一個空構造函數
        f.prototype = p;                        //將其原型屬性設置爲p
        return new f();                         //使用f()建立p的繼承對象
}
var o = {};    
o.x = 1;      
var p = inherit(o); // p繼承o和Object.prototype
p.y = 2;        
var q = inherit(p); 
q.z = 3;      
var s = q.toString(); 
q.x + q.y       // => 3: x和y分別繼承自o和p

注意，inherit()並不能徹底代替Object.create()，它不能經過傳入null原型來建立對象，並且不能接收可選的第二個參數。

inherit()函數的其中一個用途就是防止庫函數無心間（非惡意地）修改那些不受你控制的對象。

不是將對象直接做爲參數傳入函數，而是將它的繼承對象傳入函數。

當函數讀取繼承對象的屬性時，實際上讀取的是繼承來的值。

若是給繼承對象的屬性賦值，則這些屬性只會影響這個繼承對象自身，而不是原始對象：

var o = { x: "don't change this value" };
library_function(inherit(o));   // 防止對o的意外修改