Object对象方法(七)freeze/isFrozen

300 阅读1分钟

javaScript Object对象方法freeze

作用:冻结的对象/数组,无法做任何的修改,包括:删除、增加、修改属性等

一、冻结对象。冻结后对象操作对象的内容无效,开启严格模式将会直接报错

const obj = {
  age: 18,
  name: 'zg'
};
Object.freeze(obj);
obj.name = "jam"; // 修改无效
console.log(obj.name); // zg
obj.grade = 'A';
console.log(obj.grade); // undefined

二、冻结数组,同样无法做任何操作,若是调用数组方法修改数组,会直接报错

const arr = [1];
Object.freeze(arr);
arr.push(2); // 报错
console.log(arr);

三、isFrozen用于判断某个对象是否被冻结

const obj = {
  age: 18,
  name: 'zg'
};
Object.freeze(obj);
console.log(Object.isFrozen(obj)); //true

四、浅冻结与深冻结

与深浅拷贝一样,冻结也是有分深浅的,冻得不够深,内部的对象修改同样会起作用。如下代码案例:

const freezeObj = {
  age: 18,
  name: "zg",
  innerObj: {
    age: 22,
    name: "lucy"
  }
};
Object.freeze(freezeObj);
freezeObj.name = "jam"; // 修改无效
console.log(freezeObj.name); // zg
freezeObj.innerObj.name = "jam"; // 修改起作用
console.log(freezeObj.innerObj.name); // jam

五、实现深冻结

// 深冻结
function deepFreeze(obj) {
  const keys = Object.keys(obj);
  for(let key of keys) {
    if(typeof(obj[key]) == 'object' && obj[key] != null) {
      deepFreeze(obj[key]);
    }
  }
  return Object.freeze(obj);
}
const freezeObj = {
  age: 18,
  name: "zg",
  innerObj: {
    age: 22,
    name: "lucy"
  }
};
deepFreeze(freezeObj);
freezeObj.name = "jam"; // 修改无效
console.log(freezeObj.name); // zg
freezeObj.innerObj.name = "jam"; // 修改无效
console.log(freezeObj.innerObj.name); // lucy