JavaScript中Object.freeze的作用与使用详解
在JavaScript开发中，我们经常需要维护数据的不可变性，避免意外的修改导致程序出现难以排查的bug。Object.freeze是ECMAScript 5引入的一个静态方法，专门用于冻结对象，是控制对象修改权限的重要工具。
Object.freeze的核心作用
Object.freeze接收一个对象作为参数，执行后会返回被冻结的对象，被冻结的对象会有以下特性：
- 不能添加新属性
- 不能删除已有属性
- 不能修改已有属性的可枚举性、可配置性、可写性
- 不能修改已有属性的值（如果属性值是基本类型，完全无法修改；如果属性值是引用类型，仅冻结第一层，内部引用仍可修改）
简单来说，Object.freeze可以让对象进入一种“只读”的状态，非严格模式下尝试修改冻结对象的操作会静默失败，严格模式下则会直接抛出TypeError错误。
基础使用示例
下面通过一个简单示例了解Object.freeze的基础用法：
// 定义一个普通对象
const user = {
name: '张三',
age: 25,
hobby: ['阅读', '跑步']
};
// 冻结对象
const frozenUser = Object.freeze(user);
// 尝试修改已有属性值，非严格模式下静默失败，严格模式下报错
frozenUser.age = 26;
console.log(frozenUser.age); // 输出：25，修改未生效
// 尝试添加新属性
frozenUser.gender = '男';
console.log(frozenUser.gender); // 输出：undefined，添加失败
// 尝试删除已有属性
delete frozenUser.name;
console.log(frozenUser.name); // 输出：张三，删除失败浅冻结的特性
需要注意的是，Object.freeze仅对对象进行浅冻结，也就是只冻结对象的第一层属性，如果属性值是引用类型（比如数组、对象），那么引用类型内部的内容仍然可以被修改。
我们来看下面的示例：
const info = {
base: {
name: '测试数据',
version: '1.0'
},
tags: ['js', 'es5']
};
// 冻结info对象
Object.freeze(info);
// 尝试修改第一层的base属性（引用地址），操作失败
info.base = { name: '新数据' };
console.log(info.base.name); // 输出：测试数据
// 修改base内部的属性，操作成功，因为base对象本身没有被冻结
info.base.version = '2.0';
console.log(info.base.version); // 输出：2.0
// 修改tags数组的元素，操作成功
info.tags.push('freeze');
console.log(info.tags); // 输出：['js', 'es5', 'freeze']如果需要实现深冻结，也就是递归冻结对象内部所有的引用类型属性，可以自定义一个深冻结函数：
// 深冻结函数
function deepFreeze(obj) {
// 获取对象所有自身属性的属性名
const propNames = Object.getOwnPropertyNames(obj);
// 先冻结自身（第一层）
Object.freeze(obj);
// 遍历所有属性，递归冻结引用类型的属性
propNames.forEach(prop => {
const value = obj[prop];
// 如果属性值是对象（且不是null，因为typeof null也是'object'），并且没有被冻结，就递归冻结
if (value && typeof value === 'object' && !Object.isFrozen(value)) {
deepFreeze(value);
}
});
return obj;
}
// 测试深冻结
const deepObj = {
a: 1,
b: {
c: 2,
d: [3, 4]
}
};
deepFreeze(deepObj);
// 尝试修改深层属性，操作失败
deepObj.b.c = 3;
console.log(deepObj.b.c); // 输出：2
deepObj.b.d.push(5);
console.log(deepObj.b.d); // 输出：[3, 4]使用场景与注意事项
Object.freeze常见的使用场景包括：
- 定义常量对象，比如配置项、枚举值，避免被意外修改
- 在Vue 2的响应式系统中，冻结对象可以让Vue跳过该对象的响应式处理，提升性能，适合那些确定不会变化的静态数据
- 作为函数参数时，冻结传入的对象，避免函数内部修改外部传入的对象，保证数据安全性
使用时需要注意几个点：
- Object.freeze只能冻结对象的自身属性，无法冻结原型链上的属性
- 被冻结的对象无法再恢复可修改状态，冻结操作是不可逆的
- 如果是在严格模式下使用，修改冻结对象的操作会直接抛出错误，需要做好错误处理
总结
Object.freeze是JavaScript中控制对象不可变性的重要方法，通过它可以快速实现对象的浅冻结，配合递归逻辑也能实现深冻结。在实际开发中，合理使用该特性可以减少意外的数据修改，提升代码的健壮性和可维护性。不过也要注意它的浅冻结特性，避免因为忽略引用类型的内部可修改性导致问题。
Object.freezeJavaScript对象冻结浅冻结深冻结数据不可变性 本作品最后修改时间：2026-05-23 23:12:30