目錄

• ES8如何獲取Object的描述符
  • 設(shè)置描述符使用defineProperty()
  • 獲取單個(gè)屬性的描述符 —— Object.getOwnPropertyDescriptor()
  • 獲取所有屬性里面的數(shù)據(jù)描述符 —— Object.getOwnPropertyDescriptors()
• 描述符
  • 描述符參考
• 可以拷貝getter和setter屬性
• ES6-ES10學(xué)習(xí)版圖

ES8如何獲取Object的描述符

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

設(shè)置描述符使用defineProperty()

• 第一個(gè)參數(shù)目標(biāo)對(duì)象
• 第二個(gè)參數(shù)目標(biāo)屬性（可以是Symbol）
• 第三個(gè)參數(shù)是對(duì)描述符進(jìn)行配置觉既，true是開(kāi)啟睹酌，false是關(guān)閉
• 返回傳遞的目標(biāo)對(duì)象

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

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

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

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

獲取對(duì)象屬性的描述符

• 第一個(gè)參數(shù)目標(biāo)對(duì)象
• 第二個(gè)參數(shù)目標(biāo)屬性
• 返回值是對(duì)象及其所有描述符孽糖，找不到屬性返回undefined

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

獲取所有屬性里面的數(shù)據(jù)描述符 —— Object.getOwnPropertyDescriptors()

只接受一個(gè)參數(shù)觅赊，目標(biāo)對(duì)象淫僻。

// 可以看到所有屬性里面的數(shù)據(jù)描述符
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}

描述符

關(guān)于數(shù)據(jù)描述符集合與其含義砸烦。

描述符參考

• Object.defineProperty MDN
• Object.getOwnPropertyDescriptor MDN

可以拷貝getter和setter屬性

使用Object.assign無(wú)法對(duì)getter和setter的內(nèi)容進(jìn)行拷貝

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的東西沒(méi)有進(jìn)行改變，因?yàn)镺bject.assign只是把fullName當(dāng)成普通變量獲取了

如果要獲取全部的喷楣，那么需要這樣做

const descriptors = Object.getOwnPropertyDescriptors(p1)
console.log(descriptors)
/**  獲取了全部的描述信息趟大，然后再一個(gè)新對(duì)象上定義過(guò)去，這樣才能全部拷貝過(guò)去
{
  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學(xué)習(xí)版圖

image