媒介
昨天谈到了这些题目,发明熟悉比较单方面。决议细致看看并总结一下。
研讨Object的部份ES5 API。可能会提到部份ES6内容。
Object
属性形貌符
即形貌对象属性特征的形貌符
四个特征形貌符
value
值writable
只读性enumerable
可罗列性configurable
可设置性(属性的删除与从新设置)
value
默以为undefined
在运用Object.create()
和Object.defineProperty
时writable
、enumerable
、configurable
默许均为false
两个接见器
get
不可与value
同时运用,会由属性的读取触发。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
上述代码中的
proto
运用Fun.prototype
即可完成原型链的继续。那末要怎样才罗列出
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"
能够观察到 读属性值与 写属性值离别触发了get
和set
属性接见器。
代码中所用到的”`名字为${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
置为false
,writable
为true
的属性依然能够被从新赋值。
权限:仅可对writable
为true
的属性举行赋值。
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。