es6-對象擴展(二)

關於原型

es6添加了__proto__屬性來指向原型,__proto__大部分瀏覽器都部署了這個屬性,但是其他環境不一定部署(node),所以es6提供了兩種方法來去讀和設置原型對象。

Object.setPrototypeOf()

用於設置對象的原型對象。
es5中實例和原型之間通過__proto__屬性連接,但是其他環境不一定部署__proto__,所以es6提供Object.setPrototypeOf()方法來爲對象設置原型。

function Person() {}
Person.prototype.name = 'uzi'
let person1 = new Person()
person1.name	// name屬性從原有的原型繼承
// 'uzi'
let PersonPro = {name: 'xiaohu'}	// 新的對象
Object.setPrototypeOf(person1, PersonPro)	// 把person1指向原型的指針指向PersonPro
person1.name	// name屬性從新的原型繼承
// 'xiaohu'

Object.getPrototypeOf()

該方法與Object.getPrototypeOf()配套,用於獲取對象的原型對象。

// 上個例子中的person1的原型
Object.getPrototypeOf(person1)
// {name: "xiaohu"}

for…in與Object.keys()

二者都是遍歷對象中可枚舉屬性,區別是for…in除遍歷對象自身的屬性外繼承的屬性也會遍歷,而Object.keys()這關注對象自身的可枚舉屬性。

function Person(){}
Person.prototype.age = 45
let person1 = new Person()
person1.name = 'uzi'
// for..in遍歷
for (let i in person1) {console.log(i)}
// name
// age
// Object.keys()遍歷
Object.keys(person1)
//["name"]

Object.values()、Object.entries()

和Object.keys()一套的東西,用法相同,values遍歷值,entries遍歷鍵值對

Object.getOwnPropertyDescriptors()

es5中Object.getOwnPropertyDescriptor()方法返回對象某個屬性的描述對象,而Object.getOwnPropertyDescriptors()返回對象自身所有屬性(非繼承屬性)的描述對象。

let person = {
	name: 'uzi',
	age: 45
}
// es5中Object.getOwnPropertyDescriptor()方法
Object.getOwnPropertyDescriptor(person, 'name')
// {value: "uzi", writable: true, enumerable: true, configurable: true}
// es6中Object.getOwnPropertyDescriptors()方法
Object.getOwnPropertyDescriptors(person)
// {
//	 age: {value: 45, writable: true, enumerable: true, configurable: true}
//	 name: {value: "uzi", writable: true, enumerable: true, configurable: true}
// }

擴展運算符

擴展運算符(…)用於取出參數對象的所有可遍歷屬性,並將其複製到當前對象之中。

let person = {
	name: 'uzi',
	age: 45
}
let firend = {job: 'web', ...person}
console.log(firend)
// {job: "web", name: "uzi", age: 45}

可以合併兩個對象

let a = {a: 11}
let b = {b: 22}
let ab = {...a, ...b}
console.log(ab)
// {a: 11, b: 22}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章