英文 | https://medium.com/swlh/javascript-best-practices-creating-objects-b8c231e774d6
翻譯 | web前端開發(ID:web_qdkf)
JavaScript是一種非常寬容的語言。編寫即使有些小錯誤的代碼,依然可以很容易的運行。
在本文中,我們將探討創建JavaScript對象的最佳方法,而不是通過使用Object構造函數。
Don't Use the Object 建設者
Object構造函數允許我們創建一個對象。但是,由於有更短的創建對象的方法,因此不需要創建對象。
例如,代替使用Object構造函數創建對象來編寫以下內容,我們可以編寫爲:
const obj = new Object();obj.a = 1;obj.b = 2;
我們也可以這樣寫:
const obj = { a:1, b:2};
如我們所見,通過直接創建對象文字而不是使用Object構造函數,我們避免了很多額外的代碼輸入。
我們還可以創建構造函數或類來創建模板函數,以用於創建新對象。
例如,我們可以Person使用類語法創建構造函數,以便可以Person使用new運算符創建新的對象。
我們可以編寫以下代碼來創建Person構造函數:
class Person { constructor(name) { this.name = name; }}
在上面的類中,我們有name用於在name實例中設置實例變量的參數Person。
然後,我們可以Person使用它創建多個實例,如下所示:
const jane = new Person('jane');const joe = new Person('joe');const alex = new Person('alex');
在上面的代碼中,我們創建了3個新Person實例,它們具有不同的值,this.name這些值是通過name參數傳遞的。
我們還可以通過編寫以下代碼將實例方法添加到類中:
class Person { constructor(name) { this.name = name; } greet(greeting) { return `${greeting} ${this.name}`; }}
在上面的代碼中,我們有greetinstance方法,該方法接受一個greeting字符串並將其與this.nameinstance變量組合。
然後我們可以這樣稱呼它:
console.log(jane.greet('hi'));console.log(joe.greet('hi'));console.log(alex.greet('hi'));
然後我們得到:
hi janehi joehi alex
記錄在控制檯日誌輸出中,如我們所說greet的那樣傳遞'hi'爲的值greeting。
如我們所見,使用JavaScript類,我們可以創建具有相同實例變量和方法的對象。
創建對象的另一種方法是使用Object.create方法。此方法很有用,因爲我們可以在創建對象時設置對象的原型。
例如,如果我們要創建一個以另一個對象作爲原型的對象,則可以編寫以下代碼:
const bar = { a:1}const foo = Object.create(bar);foo.b = 1;foo.c = 2;
在上面的代碼中,我們有了bar對象,該foo對象通過使用Object.create方法用作對象的原型。
然後我們增加額外的屬性b和c對foo對象本身。b並且c是foo自己的,還是非繼承財產,a是原型的財產foo。
原型是子對象的模板對象。對象從其原型繼承屬性。
如果我們記錄該foo對象,則會得到foo的__proto__屬性具有a其值設置爲1的屬性。
如果要創建沒有原型的對象,則可以Object.create使用參數調用該方法,null以便__proto__不設置該屬性。
例如,我們可以編寫以下代碼來創建對象:
const foo = Object.create(null);foo.b = 1;foo.c = 2;
然後,如果我們記錄的值foo,我們將看到它沒有__proto__屬性,這意味着該對象沒有原型。
結論
有很多方法可以簡潔地創建對象。我們不應該只使用Object構造函數來創建對象。
這是因爲與定義對象文字相比,它沒有任何好處。它們都繼承Object和使用構造函數是完成同一件事,但他們各自方法有所不同。
創建對象的替代方法,包括使用類作爲新對象的模板。
最後,我們可以使用Object.create來創建具有所需原型的對象。