当前位置:首页 > JavaScript

js实现不可变对象提案

2026-03-01 23:45:43JavaScript

使用 Object.freeze 方法

Object.freeze 可以冻结对象,使其属性不可修改、删除或添加。冻结后的对象变为不可变。

const obj = { a: 1, b: 2 };
Object.freeze(obj);
obj.a = 3; // 修改无效(严格模式下报错)
console.log(obj.a); // 输出 1

使用 Object.seal 方法

Object.seal 密封对象,阻止添加或删除属性,但允许修改现有属性。

const obj = { a: 1, b: 2 };
Object.seal(obj);
obj.a = 3; // 允许修改
delete obj.a; // 删除无效
console.log(obj.a); // 输出 3

使用 const 声明常量

const 声明的变量引用不可变,但对象内部属性仍可修改。结合 Object.freeze 可实现完全不可变。

const obj = Object.freeze({ a: 1 });
obj.a = 2; // 修改无效

使用 Immutable.js

Immutable.js 提供不可变数据结构(如 MapList),所有修改操作返回新对象。

import { Map } from 'immutable';
const obj = Map({ a: 1 });
const newObj = obj.set('a', 2); // 返回新对象
console.log(obj.get('a')); // 输出 1

使用扩展运算符或 Object.assign 浅拷贝

通过浅拷贝生成新对象,避免直接修改原对象。适用于简单对象。

const obj = { a: 1 };
const newObj = { ...obj, a: 2 }; // 浅拷贝
// 或使用 Object.assign
const newObj2 = Object.assign({}, obj, { a: 2 });

使用 Proxy 拦截修改操作

通过 Proxy 拦截对象的 setdeleteProperty 操作,阻止修改。

const obj = { a: 1 };
const handler = {
  set(target, prop, value) {
    throw new Error('Cannot modify immutable object');
  },
  deleteProperty(target, prop) {
    throw new Error('Cannot delete property from immutable object');
  }
};
const immutableObj = new Proxy(obj, handler);

使用 Object.defineProperty 设置不可写属性

将对象的属性设置为不可写(writable: false),阻止修改。

const obj = {};
Object.defineProperty(obj, 'a', {
  value: 1,
  writable: false
});
obj.a = 2; // 修改无效(严格模式下报错)

使用 readonly 装饰器(TypeScript)

在 TypeScript 中,readonly 修饰符标记属性为只读。

interface ImmutableObj {
  readonly a: number;
}
const obj: ImmutableObj = { a: 1 };
obj.a = 2; // 编译时报错

js实现不可变对象提案

标签: 提案对象
分享给朋友:

相关文章

react如何定义可扩展的对象

react如何定义可扩展的对象

定义可扩展对象的方法 在React中定义可扩展对象通常涉及使用JavaScript的原型继承、类继承或组合模式。以下是几种常见的方法: 使用类继承 通过class和extends实现对象的扩展性。子…

html中的对象react如何获取

html中的对象react如何获取

React 中获取 DOM 对象的方法 在 React 中,可以通过 ref 来获取 DOM 对象或组件实例。以下是几种常见的方式: 使用 useRef Hook(函数组件推荐) import…

react 实现数组对象排序

react 实现数组对象排序

数组对象排序方法 在React中实现数组对象排序通常涉及以下几个步骤: 使用JavaScript原生排序方法 JavaScript的Array.prototype.sort()方法可以对数组进行排序…

JS如何实现面向对象

JS如何实现面向对象

基于原型的面向对象实现 JavaScript 采用基于原型的面向对象模式,通过构造函数和原型链实现继承。构造函数用于定义对象的属性和方法,原型用于共享方法和属性。 function Person(n…

js 实现自动创建对象

js 实现自动创建对象

自动创建对象的方法 在 JavaScript 中,可以通过多种方式实现自动创建对象,以下是几种常见的方法: 使用对象字面量 对象字面量是最简单的方式,适用于静态对象创建。 const obj =…

js实现数组对象倒序

js实现数组对象倒序

使用 reverse() 方法 Array.prototype.reverse() 是 JavaScript 内置方法,直接修改原数组并返回倒序后的结果: const arr = [{i…