ES8(四) —— Object.getOwnPropertyDescriptor()

目錄

• ES8如何獲取Object的描述符

  • 設置描述符使用defineProperty()
  • 獲取單個屬性的描述符 —— Object.getOwnPropertyDescriptor()
  • 獲取全部屬性裏面的數據描述符 —— Object.getOwnPropertyDescriptors()

• 描述符

  • 描述符參考
• 能夠拷貝getter和setter屬性
• ES6-ES10學習版圖

ES8如何獲取Object的描述符

Object.getOwnPropertyDescriptor()只能獲取對象屬性的描述符可是不能對其進行修改

設置描述符使用defineProperty()

• 第一個參數目標對象
• 第二個參數目標屬性（能夠是Symbol）
• 第三個參數是對描述符進行配置，true是開啓，false是關閉
• 返回傳遞的目標對象

const data = {
  Portland: '78/50',
  Dublin: '88/52',
  Lima: '58/40'
}

Object.defineProperty(data, 'Lima', {
  enumerable: false, // 不可枚舉
  writable: false // 不可改寫
})

// 不可枚舉的對象不會在裏面
console.log(Object.keys(data))
// ["Portland", "Dublin"]

獲取單個屬性的描述符 —— Object.getOwnPropertyDescriptor()

獲取對象屬性的描述符

• 第一個參數目標對象
• 第二個參數目標屬性
• 返回值是對象及其全部描述符，找不到屬性返回undefined

//能夠看到單個屬性的描述符
console.log(Object.getOwnPropertyDescriptor(data, 'Lima'))
// {value: "58/40", writable: false, enumerable: false, configurable: true}

獲取全部屬性裏面的數據描述符 —— Object.getOwnPropertyDescriptors()

只接受一個參數，目標對象。

// 能夠看到全部屬性裏面的數據描述符
console.log(Object.getOwnPropertyDescriptors(data))
// Portland: {value: "78/50", writable: true, enumerable: true, configurable: true}
// Dublin: {value: "88/52", writable: true, enumerable: true, configurable: true}
// Lima: {value: "58/40", writable: false, enumerable: false, configurable: true}

描述符

關於數據描述符集合與其含義。

描述符	備註
value	[屬性的值]
writable	[屬性的值是否可被改變]
enumerable	[屬性的值是否可被枚舉]
configurable	[描述符自己是否可被修改，屬性是否可被刪除]
get	[獲取該屬性的訪問器函數（getter）。若是沒有訪問器， 該值爲undefined。]
set	[獲取該屬性的設置器函數（setter）。 若是沒有設置器， 該值爲undefined]

描述符參考

• Object.defineProperty MDN
• Object.getOwnPropertyDescriptor MDN

能夠拷貝getter和setter屬性

使用Object.assign沒法對getter和setter的內容進行拷貝

const p1 = {
  firstName: 'Lei',
  lastName: 'Wang',
  get fullName () {
    return this.firstName + ' ' + this.lastName
  }
}

const p2 = Object.assign({}, p1)
p2.firstName = 'Xiao'
console.log(p2)
// { firstName: 'Xiao', lastName: 'Wang', fullName: 'Lei Wang' }

// 這裏面get的東西沒有進行改變，由於Object.assign只是把fullName當成普通變量獲取了

若是要獲取所有的，那麼須要這樣作

const descriptors = Object.getOwnPropertyDescriptors(p1)
console.log(descriptors)
/**  獲取了所有的描述信息，而後再一個新對象上定義過去，這樣才能所有拷貝過去
{
  firstName: {
    value: 'Lei',
    writable: true,
    enumerable: true,
    configurable: true
  },
  lastName: {
    value: 'Wang',
    writable: true,
    enumerable: true,
    configurable: true
  },
  fullName: {
    get: [Function: get fullName],
    set: undefined,
    enumerable: true,
    configurable: true
  }
}
*/
const p3 = Object.defineProperties({}, descriptors)
p3.firstName = 'Hu'
console.log(p3.fullName) // Hu Wang

ES6-ES10學習版圖