JavaScript 如何保持对象不可变性(3 种核心方法)


发布日期 : 2019-12-30 20:39:57 UTC

访问量: 10 次浏览

JavaScript 如何保持对象的不可变性

不可变性是在涉及私有或受限制对象时的一个问题。有时我们需要创建新的对象,而不是无意中进行修改或更改,以保持数据的完整性。
因此,我们需要找到一种方法来保留对象的状态。在本文中,我们将了解对象不可变性的概念,以及保持对象不可变性的不同方法,并借助示例来了解它们的基本实现。

对象的不可变性

不可变性是指确保对象状态的完整性。不可变对象不能被修改、添加新的属性或删除现有属性。
在本文中,我们将看到如何在 JavaScript 中保持对象的不可变性。

保持对象不可变性的不同技术

在JavaScript中,我们可以使用以下方法来保持对象的不可变性:

  • 使用JavaScript的Object.freeze()方法
  • 使用JavaScript的扩展运算符(...
  • 使用JavaScript的Object.assign()方法

方法1:使用JavaScript的 Object.freeze() 方法

JavaScript的Object.freeze()方法用于冻结一个对象。冻结对象不允许向对象添加新属性,并防止删除或修改现有属性。

语法:

Object.freeze( obj );

例子:
在这个例子中,我们将使用 Object.freeze() 方法使对象不可变。

JavaScript

// Creating an object constructor and assigning  
// values to it 
const obj = { name: 'JavaScript' }; 
  
// Creating immutable object using freeze method 
Object.freeze(obj); 
  
// Updating the properties of the frozen object 
obj.name = 'HTML'
  
// Displaying the properties of the frozen object 
console.log(obj.name);

输出

JavaScript

输出清楚地显示,当对象传递给Object.freeze()方法时,它变成不可变的,无法修改。

方法2:使用JavaScript扩展运算符

扩展运算符允许可迭代的内容在需要0个或多个参数的位置展开。它主要用于可变数组,需要超过1个值的情况。

语法:

let variablename1 = [ ...value ];

示例:
在这个示例中,我们将使用展开运算符(...创建一个新对象,保留旧对象的状态。

JavaScript

// Creating an object 
const oldObject = { name: 'John', age: 30 }; 
  
// Creating new object from old one 
const newObject = { ...oldObject, age: 31 }; 
  
// Display properties of both objects 
console.log(oldObject); 
console.log(newObject);

输出

{ name: 'John', age: 30 }
{ name: 'John', age: 31 }

方法3:使用JavaScript Object assign() 方法

Object.assign()方法被用于将一个或多个源对象的值和属性复制到目标对象。

语法:

Object.assign( target, ...sources );

示例:
在这个示例中,我们将使用Object.assign()创建一个新的对象,并保留现有对象的属性。

Javascript

// Creating an object constructor and assigning 
// values to it 
const obj1 = { name: 'JavaScript' }; 
  
// Creating a second object using  
// Object.assing() method 
const obj2 = Object.assign({},obj1) 
  
// Updating the properties of new object 
obj2.name = 'HTML'; 
  
// Displaying the properties  
console.log(obj1.name) 
console.log(obj2.name);

输出

JavaScript
HTML

总之,目标是保持对象的不可变性,可以通过冻结对象使其不可变,或者通过创建一个具有一些修改属性的新对象来实现。
可以使用内置的JavaScript方法,如Object.freeze()Object.assign(),展开运算符(...)等来实现。