您现在的位置是:亿华云 > IT科技类资讯

JavaScript 新增两个原始数据类型

亿华云2025-10-04 04:00:34【IT科技类资讯】2人已围观

简介基础写法// Recordsconst myRecord = #{name: 01,age: 23}// Tupleconst myTuple = #[1, 2, 3]其实就是在原先的对象和数组前面加

基础写法// Records

const myRecord = #{

name: 01,新增

age: 23

}

// Tuple

const myTuple = #[1, 2, 3]

其实就是在原先的对象和数组前面加了个 #

可读特性

Record和Tuple的语法跟对象和数组是一样的,所以?两个类型

const myRecord = #{

name: 01

}

const myTuple = #[1, 2]

myRecord[age] = 23 // error

myTuple.push(3) // error

为啥报错了啊?开头有提到哦~因为这两个类型是 只读的 Object 和 Array

非唯一性

在平时的开发中,数组与数组、原始对象与对象 都不适合直接用 === 进行比较判断,数据因为每个生成的新增对象在内存中的地址都不一样

const obj1 = { name: 01 }

const obj2 = { name: 01 }

const objIsSame = obj1 === obj2 // false

const arr1 = [1]

const arr2 = [1]

const arrIsSame = arr1 === arr2 // false

要想真正比较两个数组或对象是源码下载否相等(即我们想要的内容都一样),需要遍历递归去一一对比,两个类型而现在呢?原始Record和Tuple能否解决这一问题呢?

const record1 = #{ name: 01 }

const record2 = #{ name: 01 }

const recordIsSame = record1 === record2 // true

const tuple1 = #[1]

const tuple2 = #[1]

const tupleIsSame = tuple1 === tuple2 // true

可以看到,只要内部内容一致,数据即使是新增两个分别生成的Record或Tuple比较一下,也是两个类型相等的

普通对象和数组的转换

我可以用对象 Record 和 Tuple 将普通的对象和数组转换

const myRecord = Record({ name: 01, age: 23 }); // #{ name: 01, age: 23 }

const myTuple = Tuple([1, 2, 3, 4, 5]); // #[1, 2, 3, 4, 5]

支持扩展运算符

我们也可以对Record和Tuple使用扩展运算符

const myTuple = #[1, 2, 3];

const myRecord = #{ name: 01, age: 23 };

const newRecord = #{ ...myRecord, money: 0 } // #{ name: 01, age: 23, money: 0 }

const newTuple = #[ ...myTuple, 4, 5]; // #[1, 2, 3, 4, 5]

JSON方法扩展

现在不是有 JSON.parse 和 JSON.stringfy 两个方法嘛,云南idc服务商据说草案中还提到一个不错的原始想法,那就是数据给 JSON 对象新增一个 parseImmutable 方法,功能应该就是新增直接将一个 Record字符串或Tuple字符串 解析成对应的Record和Tuple对象

提前体验

如果你想现在体验该功能,可以装一下babel的两个类型插件

# babel基本的库

yarn add @babel/cli @babel/core @babel/preset-env -D

# Record和Tuple Babel polyfill

yarn add @babel/plugin-proposal-record-and-tuple @bloomberg/record-tuple-polyfill -D

在目录下创建 .babelrc,内容如下:

{

"presets": ["@babel/preset-env"],原始

"plugins": [

[

"@babel/plugin-proposal-record-and-tuple",

{

"importPolyfill": true,

"syntaxType": "hash"

}

]

]

}

再创建一个 index.js,内容如下:

const tuple1 = #[1,2,3]

const tuple2 = #[1,2,3]

const record1 = #{ name: 01 }

const record2 = #{ name: 02 }

console.log(tuple1 === tuple2, record1 === record2)

执行一下babel的命令编译一下

./node_modules/.bin/babel index.js --out-file compiled.js

输出得到的 compiled.js 文件内容如下:

"use strict";

var _recordTuplePolyfill = require("@bloomberg/record-tuple-polyfill");

var tuple1 = (0, _recordTuplePolyfill.Tuple)(1, 2, 3);

var tuple2 = (0, _recordTuplePolyfill.Tuple)(1, 2, 3);

var record1 = (0, _recordTuplePolyfill.Record)({

name: 01

});

var record2 = (0, _recordTuplePolyfill.Record)({

name: 02

});

console.log(tuple1 === tuple2, record1 === record2);

最后执行 compiled.js 即可获得结果

node compiled.js

# Result: true false

云服务器

很赞哦!(568)