Object api

媒介

昨天谈到了这些题目,发明熟悉比较单方面。决议细致看看并总结一下。
研讨Object的部份ES5 API。可能会提到部份ES6内容。

Object

Object MDN API

属性形貌符

即形貌对象属性特征的形貌符

四个特征形貌符

  1. value

  2. writable 只读性

  3. enumerable 可罗列性

  4. configurable 可设置性(属性的删除与从新设置)

value默以为undefined
在运用Object.create()Object.definePropertywritableenumerableconfigurable默许均为false

两个接见器

  1. get 不可与value同时运用,会由属性的读取触发。

  2. set 不可与writable同时运用,会由属性的写入触发。

将会在其他的api中引见属性形貌符的用法

对象的建立与属性修正

Object.create()

Object.create(proto, [ propertiesObject ])
此api的作用是以proto为原型,以propertiesObject自有属性(不包含propertiesObject的原型上的属性,包含一切不可罗列属性)为属性建立一个新的对象。

// 非严厉形式下运转,严厉形式下会抛出非常
const proto = {
  saySize () {
    console.log(this.size)
  }
}
const propertiesObject = {
  size: {
    enumerable: false,
    configurable: false,
    value: 'large'
  },
  color: {
    writable: true,
    enumerable: true,
    configurable: true,
    value: 'red'
 }
}
let newObj = Object.create(proto, propertiesObject)

// 原型
newObj.saySize()
// "large"

// writable
newObj.size = 'small'
newObj.color = 'green'
console.log(newObj.size, newObj.color)
// "large,green"

// enumerbale
for(key in newObj){
  console.log(key)
}
// "color"
// "saySize"
delete newObj.size
// false
delete newObj.color
// true
  1. 上述代码中的proto运用Fun.prototype即可完成原型链的继续。

  2. 那末要怎样才罗列出enumerable:false的属性呢?

Object.defineProperty()

Object.defineProperty(obj, prop, descriptor)
此api许可修正或向obj增加属性
obj为目的对象,prop为要修正或增加的属性,descriptor为属性形貌符

let tempObj1 = {}
Object.defineProperty(tempObj, 'name', {
  value: 'temp',
  writable: false,
  enumerable: true,
  configurable: false
})
console.log(tempObj)
// Object {name: "temp"}

// 抛出非常
Object.defineProperty(tempObj, 'name', {
  value: temp,
  writable: true
})

关于configurable: false的属性制止修正属性形貌符,会抛出非常。

let tempObj2 = {_name: 'temp2'}
Object.defineProperty(tempObj2, 'name', {
  get () {
    return `名字为${this._name}`
  },
  set (value) {
    console.log(`新名字为${value}`)
  }
})
console.log(tempObj2.name)
// "名字为temp2"
tempObj2.name = 'temp2.0'
// "新名字为temp2.0"

能够观察到 读属性值与 写属性值离别触发了getset属性接见器。
代码中所用到的”`名字为${this._name}`” 为es6模板字符串,完成拼串

Object.defineProperties()

Object.defineProperties(obj, props)
此api方便了属性的批量修正,第二个参数与Object.create()的第二个参数构造雷同。

let tempObj3 = {name:'temp'}
Object.defineProperties(tempObj3, {
  name: {
    value: 'newTemp',
    writable: true
  },
  color: {
    value: 'red',
    writable: true,
    enumerable: true
  }
})
console.log(tempObj3)
// Object {name: "newTemp", color: "red"}

对象属性的检测与检索

我们也看到了关于enumerable:false的属性是不可罗列的。以至ES6中另有“隐蔽性”更高的Symbol()能够作为属性键。那末怎样才准确的检测与猎取对象的属性呢?

我们先建立一个对象用于试验后续的一切要领。
原型和自身都各包含三种属性:enumerable: false,enumerable: true,Symbol()

const proto = Object.create(null, {
  supTrue: {
    value: 'value1',
  enumerable: true
},
supFalse: {
  value: 'value2',
    enumerable: false
  }
})
proto[Symbol('supSymbol')] = 'supSymbol'
console.log(proto)
// {
//  supTrue: "value",
//  Symbol(supSymbol): "supSymbol",
//  supFalse: "value2"
// }
let obj = Object.create(proto, {
  ownTrue: {
    value: 'value1',
    enumerable: true
},
ownFalse: {
    value: 'value2',
    enumerable: false
  }
})
obj[Symbol('ownSymbol')] = 'ownSymbol'
// ok,obj可用

for-in

for (const key in obj) {
    console.log(key)
}
// subTrue, ownTrue

能够看到for in罗列了包含原型链在内的一切可罗列属性

Object.keys()

Object.keys(obj)
// ["ownTrue"]

能够看到返回了一个只包含自身可罗列属性键的数组。

Object.getOwnPropertyNames()

Object.getOwnPropertyNames(obj)
// ["ownTrue", "ownFalse"]

能够看到返回了一个包含自身一切非symbol的属性键的数组。
由此也能够看到symbol范例的属性的“隐蔽性”

Object.getOwnPropertySymbols()

针对 猎取symbol可运用此要领。

Reflect.ownKeys()

虽然这个不是Object的要领
然则能够用来猎取自身一切属性键

Reflect.ownKeys(obj)
// ["ownTrue", "ownFalse", Symbol(ownSymbol)]

把对象关起来

根据权限从大到小分列

Object.preventExtensions()

作用:将对象变的不可扩大,不可增加新的属性。

Object.seal()

作用:将对象“密封”,不可增加新属性,属性的configurable置为falsewritabletrue的属性依然能够被从新赋值。
权限:仅可对writabletrue的属性举行赋值。

Object.freeze()

作用:完整“锁死”,不能做任何修正。
权限:0。

须要注重的是,上述三个api都是对原有对象的操纵,并不会返回一个新的对象。

let obj = {}
Object.preventExtensions(obj) === obj // true
Object.seal(obj) === obj // true
Object.freeze(obj) === obj // true

能够说writable,configurable这些属性形貌符是针对对象的属性做出的限定或许庇护。
那末Object.seal(),Object.preventExtensions(),Object.freeze()就是对对象自身做出限定或许庇护。
同时我们也晓得在ES6中运用const能够声明一个”常量”,然则要注重的是const确保的只是指针的不可变动。比方:

const obj = {key: 'value1'}
obj.key = 'value2' // 可完成
obj = {key2: 'value2'} // 变动指针,抛出非常

针对对象,此时就能够运用上述三个把对象关起来的api。

    原文作者:toBeTheLight
    原文地址: https://segmentfault.com/a/1190000009913235
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞