JS 擷取對象屬性值 [] 和.差別

[ ] 和.的差別：

相同點：都可以擷取到 object 的屬性值

不同點：

• 1、 [ ] 運算符可以使用字元串變量的内容作為屬性名，點運算符不能
• 2 、[ ] 運算符可以用純數字作為屬性名，點運算符不能
• 3 、[ ] 運算符中必須是 String 類型

測試如下

let user = {
  id: 8,
  'name': 'xia',
  位址: '西安',
  1: '123'
};
console.log(user["id"]);
console.log(user.id);

console.log(user["位址"]);
console.log(user.位址);

// [ ] 運算符可以用純數字作為屬性名，點運算符不能
console.log(user["1"]);
// 報錯
// console.log(user.1);

// [ ] 運算符可以使用字元串變量的内容作為屬性名，點運算符不能
for (let key of Object.keys(user)){
  console.log(typeof key);
  // 全是 undefined 因為會将 key 任務 user 對象的屬性，而 user 沒有 key 這個屬性
  console.log(user.key);
  // 正常顯示
  console.log(user[key]);
}

           

[ ] 另一種用法 ，有個疑惑，希望知道的給說說，就是看着數組有四個值，為什麼長度為2，像這種資料結構底層是如何存儲的，希望知道的解釋一下，謝謝

let array = [];
array.push(1);
array["id"] = 8;
array["name"] = "xia";
array.push("西安");
console.log(typeof array);// object
console.log(array);       // [ 1, '西安', id: 8, name: 'xia' ]
console.log(array[0]);    // 1
console.log(array[2]);    // undefined
console.log(array["id"]); // 8
console.log(array.id);    // 8