ES6擴充套件運算子 的應用

@es6

擴充套件運算子(…)可以將陣列或物件拆分成以逗號分隔的引數序列

// 方法一   (常用)

let ary1 =[1
,2,3
];let ary2 =[3
,4,5
];let ary3 =
[...ary1,
...ary2]
; console.
log(ary3)
;// [1, 2, 3, 3, 4, 5]
// 方法二 
let ary1 =[1
,2,3
];let ary2 =[3
,4,5
];ary1.
push
(...ary2)
; console.
log(ary1)
;// [1, 2, 3, 3, 4, 5]

var obj =

, sayhi:
function()
}var o =
;function
deepcopy
(newobj, oldobj)
else
if(oldobj[k]
instanceof
function
)else
if(oldobj[k]
instanceof
object);
}else}}
deepcopy
(o, obj)
console.
log(obj)
; console.
log(o)
; o.
sayhi()
; obj.
sayhi()
; o.name =
'amy'
; console.
log(o.name)
; console.
log(obj.name)
;//修改新物件的屬性,不會影響舊物件
o.color[2]
='blue'
; console.
log(o.color)
; console.
log(obj.color)
;//修改新物件的屬性,不會影響舊物件
o.sayhi
=function()
; o.
sayhi()
; obj.
sayhi()
//修改新物件的方法,不會影響舊物件

<

!doctype html>
"en"
>
"utf-8"
>
擴充套件運算子<
/title>
<
/head>
1<
/div>
4<
/div>
3<
/div>
6<
/div>
2<
/div>
5<
/div>
// 利用擴充套件運算子將偽陣列轉換為真正的陣列
var odivs = document.
getelementsbytagname
('div');
console.
log(odivs)
//htmlcollection(6) [div, div, div, div, div, div] 偽陣列
var ary =
[...odivs]
; ary.
push
('a');
//真正的陣列,可以進行push操作
console.
log(ary)
;//[div, div, div, div, div, div, "a"] 
<
/script>
<
/body>
<
/html>

var str =

'hello world'
;var ary =
[...str]
;console.
log(ary)
;//(11) ["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]

擴充套件運算子可以與解構賦值結合起來，用於生成陣列。

var ary =[1

,2,4
,5];
var[a,
...b]
= ary;
console.
log(a)
;//1
console.
log(b)
;//[2,4,5]

var ary =[1

,2,4
,5];
var[
...a, b, c]
= ary;
//報錯:uncaught syntaxerror: rest element must be last element
var[a,
...b, c]
= ary;
//報錯:uncaught syntaxerror: rest element must be last element
var[a, b,
...c]
= ary;
//報錯:uncaught syntaxerror: rest element must be last element

ES6 擴充套件運算子的應用

1 複製陣列 陣列是復合的資料型別，直接複製的話，只是複製了指向底層資料結構的指標，而不是轉殖乙個全新的陣列。複製陣列 const a1 1,2 const a2 a1 a2 0 3 console.log a1 3,2 上面 中，a2並不是a1的轉殖，而是指向同乙份資料的另乙個指標。修改a2，會直...

ES6 擴充套件運算子

擴充套件運算子用3個點表示,功能是把陣列或者類陣列物件展開成一系列用逗號隔開的值 1，陣列 let arr red green blue console.log arr red,green,blue拷貝陣列 和object.assign一樣都是淺拷貝 let arr red green blue l...

ES6擴充套件運算子

首先，我們要讀仔細下面這句話，就很容易知道擴充套件運算子的使用了，可以在心裡反覆讀三遍 接下來，我們看下究竟怎麼個情況 宣告乙個方法 var foo function a,b,c console.log a console.log b console.log c 宣告乙個陣列 var arr 1,2...