Les caractères d'extension peuvent-ils être utilisés dans les tableaux es6 ?

Les tableaux ES6 peuvent utiliser des caractères d'extension. L'expandeur "..." développera l'objet itérable en ses éléments individuels, et l'objet dit itérable est tout objet qui peut être parcouru à l'aide d'une boucle "for of", comme des tableaux, des chaînes, des cartes et des ensembles ; Lorsque l'extenseur est utilisé avec des tableaux, il convertit un tableau en une séquence d'arguments séparés par des virgules.

L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.

Opérateur d'expansion (opérateur d'expansion) … a été introduit dans ES6, qui développe les objets itérables en leurs éléments séparés. Le soi-disant objet itérable est tout ce qui peut être parcouru à l'aide d'un objet de boucle for. tels que des tableaux, des chaînes, des cartes, des ensembles, des nœuds DOM, etc. … 是ES6中引入的，将可迭代对象展开到其单独的元素中，所谓的可迭代对象就是任何能用for of循环进行遍历的对象，例如：数组、字符串、Map 、Set 、DOM节点等。

展开运算符（spread operator）允许一个表达式在某处展开。展开运算符在多个参数（用于函数调用）或多个元素（用于数组字面量）或者多个变量（用于解构赋值）的地方可以使用。

es6展开符的使用（数组方面）

1、复制数组

给定一个数组，想要将一个数组的成员复制到另一个数组中，该怎么做？

const a = [1, 2];
const b = a;
console.log(b); // [1, 2]

真有表面上这么简单吗？试着修改一下a数组中的值

a[0] = 3;
console.log(b); // [3, 2]

诶？怎么我修改了a数组中的值，结果b数组中的值也变了？这里涉及到的是堆栈的原理，就不具体展开说了，你只需要知道简单地使用两边相等的方式是不能完成数组的复制的，这里使用展开运算符就可以完成啦?

const a = [1, 2];
const c = [...a];
console.log(c); // [1, 2]
a[0] = 3;
console.log(c); // [1, 2]

2、合并数组

const a = [1, 2];
const b = [3];
const c = [4, 5];

console.log([...a, ...b, ...c]); // [1, 2, 3, 4, 5]
console.log([...c, ...a, ...b]); // [4, 5, 1, 2, 3]
console.log([99, ...a, 24, ...b, ...c]); // [99, 1, 2, 24, 3, 4, 5]

3、字符串转为数组

前置知识：字符串可以按照数组的形式展开?

const name = 'Jae';
console.log(...name); // J a e

字符串转数组除了用 split()

L'opérateur spread permet de développer une expression quelque part. L'opérateur spread peut être utilisé lorsqu'il y a plusieurs arguments (pour les appels de fonction) ou plusieurs éléments (pour les littéraux de tableau) ou plusieurs variables (pour les affectations de déstructuration).

Utilisation de l'expanseur es6 (aspect du tableau)

1 Copier un tableau

• Étant donné un tableau, vous voulez comment faire. copier les membres d'un tableau vers un autre tableau ?

  const name = 'Jae';
  const name_string = [...name];
  console.log(name_string); // ["J", "a", "e"]

  Est-ce vraiment aussi simple qu'il y paraît ? Essayez de modifier les valeurs du tableau a

function func() {
	console.log(arguments);
}
func(1, 2); // Arguments(2) [1, 2, callee: ƒ, Symbol(Symbol.iterator): ƒ]

// 使用展开远算符
function func() {
	console.log([...arguments]);
}
func(1, 2); // [1, 2]

eh ? Pourquoi ai-je modifié la valeur du tableau a, mais la valeur du tableau b a également changé ? Ce qui est en jeu ici, c'est le principe de la pile, donc je ne le développerai pas en détail. Vous devez seulement savoir que le simple fait d'utiliser la méthode égale des deux côtés ne peut pas terminer la copie du tableau. Vous pouvez utiliser l'opérateur d'expansion ici ?

<!--HTML代码-->
<p>1</p>
<p>2</p>
<p>3</p>

2. Fusionner des tableaux

const a = document.querySelectAll("p");
console.log(a); // NodeList(3) [p, p, p]
console.log([...a]); // [p, p, p]

3. Convertir des chaînes en tableaux

Connaissances préalables : les chaînes peuvent être étendues sous la forme de tableaux ?

rrreeeEn plus d'utiliser split( ), vous pouvez également utiliser l'opérateur spread ?rrreee4. Convertir des objets courants de type tableau en tableaux

Pourquoi devriez-vous convertir des objets de type tableau en tableaux ? Étant donné que les méthodes de type tableau ne peuvent pas utiliser de méthodes de type tableau, leur conversion est plus pratique pour certains besoins de traitement de données ~🎜🎜🎜🎜arguments🎜🎜🎜rrreee🎜🎜🎜NodeList🎜🎜🎜rrreeerrreee🎜[Recommandations associées : 🎜Tutoriel vidéo javascript🎜, 🎜 Vidéo de programmation🎜】🎜

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!