JavaScript でスプレッド演算子 (...) を使用するにはどうすればよいですか? 8つの方法を紹介

スプレッド演算子 (...) は ES6 で導入されました。

スプレッド演算子は、反復可能オブジェクト (for ループを使用してループできるオブジェクト) を個々の要素に展開します。

反復可能な例: 配列、文字列、マップ、セット、DOM ノード。

1. ログでスプレッド演算子を使用する

console.log で反復できます。オブジェクトはスプレッド演算子

#2. スプレッド演算子を使用して配列をコピーします

オブジェクトのコピー

let user = {name : "John", age : 20 }
let userCopy = {...user}

ストレッチ操作演算子はディープ コピーを実行しません。

3. 拡張演算子 merge

オブジェクトのマージ

オブジェクトのマージ 、キーがすでに存在する場合は、同じキーを持つ最後のオブジェクトに置き換えられます。

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

4. スプレッド演算演算子はパラメータ

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

として渡され、 math 関数は一緒に使用されます

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

#5. 拡張演算子は変数の構造化に使用されます

#オブジェクトの構造

#

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

#6. NodeList オブジェクトを配列に変換

NodeList 配列に似ていますが、forEach

、

map、filter などの Array のすべてのメソッドがありません。等

let nodeList = document.querySelectorAll('.class')
var nodeArray = [...nodeList]

7. 文字列を文字に変換する

文字列は反復可能なオブジェクトでもあるため、. ..## を使用することもできます。 # を文字列に変換します。

let name = "Ram";
let chars = [...name]; // ["R", "a", "m"]

8. 配列から重複を削除

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

元のアドレス: https://medium.com/javascript-in -plain-english/8-ways-to-use-spread-operator-in-javascript-b66fcf016efe

著者: Javascript Jeep

転載元: https://segmentfault.com/a /1190000023023909

推奨される関連チュートリアル:

JavaScript ビデオ チュートリアル

以上がJavaScript でスプレッド演算子 (...) を使用するにはどうすればよいですか? 8つの方法を紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。