理清 Object

Object全解析

串联Object

js中的对象一个无序的集合，存储的内容是一个一个键值对，值可以是数据或者函数（方法）

属性的类型分为： 数据属性和访问器属性

数据属性

包含4个特性用来描述词属性，[[Configurable]], [[Enumerable]], [[Writable]], [[Value]]

• [[Configurable]]： 是否可以通过delete进行删除【重定义】，是否可以修改其他的属性，是否修改为访问器属性

• [[Enumerable]] 是否可以通过for...in遍历循环到，需要注意的是for...in遍历的包括原型上的属性，注意和一起使用的时候关系 hasOwnProperty-note

• [[Writable]] 是否可以被修改，默认为true

• [[Value]] 设置属性的值

要想修改以上的默认属性需要使用

const object2 = {}
// 定义单个属性
Object.defineProperty(object2, '属性名',   {
	writable: false,
	value: 'Name'
})

// 定义多个属性
Object.defineProperties(object2, {
	name: {
		value: "i"
	},
	age: {
		value: 32
	}
})

访问器属性

它不包含数据值，但是包含4个特性用来描述词属性，[[Configurable]], [[Enumerable]],[[Get]],[[Set]]

• [[Get]] 获取函数，获取属性值的时候会被调用
• [[Set]] 设置函数，在设置属性值的时候会调用 默认值均为undefined

const object = {
    name: '2'
}

console.log(object.name); // 创建对象时候设置的属性值 name
// 2

console.log(object.name2); // 打印创建对象的时候还没有设置的属性值name2
// undefined

// 设置object.name2的访问器
Object.defineProperty(object, 'name2', {
    get() {
        return this.name
    },
    set(newValue) {
        this.name = newValue + '--'
    }
})

object.name2 = 'kangkang' // 设置object.name2 的值

console.log(object.name); // kangkang--
console.log(object.name2); // kangkang--

// 使用for...in 遍历展示object的属性 (for...in 打印对象和原型链上的可枚举对象)
for (const object2Key in object) {
    console.log(object2Key);
} // 此处打印的是name 没有name2

console.log(Object.getOwnPropertyDescriptors(object));
// {
//     name: {
//         value: 'kangkang--',
//         writable: true,
//         enumerable: true,
//         configurable: true
//     },
//     name2: {
//         get: [Function: get],
//         set: [Function: set],
//         enumerable: false,
//         configurable: false
//     }
// }

// note: 打印后发现name2的enumerable 属性是false，可见访问器属性默认是不可枚举的,自然for...in
// 无法打印出来

console.log(Object.hasOwnProperty.call(object,'name2'));
// 再通过hasOwnProperty 打印name2属性显示为true