ES6的擴充套件運算子reset引數的用法

2021-10-08 15:59:15 字數 1850 閱讀 9255

es6中的擴充套件運算子(spread)是三個點(…)。

它好比 rest 引數的逆運算,將乙個陣列轉為用逗號分隔的引數序列。

console.log(

...[1, 2, 3]

)// 1 2 3

console.log(1, ...[2, 3, 4], 5)

// 1 2 3 4 5

在函式體內,它可以通過乙個物件來獲取所有引數,這個物件是:arguments。

比如:

function sayhi(name,age)`;

} console.log(arguments[0]);

}

sayhi(

"shuijingcao",11)

// 輸出 "name 11"

檢測引數個數

還可以用 arguments 物件檢測函式的引數個數,引用屬性 arguments.length 即可。

function sayhi(

)sayhi(

"string", 45)

;sayhi();

sayhi(12)

;//輸出 2 0 1

到了es6語法中,又引入了rest引數,形式為:擴充套件運算子(spread)…變數名。

arguments物件不再是陣列,只是可以以下標訪問而已,而rest引數才是乙個真正的陣列。

建構函式可以這樣編寫

function  sayhi(

...args)

$ $`)

}else

if(args.length == 2)

$ $`)

}else

}

sayhi(3,2,1)

sayhi(3,2)

sayhi(3)

sayhi(

[3,2,1],2,1)

//輸出結果是

// 3 2 1

// 3 2 0

// args error!

// 3,2,1 2 1

由第四個函式 sayhi([3,2,1],2,1) 的運用可以看出,args 可以是陣列和數字的組合,也可以多個陣列組合,該運算主要是運用於函式的呼叫上,如下例子

function push(array, ...items)

function add(x, y)

const numbers =

[4, 38]

;add(

...numbers) // 42

上面**中,array.push(…items)和add(…numbers)這兩行,都是函式的呼叫,它們都使用了擴充套件運算子。該運算子將乙個陣列,變為引數序列。

擴充套件運算子與正常的函式引數可以結合使用,非常靈活。

function f(v, w, x, y, z)

const args =

[0, 1]

;f(-1, ...args, 2, ...[3]);

//輸出計算結果為 5

注意,只有函式呼叫時,擴充套件運算子才可以放在圓括號中,否則會報錯。

(

...[1, 2]

)console.log((...[1

,2]))

console.log(

...[1, 2]

)// 上面三種情況,擴充套件運算子都放在圓括號裡面,但是前兩種情況會報錯,

//因為擴充套件運算子所在的括號不是函式呼叫。

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...

es6擴充套件運算子

1 複製 拷貝 陣列 陣列元素都是基本資料型別 var arr a b c var copy arr console.log copy a b c arr copy false2 函式呼叫 陣列作引數 function add x,y var numbers 4 38 add numbers 423...