Shulou(Shulou.com)06/01 Report--

This article mainly explains "how to use Record and Tuple of JavaScript". Interested friends may wish to have a look at it. The method introduced in this paper is simple, fast and practical. Now let the editor take you to learn how to use JavaScript's Record and Tuple.

Preface

JavaScript is about to launch two new data types: Record and Tuple. What are these two? In fact, is a read-only Object and Array, in fact, there are similar data types in other languages, for example, Python also has Tuple (meta-ancestor) this type, the role is also a read-only array (in Python called read-only list), together to learn that this feature is a phase 2 proposal (that is, almost stable).

Basic writing / / Recordsconst myRecord = # {name:'01, age: 23} / / Tupleconst myTuple = # ['1,'2,'3']

In fact, it is to add a # to the original object and array

Readable characteristic

The syntax of Record and Tuple is the same as objects and arrays, so?

Const myRecord = # {name: '01'} const myTuple = # [' 1mm,'2'] myRecord ['age'] = 23 / / errormyTuple.push (' 3') / / error

Why did you report it wrong? It was mentioned at the beginning because these two types are read-only Object and Array.

Non-unique

In normal development, arrays and arrays, objects and objects are not suitable for direct comparison, because each generated object has a different address in memory.

Const obj1 = {name: '01'} const obj2 = {name:' 01'} const objIsSame = obj1 = obj2 / / falseconst arr1 = [1] const arr2 = [1] const arrIsSame = arr1 = arr2 / / false

To really compare whether two arrays or objects are equal (that is, what we want is the same), we need to go through recursion to compare them one by one, and now? Can Record and Tuple solve this problem?

Const record1 = # {name: '01'} const record2 = # {name:' 01'} const recordIsSame = record1 = record2 / / trueconst tuple1 = # [1] const tuple2 = # [1] const tupleIsSame = tuple1 = tuple2 / / true

As you can see, as long as the internal content is the same, even if two separately generated Record or Tuple are compared, they are equal.

Conversion of ordinary objects and arrays

I can use objects Record and Tuple to convert ordinary objects and arrays

Const myRecord = Record ({name:'01, age: 23}); / / # {name:'01, age: 23} const myTuple = Tuple ([1,2,3,4,5]); / / # [1,2,3,4,5] supports extension operators

We can also use extension operators for Record and 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 method extension

Now there are two methods: JSON.parse and JSON.stringfy. It is said that a good idea is mentioned in the draft, that is, to add a parseImmutable method to the JSON object, which should directly parse a Record string or Tuple string into the corresponding Record and Tuple objects.

Experience ahead of time

If you want to experience this feature now, you can install the plug-in for babel

# babel basic Kuyarn add @ babel/cli @ babel/core @ babel/preset-env-D# Record and Tuple Babel polyfillyarn add @ babel/plugin-proposal-record-and-tuple @ bloomberg/record-tuple-polyfill-D.

Create .babelrc in the directory as follows:

{"presets": ["@ babel/preset-env"], "plugins": [["@ babel/plugin-proposal-record-and-tuple", {"importPolyfill": true, "syntaxType": "hash"}]]}

Create another index.js with the following content:

Const tuple1 = # [1 name 2 record1 3] const record1 = # {name: '01'} const record2 = # {name:' 02'} console.log (tuple1 = tuple2, record1 = record2)

Execute the babel command and compile it.

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

The output of the compiled.js file is as follows:

"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)

Finally, execute compiled.js to get the result.

Node compiled.js# Result: true false application scenario

Having learned so much, what should be most impressive is the read-only feature, so what are the application scenarios for Record and Tuple based on this feature?

It is used to protect some data, such as the return value of the function and the static properties inside the object.

Since it has a read-only property, that is, an immutable object, it should also be used as the key value of the object, right?

At this point, I believe you have a deeper understanding of "how to use JavaScript's Record and Tuple". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.