This content originally appeared on SitePoint and was authored by Craig Buckler
Records and tuples are new JavaScript immutable data types currently at stage 2 in the TC39 standards approval process. They are subject to change and not currently available in any browser or runtime, but working implementations should arrive within the next year. They help solve a couple of confusing conundrums faced by coders …
Constant Changes
Professional JavaScripters will tell you that assigning variables with const is best practice where possible. It makes variables immutable. Values can’t be changed, so you have fewer issues to deal with.
Unfortunately, const only makes primitive values immutable (String, Number, BigInt, Boolean, Symbol, and undefined). You can’t reassign an array or an object, but the values and properties they contain can be modified. For example:
// 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!
Similarly for objects:
// 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!
The Object.freeze() method can help, but only shallow freezing is applied to the immediate child properties of an object:
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 } }
It’s therefore difficult to guarantee a function won’t intentionally or accidentally change the values held in an array or object. Developers must either hope for the best or pass a cloned version of a variable — (which has its own challenges).
Equivalent Inequality
Further chaos can ensue when developers attempt seemingly reasonable object or array comparisons:
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
Only primitive types can be compared by value. Objects and arrays are passed and compared by reference. Two variables will only be equivalent when they point to the same item in memory:
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]
Deeply comparing two objects or arrays requires a recursive comparison function to assess each value in turn. Even then, you may encounter issues with types such as dates or functions which could be stored in different ways.
Continue reading JavaScript’s New Immutable Data Types: Records and Tuples on SitePoint.
This content originally appeared on SitePoint and was authored by Craig Buckler
Craig Buckler | Sciencx (2021-01-12T06:30:43+00:00) JavaScript’s New Immutable Data Types: Records and Tuples. Retrieved from https://www.scien.cx/2021/01/12/javascript8217s-new-immutable-data-types-records-and-tuples/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.