首頁 > web前端 > js教程 > ES6中預設參數的介紹(程式碼範例)

ES6中預設參數的介紹(程式碼範例)

不言
發布: 2018-11-14 15:34:26
轉載
1747 人瀏覽過

這篇文章帶給大家的內容是關於ES6中預設參數的介紹(程式碼範例),有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

語法

function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) { 
    statements 
}
登入後複製

使用

function sum(a=0, b=0){
    return a+b
}
sum() // 0
sum(1) // 1
sum(1, 2) // 3
登入後複製

使用babel翻譯一下

function sum() {
    var a = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
    var b = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
    return a + b;
}
登入後複製

傳值偵測

從babel翻譯的結果可以看出,預設參數只檢查兩種情況

  • 不傳參數

  • 傳入undefined

function sum(a=0){
    return typeof a
}
sum() // 'number'
sum(undefined)// 'number'
sum(1) // 'number'
sum('1') // 'string'
sum(null) // 'object'
sum(false)// 'boolean'
登入後複製

前參後用

前面的參數可以作為後面參數的預設值,甚至可以對前面的參數做一些特別的操作,例如簡單的加減乘除

function sum(a=1, b=a, c=a+b){
    return [a, b, c]
}
sum() // [1, 2, 3]
sum(2)  // [2, 2, 4]
sum(2,2) // [2, 2, 4]
sum(2,2,2) // [2, 2, 2]
登入後複製

預設參數呼叫函數

賦值預設參數甚至可以呼叫函數,可以呼叫函數,就已經說明無所不能了~

function sum(a=1, b=(()=>4)()){
    return [a, b]
}
sum() // [1, 4]
sum(2) // [2, 4]
sum(2,2) // [2, 2]
登入後複製

注意: 無法調用函數內部宣告的函數作為預設值

function sum(a=1, b=num2()){
    function num2(){
        return 4
    }
    return [a, b]
}
sum() // Uncaught ReferenceError: num2 is not defined
登入後複製

按序覆蓋

參數還是按呼叫的時候傳輸的順序一一覆寫的,不會因為它有預設值就跳過該形參的賦值

function sum(a=1, b ){
    return [a, b]        
}
sum() // [1, undefined]
sum(2)// [2, undefined]
sum(1,2) //[1, 2]
登入後複製

解構賦值預設參數

結構中也可以使用預設參數,雖然結構還沒在這系列出現過

function sum([x, y] = [1, 2], {z: z} = {z: 3}) { 
  return [x, y, z]; 
}
sum() // [1, 2, 3]
sum([2,4],{z: 6}) // [2, 4, 6]
登入後複製

以上是ES6中預設參數的介紹(程式碼範例)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:segmentfault.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板