記錄 JavaScript 中自定義物件(object)常用基本操作。

# 關於 Object {} 物件

  • 物件.屬性=屬性值

    object.type = value

    物件.方法(參數)

    object.method()
    • 相同物件都有相同的屬性、不同的屬性值
    • 相同物件都有相同的方法可以用

  • name(key) & Value 成對

    object = {name1: value1, name2: value2, ...}

  • value 可以裝什麼？
    （屬性）1. 原生的值 （boolean / number / string ... 等）
    （屬性）2. 物件 object
    （方法）3. 函式 function

  • 例：

    var member = {
    firstName: "Eudora",
    lastName: "Huang",
    fullName: function(){
         return this.firstName + " " + this.lastName
    }
}
console.log(member.fullName())
//結果 :  "Eudora Huang"
    • 注意：用箭頭函示寫 value 裡的 function 時，this 會是 undefind(this的初始值) 而非該函數擁有者(此例為 member)
    • 取值時若為 function 必須要加 ( )，不然會輸出整段 fucntion code（參行８取fullName時後面加括弧）

# 基本操作語法

# new Object() 建立 object

  • 建立一個空物件
    let obj = {}
  • 建立一個物件並定義key & value
    let obj = new Object();
    obj.key1 = 'value1';  //或 obj["key1"] = 'value1';
    obj.key2 = 2;         //   obj["key2"] = 2;
    obj.key3 = 'value3';  //   obj["key3"] = 'value3';
    或
    let obj = {
    key1: 'value1',
    key2: 2,
    key3: 'value3',
}
  • object
    obj
// { key1: 'value1', key2: 2, key3: 'value3' } 

# Object.values() 取 object 值

  • 取所有的value
    Object.values(obj)
// ['value1', 2, 'value3']
  • 取特定的value
    obj.key1     
// 'value1'
    • 用.的方式只能以 key 取
    obj['key1']    
// 'value1'
    • 用[ ]的方式，[ ]裡面可以放變數或判斷式
    • 如果單純只放key，要加引號 ' '

# Object.keys() 取 object 屬性（key）

  • 取所有的key
    Object.keys(obj)   
//['key1', 'key2', 'key3']
  • 取第Ｎ個的key (從0開始)
    Object.keys(obj)[0]   
//'key1'

# delete 刪除 object 屬性（key）

  • delete刪除特定的key
    delete obj.key1

# Object.entries(obj)、Object.fromEntries() 轉型應用

  • object 轉成 array of array
    Object.entries(obj)
//  [ [ 'key1', 'value1' ], [ 'key2', 2 ], [ 'key3', 'value3' ] ] 
  • array of array 轉回 Object
    Object.fromEntries(Object.entries(obj))
// { key1: 'value1', key2: 2, key3: 'value3' } 

參考資料：