Object.freeze()

Posted 2021-01-03 peiyanh

　　Object.freeze()方法可以冻结一个对象，被冻结的对象不能修改和删除该对象已有的属性，不能对该对象添加新的属性，以及不能修改该对象已有属性的可枚举，可配置性，可写性。该方法返回被冻结的对象。被冻结的对象的属性也不是一定不能修改，如果一个属性的值是一个对象，该属性的值可以修改，称之为浅冻结。要使对象不可变，需要递归冻结每个类型为对象的属性，称为深冻结。

浅冻结

// 冻结对象

var obj = {

    name: ‘zhangsan‘,
    age: 20
}


// 填加新属性
obj.job = ‘student‘
console.log(obj)    // { name: ‘zhangsan‘, age: 20, job: ‘student‘ }

obj.friends = {}
console.log(obj)    // { name: ‘zhangsan‘, age: 18, job: ‘student‘, friends: {} }

// 删除属性
delete obj.job
console.log(obj)    // { name: ‘zhangsan‘, age: 20, friends: {} }

// 修改属性
obj.age = 18
console.log(obj)    // { name: ‘zhangsan‘, age: 18, friends: {} }



console.log("*******************************")
var obj2 = Object.freeze(obj)

obj.gender = ‘man‘
obj.name = ‘lisi‘
delete obj.age
console.log(obj)    // { name: ‘zhangsan‘, age: 18, friends: {} }

obj2.gender = ‘man‘
obj2.name = ‘lisi‘
delete obj2.age
console.log(obj2)   // { name: ‘zhangsan‘, age: 18, friends: {} }

// 修改值为对象的属性值

obj.friends.name = ‘mazi‘
console.log(obj)    // { name: ‘zhangsan‘, age: 18, friends: { name: ‘mazi‘ } }
delete obj.friends.name
console.log(obj)    // { name: ‘zhangsan‘, age: 18, friends: {} }



console.log("------------------Array--------------")
// 冻结数组

var arr = [1,2,3,4,5]

arr.push(0)
console.log(arr)    // [ 1, 2, 3, 4, 5, 0 ]

arr.push([6,7])
console.log(arr)    // [ 1, 2, 3, 4, 5, 0, [ 6, 7 ] ]

var arr2 = Object.freeze(arr)
// arr.push(9)
// console.log(arr)    // TypeError: Cannot add property 6, object is not extensible

arr[6].push(0)
console.log(arr)    // [ 1, 2, 3, 4, 5, 0, [ 6, 7, 0 ] ]

深冻结

// 深冻结函数.
function deepFreeze(obj) {

    // 取回定义在obj上的属性名, 返回一个包含该对象所有属性名的数组
    var names = Object.getOwnPropertyNames(obj);
    // 在冻结自身之前冻结属性
    names.forEach(function(name) {
      var value = obj[name];
  
      // 如果value是个对象，冻结它
      if (typeof value == ‘object‘ && value !== null)
        deepFreeze(value);
    });
  
    // 冻结自身
    return Object.freeze(obj);
  }
  
  obj2 = {
    internal: {},
    set(){

    }
  };
  
  deepFreeze(obj2);
  obj2.internal.a = ‘anotherValue‘;
  obj2.internal.a; // undefined

 MDN地址：

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze