配列およびオブジェクトにおけるスプレッド演算子の適用

… ES6 スプレッド演算子

1. スプレッド演算子はデータを展開できます
2. スプレッド演算子を単独で使用して配列を展開することはできません パラメータ内で使用すると、パラメータ配列をパラメータ リストに変換できます。
3. スプレッド演算子の後に変数が続く場合、別の追加の配列が受け入れられ、配列に配置されます。

1. 配列におけるスプレッド演算子の適用

1. 配列を走査する

	var arr = [1, 2, 3, 4]
    console.log(...arr);

2. 配列パラメータとして使用可能

	var arr = [1, 2, 3, 4]
	var numArr = ['a', ...arr, 'b']
    console.log(numArr);

3. 配列のディープコピーを実行できる

	var arr = [1, 2, 3, 4]
	var arrA = [...arr]
    console.log(arrA);
    arrA.unshift(0)  // 给arrA数组添加元素
    console.log(arrA);
    console.log(arr);

4. 関数のパラメータとして使用可能

 	var arr = [1, 2, 3, 4]
 	function fn(x, ...y) {
    
    
        console.log(x);
        console.log(...y);
    	}
    	fn(...arr)

5. 構造化代入で使用する

	let [a, ...b] = [1, 2, 3, 4]
    console.log(a);
    console.log(b);

6. 擬似配列を実際の配列に変換できます

	var str = '我们真好'
    	console.log(Array.from(str));  // Array.from()也可以将伪数组转化为真正的数组
    	console.log([...str]);

2. オブジェクトへのエキスパンダーの適用

1. オブジェクトを横断する

var obj = {
    
    
        name: 'name',
        age: 18,
        sex: '男'
    }
    console.log({
    
     ...obj});

2. オブジェクトにデフォルト値を割り当てる

 var obj_1 = {
    
    
        a: 1,
        b: 2
    }
    var obj_2 = {
    
    
     ...obj_1,
        b: 3
    }
    console.log(obj_2);

マージされたオブジェクト内の同じプロパティは上書きされます

3. オブジェクトを結合する

let obj1 = {
    
    a:1)
let obj2 = {
    
    b:2},
let obj3 ={
    
    ...obj1,...obj2);
console.log(obj3)

4. スプレッド演算子の後に文字列が続く場合、それは自動的に配列のようなオブジェクトに変換されるため、返されるオブジェクトは空のオブジェクトではありません。

console.log({
    
    ...'hello'});//{ '0': 'h', '1': 'e', '2': 'l', '3': 'l', '4': 'o' }

3. スプレッド演算子の後にオブジェクトが続かない場合は、自動的にオブジェクトに変換されます。オブジェクトには独自のプロパティがないため、空のオブジェクトが返されます。

console.log({
    
    ...1});//{}
console.log({
    
    ...true});//{}
console.log({
    
    ...undefined});//{}
console.log({
    
    ...null});//{}

おすすめ

転載: blog.csdn.net/qq_52654932/article/details/130273381