JavaScript里新的不可变数据类型：记录和元组【Records and Tuples】 - Web前端

记录和元组是当前在“TC39标准批准流程”的第2阶段中新的javascript不可变数据类型。它们可能会有所更改，并且当前在任何浏览器或运行时中均不可用，但是有效的实现应在明年之内到来。他们帮助解决了编码员面临的一些令人困惑的难题……

不断变化【constant Changes】

专业的JavaScript专家会告诉您，const在可行的情况下，最好的做法是分配变量。它使变量不可变。值无法更改，因此您需要处理的问题更少。

不幸的是，const仅使原始值不可变（字符串，数字，Bigint，布尔值，符号和undefined）。您不能重新分配数组或对象，但是可以修改它们包含的值和属性。例如：

// Array constant
const myarray = [1, 2, 3];

// change array values
myArray[0] = 99;
myArray.push(42);

console.log(myArray); // [ 99, 2, 3, 42 ]

myArray = 'change'; // erroR!

对于对象类似：

// Object constant
const myObj = { a: 1, b: 2, c: 3 }

// change object properties
myObj.a = 99;
myObj.d = 42;

console.log(myObj); // { a:99 ,b:2, ,c:3, ,d:42 }

myObj = 'change'; // ERROR!

该Object.freeze()方法可以提供帮助，但是仅将浅冻结应用于对象的直接子属性：

const myObj = { a: 1, b: 2, c: { v: 3 } }
Object.freeze(myObj);

myObj.a = 99; // silently ignored
myObj.c.v = 99; // works fine

console.log(myObj); // { a: 1, b: 2, c: { v: 99 } }

因此，很难保证函数不会有意或无意地更改数组或对象中保存的值。开发人员必须希望最好，或者传递变量的克隆版本（这有其自身的挑战）。

等价不等式

当开发人员尝试进行看似合理的对象或数组比较时，可能会导致进一步的混乱：

const str = 'my string';
console.log( str === 'myString' );  // true

const num = 123;
console.log( num === 123 );         // true

const arr = [1, 2, 3];
console.log( arr === [1, 2, 3] );   // false

const obj = { a: 1 };
console.log( obj === { a: 1 } );    // false

只能按值比较原始类型。对象和数组通过引用进行传递和比较。仅当两个变量指向内存中的相同项目时，它们才是等效的：

const a = [1, 2];

const b = a;
b.push(3);

console.log( a === b ); // true

// original array has changed
console.log( a ); // [1, 2, 3]

深度比较两个对象或数组需要递归比较功能，以便依次评估每个值。即使这样，您仍可能遇到日期或函数等类型的问题，这些问题可能以不同的方式存储。

元组：不可变的类似数组的数据结构

元组是非常不可变的类似数组的数据结构。它们是#在常规数组语法之前用修饰符标识的有效复合原始类型：

// new tuples
const t1 = #[1, 2, 3];
const t2 = #[1, 2, #[3, 4]];

另外，一种新Tuple.from()方法可以从数组创建元组：

// new tuple from an array
const t3 = Tuple.from( [1, 2, 3] );

与标准数组不同，元组必须满足以下要求：

1. 它们不得带有未设置值的孔。例如，#[1,,,4]无效。

2. 它们只能设置基元，其他元组或记录。不允许使用诸如数组，对象或函数之类的类型：

const t4 = #[ new date() ]; // ERROR (sets an object)
  const t5 = #[1, 2, [3, 4]]; // ERROR (sets an array)

由于元组是基元，因此可以将它们与其他元组进行深度比较：

const t6 = #[1, 2];
console.log( t6 === #[1, 2] ); // true

注意，==如果元组持有单个值，则可以使用不太严格的运算符进行比较。例如：

const t7 = #[99];

console.log( t7 == #[99] ); // true
console.log( t7 == 99 );    // true
console.log( t7 == '99' );  // true

// tuple cannot be compared to an array
console.log( t7 == [99] );  // false

记录：不可变的类对象数据结构

记录是一种高度不变的，类似于对象的数据结构。同样，它们是#在普通对象语法之前用修饰符标识的复合基本类型：

// new records
const r1 = #{ a: 1, b: 2 };
const r2 = #{
  a: 1,
  b: #{ c: 2 }, // child record
  d: #[ 3, 4 ]  // child tuple
};

另外，新的Record()构造函数可以从对象创建记录：

// new record from an object// #{ a: 1, b: 2 }const r3 = Record({ a: 1, b: 2 });

或者该Record.fromEntrIEs()方法可以根据一系列数组或元组值对创建记录：

// new record from array of name-values// #{ a: 1, b: 2 }const r4 = Record.fromEntries([
  ['a', 1],
  ['b', 2]]);

与标准对象不同，记录必须满足以下要求：

1. 它们必须使用字符串属性名称。例如，#{ Symbol(): 1 }无效。

2. 它们只能使用基元，其他元组或记录来设置值。不允许使用诸如数组，对象或函数之类的类型：

 const r5 = #{ 'd': new Date() };   // ERROR (sets an object)
 const r6 = #{ a: 1, b: { c: 2 } }; // ERROR (sets an object)

记录可以与其他记录进行深度比较，并且属性顺序无关紧要：

const r7 = #{ a: 1, b: 2 };
console.log( r7 === #{ b: 2, a: 1 } ); // true

记录只能与其他记录进行比较，因此使用==或===运算符没有区别。但是，可以提取对象keys()并values()进行特定比较。例如：

const r8 = #{ a: 99 };
console.log( Object.values(r8) == 99 ); // true

不变的更新

元组和记录听起来可能像复杂的计算机科学术语，但是它们最终将允许健壮的不可变数据存储和Javascript中的比较。您可以今天使用这种polyfill进行尝试，但是请注意，建议的实施方式可能在未来几个月内发生变化。

标签：数据类型WebTuplesRecordsJavaScript