今天開始我們要一起來看看物件到底是什麼?
目前我的想法是...

一包東西..裡面好像有一些功能或是資料可以用(超膚淺xDD)

物件的形式

物件有兩種形式

1. 宣告形式

   const obj = {
       key: value
   }
   

2. 建構形式

   const obj = new Object();
   obj.key = value;
   

這兩者主要的差異就是宣告形式的話你可以一次新增多個，但是建構形式只能一個一個建立。

都是物件...嗎?

Javascript 的一切都是物件 (everything in Javascript is an object)。

那... string, boolean, number, null, undefined, 本身不是 object 怎麼解釋?
(null 是 object 這件事是一個 bug
所以剛剛提的那句話顯然不成立。

另外之前也提過 function 是物件的一個子型別，可以說是一個可以呼叫的物件。

還有 Array 也是，但它帶有額外的行為，組織方式也滿特別的(我覺得像是一個裝藥的盒子xD。

內容 (contents)

一個物件的內容是由值所構成的，而且這些值是存在命名過的位置中，我們叫它"特性"。

而這些特性名稱的行為就像是指標，讓你可以指向你想要的資料，之前有提過兩種方式可以存取物件，
一種是我們常用的 . 稱之為特性存取。

const obj = {
    a: 17
};

console.log(obj.a) // 17

另一種則是叫鍵值存取。

const obj = {
    a: 17
};

console.log(obj['a']) // 17

要注意的是雖然特性存取這種方式最常見，但是鍵值存取好用的地方在於他可以接受相容於 UTF-8 或是 Unitcode的字串作為特性名稱，但是特性存取不行。
例如以下範例

const obj = {}

obj['Hi!Robin~']= 'robin'; // work
obj.Hi!Robin~ = 'robin'; // SyntaxError Unexpected token '!'

注意！無論如何，特性名稱永遠都是字串，之前也提過就算你給他個數字，他也會自動轉成一個字串。

const obj = {};

obj[1] = '1';
obj['1'] = '11';  // 直接覆蓋掉

console.log(obj[1]);  // 11
console.log(obj['1']);  // 11

計算得出的特性名稱 ( Computed property names )

在 ES6 中新增了這個功能叫做 " 計算得出的特性名稱 ( Computed property names ) "

基本上就是你可以在物件字面值宣告的鍵值名稱位置做計算像是這樣。

const prefix = 'robin'
const obj = {
    [prefix + 'Name']: "robin",
    [prefix + 'Age']: "18",
    [prefix + 'Phone']: "0912345678",
}

obj['robinName'];  "robin"
obj['robinAge'];  // "18"
obj['robinPhone'];  // "0912345678"

我之前有用過幾次，但是我完全不知道是 ES6 才新增的

特性 vs. 方法

其實有兩個名詞在我記憶中是分不清楚差異的那就是函式和方法。

其實在 JS 中 函式(Function) 和 方法(method) 是可以互換的名詞。

稍微查了一下，
我覺得如果是硬要分我應該會用下面兩點來區分。

• 函式可以獨立存在跟物件無關。
• 方法跟物件有關比方說是某類別的子函式之類的。

如果觀念上有錯麻煩在指正。

那假使當物件中有一個函式被參考取用，
就可以說他是方法嗎?
感覺有點怪xD
實際上不能說這個函式"屬於"某個物件，他只是一個"參考"。

以上是今天的內容
感謝您的收看
明天繼續分享物件~

參考來源：

你所不知道的 JS｜範疇與 Closures，this 與物件原型 (You Don't Know JS: this & Object Prototypes))