Enregistrements et tuples: les nouveaux types de données immuables de JavaScript

Enregistrements et tuples JavaScript: L'avenir des structures de données immuables

JavaScript est sur le point d'inaugurer deux nouveaux types de données immuables: les enregistrements et les tuples. Ils sont actuellement dans la phase 2 du processus d'approbation standard TC39 et sont toujours en cours d'amélioration et ne sont disponibles dans aucun navigateur ou environnement d'exécution, mais les versions de mise en œuvre devraient être disponibles au cours de l'année prochaine. Ils sont conçus pour résoudre certains des problèmes difficiles auxquels les développeurs sont confrontés lors de l'utilisation de tableaux et d'objets.

points clés

• Les enregistrements et les tuples sont de nouveaux types de données immuables en cours de développement en JavaScript et devraient être disponibles au cours de l'année prochaine. Ils sont conçus pour résoudre les défis auxquels sont confrontés les développeurs, comme s'assurer que les fonctions ne modifient pas intentionnellement ou non des valeurs enregistrées dans des tableaux ou des objets.
• Les tuples sont des structures de données de type tableau avec une profondeur immuable. Ils ne peuvent pas avoir de valeurs non définies, ils ne peuvent définir que des types de base, d'autres tuples ou des enregistrements. Les tuples sont des types primitifs, vous pouvez donc comparer en profondeur avec d'autres tuples par valeur.
• Les enregistrements sont des structures de données similaires aux objets avec une profondeur immuable. Ils doivent utiliser des noms d'attribut de chaîne et ne peuvent définir des valeurs qu'avec des types primitifs, d'autres tuples ou des enregistrements. Les enregistrements peuvent être comparés en profondeur avec d'autres enregistrements, et l'ordre des attributs n'est pas pertinent.

Limites de const

Les développeurs JavaScript expérimentés savent que l'utilisation const pour déclarer les variables est la meilleure pratique. Il rend les variables immuables. La valeur ne peut pas être modifiée, vous devez donc faire face à moins de problèmes.

Malheureusement, const ne peut que rendre les valeurs de base immuables (cordes, nombres, bigint, booléens, symboles et indéfinis). Vous ne pouvez pas réaffecter des tableaux ou des objets, mais les valeurs et les propriétés qu'ils contiennent sont peuvent être modifiées. Par exemple:

Il en va de même pour les objets

<code class="language-javascript">// 数组常量
const myArray = [1, 2, 3];

// 更改数组值
myArray[0] = 99;
myArray.push(42);

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

myArray = 'change'; // 错误！</code>

:

La méthode

<code class="language-javascript">// 对象常量
const myObj = { a: 1, b: 2, c: 3 };

// 更改对象属性
myObj.a = 99;
myObj.d = 42;

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

myObj = 'change'; // 错误！</code>

peut aider, mais elle applique seulement un gel peu profond aux propriétés enfants directes de l'objet: Object.freeze()

<code class="language-javascript">const myObj = { a: 1, b: 2, c: { v: 3 } };
Object.freeze(myObj);

myObj.a = 99; // 静默忽略
myObj.c.v = 99; // 可以正常工作

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

Par conséquent, il est difficile de s'assurer que les fonctions ne modifient pas intentionnellement ou non les valeurs enregistrées dans les tableaux ou les objets. Les développeurs laissent les choses tranquilles ou passent des versions clonées des variables - (cela a également ses propres défis).

comparaison incohérente

Plus de confusion peut se produire lorsque les développeurs essaient de faire des comparaisons d'objets ou de tableau apparemment raisonnables:

<code class="language-javascript">const str = 'my string';
console.log(str === 'mystring');  // false

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</code>

Seuls les types de base peuvent être comparés par valeur. Les objets et les tableaux sont passés et comparés par référence

. Ce n'est que lorsque deux variables pointent vers le même élément en mémoire qu'ils sont également:

La comparaison profonde de deux objets ou tableaux nécessite une fonction de comparaison récursive pour évaluer chaque valeur tour à tour. Même alors, vous pouvez avoir des problèmes avec des types tels que des dates ou des fonctions qui peuvent être stockées de différentes manières.

<code class="language-javascript">const a = [1, 2];

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

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

// 原始数组已更改
console.log(a); // [1, 2, 3]</code>

Tuple: structure de données de type réseau immuable

Les tuples sont des structures de données de type tableau avec une profondeur immuable. Ce sont en fait des types primitifs composés, identifiés avec le modificateur # avant syntaxe normale du tableau:

<code class="language-javascript">// 数组常量
const myArray = [1, 2, 3];

// 更改数组值
myArray[0] = 99;
myArray.push(42);

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

myArray = 'change'; // 错误！</code>

ou, la nouvelle méthode Tuple.from() peut créer un tuple à partir d'un tableau:

<code class="language-javascript">// 对象常量
const myObj = { a: 1, b: 2, c: 3 };

// 更改对象属性
myObj.a = 99;
myObj.d = 42;

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

myObj = 'change'; // 错误！</code>

Contrairement aux tableaux standard, les tuples doivent répondre aux exigences suivantes:

1. Ils ne peuvent pas avoir des espaces vides avec une valeur de undefined. Par exemple, #[1,,,4] n'est pas valide.
2. Ils ne peuvent définir que des types de base, d'autres tuples ou des enregistrements. Les tableaux, objets ou fonctions ne peuvent pas être utilisés:

<code class="language-javascript">const myObj = { a: 1, b: 2, c: { v: 3 } };
Object.freeze(myObj);

myObj.a = 99; // 静默忽略
myObj.c.v = 99; // 可以正常工作

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

Étant donné que les tuples sont des types de base, vous pouvez comparer la profondeur avec d'autres tuples par valeur:

<code class="language-javascript">const str = 'my string';
console.log(str === 'mystring');  // false

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</code>

Notez que si le tuple contient une seule valeur, vous pouvez utiliser l'opérateur plus lâche == pour comparaison. Par exemple:

<code class="language-javascript">const a = [1, 2];

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

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

// 原始数组已更改
console.log(a); // [1, 2, 3]</code>

Enregistrer: structure de données de type objet immuable

Les enregistrements sont des structures de données similaires aux objets avec une profondeur immuable. Encore une fois, ce sont des types primitifs composés, identifiés à l'aide du modificateur # avant la syntaxe d'objet normal:

<code class="language-javascript">// 新的元组
const t1 = #[1, 2, 3];
const t2 = #[1, 2, #[3, 4]];</code>

ou, le nouveau constructeur Record() peut créer un enregistrement à partir d'un objet:

<code class="language-javascript">// 从数组创建新的元组
const t3 = Tuple.from([1, 2, 3]);</code>

ou Record.fromEntries() La méthode peut créer un enregistrement à partir d'une série de paires de valeurs de clé ou de tuple:

<code class="language-javascript">const t4 = #[new Date()]; // 错误（设置一个对象）
const t5 = #[1, 2, [3, 4]]; // 错误（设置一个数组）</code>

Contrairement aux objets standard, les enregistrements doivent répondre aux exigences suivantes:

1. Ils doivent utiliser des noms d'attribut de chaîne. Par exemple, #{ Symbol(): 1 } n'est pas valide.
2. Ils ne peuvent définir des valeurs qu'à l'aide de types primitifs, d'autres tuples ou enregistrements. Les tableaux, objets ou fonctions ne peuvent pas être utilisés:

<code class="language-javascript">const t6 = #[1, 2];

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

Les enregistrements peuvent être comparés en profondeur avec d'autres enregistrements, et l'ordre des attributs n'est pas pertinent:

<code class="language-javascript">const t7 = #[99];

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

// 元组不能与数组比较
console.log(t7 == [99]);  // false</code>

Les enregistrements ne peuvent être comparés qu'à d'autres enregistrements, il n'y a donc pas de différence entre l'utilisation des opérateurs == ou ===. Cependant, Object.keys() et Object.values() peuvent être extraits pour des comparaisons spécifiques. Par exemple:

<code class="language-javascript">// 新的记录
const r1 = #{ a: 1, b: 2 };
const r2 = #{
  a: 1,
  b: #{ c: 2 }, // 子记录
  d: #[3, 4]  // 子元组
};</code>

Mise à jour immuable

Les tuples et les enregistrements ressemblent à des termes informatiques complexes, mais ils permettent finalement un puissant stockage de données immuables et comparaison en JavaScript.

Enregistrements et tuples dans JavaScript FAQ

Qu'est-ce qu'un enregistrement en JavaScript? Les enregistrements en JavaScript sont une structure de type objet introduit dans ECMAScript 2022 (ES12). Il est conçu pour représenter les données avec des propriétés nommées et est immuable par défaut, il convient donc pour une utilisation comme structure de données où les valeurs ne sont pas modifiées après la création.

Quelle est la différence entre les enregistrements et les objets JavaScript ordinaires? Contrairement aux objets normaux, les enregistrements en JavaScript sont immuables par défaut et une fois définis, leurs propriétés ne peuvent pas être modifiées. Les enregistrements sont également plus prévisibles et ont des structures plus strictes, ils conviennent donc à une utilisation comme conteneurs de données.

Que sont les tuples en javascript? Les tuples en javascript sont une collection commandée d'éléments, où chaque élément peut être de type différent. Les tuples sont immuables et fixes en longueur, fournissant un moyen de représenter et de traiter le nombre fixe de valeurs dans un ordre particulier.

Comment les enregistrements et les tuples améliorent-ils la lisibilité et la maintenabilité de votre code? Les enregistrements et les tuples peuvent améliorer la lisibilité du code en fournissant un moyen plus déclaratif et structuré de représenter les données. L'aspect immutabilité aide également à prévenir les modifications accidentelles, améliorant ainsi la maintenabilité du code.

Y a-t-il des considérations de performances lors de l'utilisation d'enregistrements et de tuples? Les enregistrements et les tuples agissent comme des structures de données immuables, ce qui peut améliorer les performances dans certains cas. Cependant, la prise en charge du navigateur et les cas d'utilisation spécifiques doivent être pris en compte, car les impacts des performances peuvent varier en fonction des détails de l'implémentation de l'exécution JavaScript.

Comment fournir des polyfills pour les enregistrements et les tuples dans un environnement sans support natif? Depuis ma dernière mise à jour, les enregistrements et les tuples peuvent être simulés dans des environnements sans support natif à l'aide de polyfill ou de traducteur. Cependant, il est recommandé de se tenir au courant des mises à jour des normes et des outils JavaScript alors que l'écosystème continue d'évoluer.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!