Object 对象

Posted 2020-10-31 SINGLE DOG

object.freeze(obj)

描述：冻结obj对象的属性和值，使该对象不能添加属性，修改属性值（属性值是值类型的，如果是引用类型就算冻结了也可以修改）和删除属性。

用处：获得一个不可修改的对象

var obj = {
    prop:‘123‘,
    foo:{
        bar:‘free‘
    }
}

var o = Object.freeze(obj);

o === obj; // 被冻结的对象和返回的对象是同一个对象，不是返回一个对象副本

obj.quaxxor = ‘添加属性‘ // 添加不上
console.log(obj);
obj.prop = ‘修改属性值‘; // 无法修改，还是默认值
console.log(obj);
delete obj.prop // 无法删除
console.log(obj);
obj.foo.bar = ‘dom‘; // 值被修改了
console.log(obj)

Object.create(obj, [propertiesObject])

描述：创建一个新对象，并把现有对象设置成新建对象的__proto__，第二个参数为添加到新对象上的属性（相当于直接使用点号运算符创建新属性）；

作用：快速一个基于原型继承的对象

const animal = {
  hasHair: false,
  hairColor:‘white‘,
  getHairColor: function () {
    console.log(‘Animal\‘s hair color is ‘+this.hairColor);
  }
};

const cat = Object.create(animal, {
    name:{ // 新添加的属性值必须是对象，参考Object.defineProperty配置
        writable:true, // 设置name属性的值是可修改的
        configurable:true,
        enumerable:true, // 设置属性可被枚举，如果不设置的话默认是false，在cat对象上打断点会看到name和其他属性显示不太一样
        value:‘‘
    }
});
cat.hasHair = true;
cat.hairColor = ‘black‘;
cat.name = ‘black cat‘; // 如果设置writable:true, configurable:true 无法修改name属性
console.log(cat.__proto__ === animal); // true

cat.getHairColor(); // Animal‘s hair color is black

console.log(cat.name); // black cat

Object.keys(obj)

描述：返回对象的可枚举属性，快速获取对象上的属性名，但不包含对象原型上的属性。Object.keys和for...in的区别是后者可以遍历到对象原型（继承）的属性

作用：快速获取对象上的属性名，不用再用for...in一个一个遍历获取

var obj = Object.create({
    prop:‘123‘,
    foo:{
        bar:‘free‘
    }
}, {
    getFoo:function(){

    }
})

obj.self = ‘self‘;

console.log(Object.keys(obj)) // [‘self‘]

Object.defineProperty(obj, property, descriptor)

描述：在对象上定义新属性，或者修改原有属性

作用：

/* 定义对象的方式有两种，字面量和构造函数
 * 定义属性的方式也有两种，直接在对象上添加和使用Object.defineProperty
 * 使用Object.defineProperty定义和修改属性的方式是使用属性描述符
 *
 */
var val;
var obj = Object.create({
    name:‘zhang‘,
    getName:function(){
        console.log(this.name);
    }
}, {
    age:{ // 使用数据描述符定义属性，该方式有writable[true|false], configurable[true|false], enumerable[true|false], value[任意类型]
        writable:false, // 设置属性的值是否可以被修改，默认为false
        configurable:true, // 设置属性的描述符（age后面的对象就是描述符）是否可以被修改，默认为false
        enumerable:true, // 设置属性能否被for...in和Object.keys枚举，默认为false
        value:27
    },
    sex:{ // 使用存取描述符定义属性，该方式有configurable[true|false], enumerable[true|false], get[function], set[function]
        configurable:true,
        enumerable:true,
        get:function(){
            return val;
        },
        set:function(newValue){
            val = newValue;
        }
    }
})

// 字面量方式定义的对象，其属性描述符的writable, configurable, enumerable 都是true
console.log(Object.getOwnPropertyDescriptor({name:‘zhang‘}, ‘name‘))

// 对比for...in和Object.keys()的区别
for(var key in obj){
    if(typeof obj[key] !== ‘function‘)
        console.log(key);
}

console.log(Object.keys(obj));

// 修改数据描述符，主要对比configurable不同设置的影响
Object.defineProperty(obj, ‘age‘, {
    writable:true
})

// 存取描述符修改属性值
obj.sex = ‘male‘;
console.log(obj.sex);