1.對(duì)象字面量是創(chuàng)建對(duì)象的最簡單方式

創(chuàng)建對(duì)象的最簡單方法是使用對(duì)象字面量。我們在花括號(hào) {} 中定義了一組屬性，用逗號(hào)分隔。下面是一個(gè)例子。

const game = {
  name: 'Fornite',
  developer: 'Epic Games'
};

前一個(gè)對(duì)象有兩個(gè)屬性。第一個(gè)屬性具有鍵名和值 Fornite。

2. 對(duì)象是屬性的動(dòng)態(tài)集合

事實(shí)上，對(duì)象是道具的動(dòng)態(tài)集合。

創(chuàng)建對(duì)象后，我們可以從中添加、編輯或刪除屬性。下面是在前一個(gè)游戲?qū)ο笾刑砑雍蛣h除 year 屬性的示例。

game.year = 2017;
delete game.year;

3. 可以使用點(diǎn)和括號(hào)符號(hào)訪問屬性

當(dāng)鍵是有效標(biāo)識(shí)符時(shí)，可以使用點(diǎn)符號(hào)訪問屬性。

console.log(game.name)

當(dāng)鍵不是有效標(biāo)識(shí)符時(shí)，我們需要使用括號(hào)表示法。

console.log(game["name"])

4.鍵轉(zhuǎn)換為字符串

鍵只是字符串，當(dāng)非字符串值用作鍵時(shí)，它們將轉(zhuǎn)換為字符串?？纯串?dāng)我嘗試使用另一個(gè)對(duì)象作為鍵時(shí)會(huì)發(fā)生什么。

const developerKey = {
  toString(){
    return 'developer'
  }
}
console.log(game[developerKey]);

當(dāng) developerKey 用作鍵時(shí)，它首先使用 toString 方法轉(zhuǎn)換為字符串，然后使用結(jié)果 'developer' 字符串鍵來檢索值。前面的代碼給出了與 game['developer'] 相同的結(jié)果。

5. 對(duì)象繼承自其他對(duì)象

在 JavaScript 中，對(duì)象繼承自其他對(duì)象。對(duì)象有一個(gè)名為 __proto__ 的隱藏屬性，指向它們的原型。所有對(duì)象都繼承自全局 Object.prototype。

game.__proto__ === Object.prototype;

即使我們沒有定義這樣的方法，游戲?qū)ο笠灿蓄愃?toString 或 toLocaleString 的屬性。它們繼承自 Object.prototype 對(duì)象。

console.log(game.toString);
console.log(game.toLocaleString);

Object.create() 接受一個(gè)原型對(duì)象并創(chuàng)建一個(gè)指向它的新對(duì)象。

const prototypeObj = {};
const obj = Object.create(prototypeObj);
console.log(obj.__proto__ === prototypeObj);

6. 更改是在當(dāng)前對(duì)象上完成的，而不是在它的原型上

請記住，更改是在當(dāng)前對(duì)象上完成的，而不是在其原型上。原型僅用于閱讀。

添加、編輯或刪除對(duì)當(dāng)前對(duì)象執(zhí)行的屬性時(shí)。

例如，Object.prototype 具有 toString 屬性，考慮繼承自 Object.prototype 的空對(duì)象。以下示例中的 delete 運(yùn)算符不執(zhí)行任何操作，它不會(huì)從原型中刪除 toString 屬性。

const obj = {};
console.log(obj.toString);
delete obj.toString
console.log(obj.toString);

當(dāng)我們更改 toString 屬性時(shí)，會(huì)在當(dāng)前對(duì)象中添加一個(gè)新屬性，原型不會(huì)更改。此時(shí)，當(dāng)前對(duì)象和原型都有一個(gè)同名的屬性，使用當(dāng)前對(duì)象中的那個(gè)。

const obj = {};
obj.toString = function(){};

7. 我們可以創(chuàng)建沒有原型的對(duì)象

Object.create(null) 創(chuàng)建一個(gè)沒有原型的對(duì)象。

const obj = Object.create(null);
console.log(obj.__proto__ === undefined);

8. 類是原型系統(tǒng)之上的糖語法

class 關(guān)鍵字創(chuàng)造了一種基于類的語言的錯(cuò)覺，但事實(shí)并非如此。 JavaScript 中的類只是原型系統(tǒng)上的一種糖語法。

class Game{
  constructor(name){
    this.name = name;
  }
}
const game = new Game('Fornite');
console.log(game.__proto__ === Game.prototype);

9.對(duì)象可以存儲(chǔ)其他對(duì)象

屬性的值可以是任何類型。屬性可以存儲(chǔ)對(duì)象。考慮下一個(gè)例子，其中 developer 是一個(gè)對(duì)象而不是一個(gè)字符串。

const game = {
  name : 'Fornite',
  developer: {
    name: 'Epic Games',
    founder: 'Tim Sweeney'
  }
};

10.對(duì)象可以存儲(chǔ)功能

屬性值可以是任何類型，包括函數(shù)。

以下對(duì)象具有存儲(chǔ)函數(shù)的 toString 屬性。

const game = {
  name : 'Fornite',
  toString: function(){
    return this.name;
  }
};
console.log(game.toString());

當(dāng)函數(shù)存儲(chǔ)在對(duì)象上時(shí)，它可以用作方法。請注意，在方法中，我們可以使用 this 關(guān)鍵字來訪問關(guān)聯(lián)對(duì)象的屬性。

11.物體可以被凍結(jié)

默認(rèn)情況下，對(duì)象是動(dòng)態(tài)的，這意味著我們可以在創(chuàng)建后添加、編輯或刪除它們的屬性。

盡管如此，我們可以使用 Object.freeze() 實(shí)用程序在創(chuàng)建時(shí)凍結(jié)這樣的對(duì)象。之后，我們無法添加、編輯或刪除其中的屬性。

查看下一個(gè)凍結(jié)的對(duì)象。

const game = Object.freeze({
 name: 'Fornite',
});
//game.developer = 'Epic Games';
//Cannot add property developer, object is not extensible
game.name = "Valorant";
//Cannot assign to read only property 'name' of object

12.原型可以凍結(jié)

原型也可以凍結(jié)。

當(dāng)原型被凍結(jié)時(shí)，從它繼承的對(duì)象不能具有同名的新屬性。考慮以下凍結(jié)原型。

const prototype = Object.freeze({
  toString : function (){
    return this.name;
  }
});

因?yàn)樵捅粌鼋Y(jié)并且具有 toString 屬性，我們不能在從它繼承的新對(duì)象上定義具有相同名稱的屬性。

const game = Object.create(prototype);
game.name = 'Fornite';
game.toString = function (){
   return `Game: ${this.name}`;
  };

13. Object.keys、Object.values 和 Object.entries 幫助檢索擁有的鍵和值

對(duì)象有兩種屬性，擁有的屬性是在對(duì)象本身上定義的。例如 name 和 developer 是我們游戲?qū)ο蟮乃袑傩?。繼承的屬性是來自原型的屬性。例如，toString 是所有對(duì)象的繼承屬性。

我們可以使用 Object.keys() 實(shí)用程序獲取對(duì)象的所有擁有鍵。

const game = {
 name: 'Fornite',
 developer: 'Epi Games'
};
console.log(Object.keys(game));

以類似的方式，我們可以使用 Object.values() 獲取所有值。

console.log(Object.values(game));

Object.entries() 檢索包含所有擁有的 [key, value] 對(duì)的數(shù)組。

console.log(Object.entries(game));
//[
//["name", "Fornite"],
//["developer", "Epi Games"]
//]

Object.keys、Object.values 和 Object.entries 都返回一個(gè)數(shù)組。一旦我們有了它，我們就可以開始使用數(shù)組方法了。

14. 使用對(duì)象模擬數(shù)組

是的，數(shù)組是使用對(duì)象模擬的?？紤]以下數(shù)組。

const games = [
  {name: 'Candy Crush', developer: 'King'},
  {name: 'Angry Birds', developer: ' Rovio Entertainment'}
];

它使用類似于下面的對(duì)象進(jìn)行模擬。

{
 '0' : {name: "Candy Crush", developer: "King"},
 '1' : {name: "Angry Birds", developer: " Rovio Entertainment"}
}

這就是為什么我們可以使用數(shù)字索引和字符串來訪問相同的元素。請記住，非字符串鍵被轉(zhuǎn)換為字符串，因此，數(shù)組索引被轉(zhuǎn)換為字符串。

console.log(games[1] === games['1']);

15. 對(duì)象是哈希映射

JavaScript 中的對(duì)象類似于其他語言中稱為映射或哈希表的對(duì)象，密鑰的訪問時(shí)間為 O(1)。

• O(1) 意味著無論地圖上的數(shù)據(jù)量如何，訪問密鑰都需要恒定的時(shí)間。
• O(n) 意味著它花費(fèi)的時(shí)間與列表的大小成線性關(guān)系。列表越大，訪問時(shí)間越大。

這就是為什么你可能會(huì)看到對(duì)象用作映射來搜索唯一鍵。

const gamesMap = {
  1 : {name: 'Fornite', developer: 'Epic Games'},
  2 : {name: 'Candy Crush', developer: 'King'},
  3 : {name: 'Angry Birds', developer: ' Rovio Entertainment'}
}

我們現(xiàn)在可以使用 gamesMap 地圖在恒定時(shí)間 O(1) 內(nèi)通過 id 獲取游戲?qū)ο螅鵁o需遍歷列表。

總結(jié)

以上這些就是你需要了解的有關(guān) JavaScript 對(duì)象的一些最重要的知識(shí)概念，希望這些內(nèi)容對(duì)你有所幫助，如果你覺得有用的話，請不要忘記點(diǎn)贊我，關(guān)注我，并將它與你的開發(fā)者朋友一起來分享這篇文章，也許能夠幫助到他。

最后，感謝你的閱讀。