Heim > Web-Frontend > js-Tutorial > Wie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt

Wie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt

青灯夜游
Freigeben: 2020-06-29 10:40:38
nach vorne
2641 Leute haben es durchsucht

Wie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt

Der Spread-Operator () wurde in ES6... eingeführt. Der

-Spread-Operator erweitert ein iterierbares Objekt, bei dem es sich um jedes Objekt handelt, das mithilfe einer for-Schleife wiederholt werden kann, in seine einzelnen Elemente.

Iterierbare Beispiele: Array, String, Map, Set, DOM-Knoten.

1. Verwenden Sie den Spread-Operator im Protokoll

Sie können den Spread-Operator für iterierbare Objekte in console.log

Wie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt

2. Verwenden Sie den Spread-Operator, um das Array zu kopieren

Wie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt

Objekt kopieren

 

let user = {name : "John", age : 20 }
let userCopy = {...user}
Nach dem Login kopieren

Der Stretch-Operator führt keine tiefe Kopie durch.

3. Streckenoperationsoperator zusammenführen

Wie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt

Objekte zusammenführen

Objekte zusammenführen, Wenn bereits ein Schlüssel vorhanden ist, wird er durch das letzte Objekt mit demselben Schlüssel ersetzt.

let user1 = {name : "John", age : 20 };
let user2 = {name : "Ram", salary: '20K' };
let userCopy = {...user1, ...user2};
userCopy ; // {name : "Ram", age :20 , salary : '20K'};
Nach dem Login kopieren

4. Der Spread-Operationsoperator wird als Parameter

function sum(a, b) {
   return a+b;
}
let num = [1,2];
sum(...num); // 3
Nach dem Login kopieren

übergeben

Funktionen werden zusammen verwendet math

let num = [5,9,3,5,7];
Math.min(...num);
Math.max(...num);
Nach dem Login kopieren

5. Der Spread-Operationsoperator befindet sich in der Destrukturierungsvariablen

Wie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt

Dekonstruiertes Objekt

let user = {name : "Ram", age: 20, salary: '20K', job : "Tester" };
let { name, age, ...details } = user;
name; // Ram
age; // 20
details; // {salary: '20K', job : 'Tester'};
Nach dem Login kopieren

6. NodeList-Objekt in Array konvertieren

NodeList ist ähnelt einem Array. Es gibt jedoch nicht alle Methoden von

, wie z. B. Array, forEach, map usw. filter

let nodeList = document.querySelectorAll('.class')
var nodeArray = [...nodeList]
Nach dem Login kopieren

7. String in Zeichen konvertieren

String ist auch ein iterierbares Objekt, daher können wir auch

für String verwenden. ...

let name = "Ram";
let chars = [...name]; // ["R", "a", "m"]
Nach dem Login kopieren

8. Duplikate aus einem Array entfernen

let num = [1, 3, 1, 3, 3, 1];
let uniqueNum = [...new Set(num)];
uniqueNum; //[ 1, 3 ]
Nach dem Login kopieren

Ursprüngliche Adresse: https://medium.com/javascript-in -plain-english/8-ways-to-use-spread-operator-in-javascript-b66fcf016efe

Autor: Javascript Jeep

Nachdruck von: https://segmentfault.com/ a /1190000023023909

Verwandte Tutorial-Empfehlungen:

JavaScript-Video-Tutorial

Das obige ist der detaillierte Inhalt vonWie verwende ich den Spread-Operator (...) in JavaScript? 8 Methoden vorgestellt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:segmentfault.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage