es6基礎0x003：默認參數

james 發布于2019-08-23 12:57 / 2964人閱讀

摘要：語法使用使用翻譯一下傳值檢測從翻譯的結果可以看出，默認參數只檢查兩種情況不傳參數傳入前參后用前面的參數可以作為后面參數的默認值，甚至可以對前面的參數做一些特別的操作，比如簡單的加減乘除默認參數調用函數賦值默認參數甚至可以調用函數，可以調用函

0x000 語法

function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) { 
    statements 
}

0x001 使用

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;
}

0x002 傳值檢測

從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"

0x003 前參后用

前面的參數可以作為后面參數的默認值，甚至可以對前面的參數做一些特別的操作，比如簡單的加減乘除

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]

0x004 默認參數調用函數

賦值默認參數甚至可以調用函數，可以調用函數，就已經說明無所不能了~

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

0x005 按序覆蓋

參數還是按調用的時候傳輸的順序一一覆蓋的，不會因為它有默認值就跳過該形參的賦值

function sum(a=1, b ){
    return [a, b]        
}
sum() // [1, undefined]
sum(2)// [2, undefined]
sum(1,2) //[1, 2]

0x006 解構賦值默認參數

結構中也可以使用默認參數，雖然結構還沒在這系列出現過

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]

GPU云服務器云服務器函數默認參數方法實例參數默認 js默認參數 js函數默認參數

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/99115.html

es6基礎0x008：解構賦值

摘要：概述實不相瞞，解構賦值非常叼，特別是和其他一起使用的時候，那如何簡單的說解構賦值呢，打個比方解構賦值就是一個硬幣拆分機，將所有的一毛五毛一塊硬幣投入硬幣拆分機，他就自動將所有的硬幣分好了，拿出你要的就行了解構數組可以從一個數組從取出你想要的 0x000 概述實不相瞞，解構賦值非常叼，特別是和其他es6一起使用的時候，那如何簡單的說解構賦值呢，打個比方：解構賦值就是一個硬幣拆分機，將所...

xiaoxiaozi 2019-08-23 13:07 評論0 收藏0
es6基礎0x019：模塊化

0x000 概述模塊化是一個大型項目的必然趨勢。 0x001 命名導出可以使用export關鍵字，導出你要導出的東西，可以導出常量、變量、函數、類, // export.js export var var0 = var0 // 直接導出 var 聲明 export let let0 = let0 // 直接導出 let 聲明 export const const0 = const // 直...

khlbat 2019-08-26 12:24 評論0 收藏0
es6基礎0x004：剩余參數

摘要：概述剩余參數將沒有對應形參的參數聚合成一個數組語法只聚合未對應形參參數剩余參數只會將沒有對應形參的參數聚合成一個數組而則是包含了所有的參數。剩余參數是數組剩余參數始終是一個數組，而不像是一個偽數組轉化成數組解構剩余參數使用翻譯翻譯后 0x000 概述剩余參數將沒有對應形參的參數聚合成一個數組 0x001 語法 function(a, b, ...theArgs) { } 0x002 ...

waltr 2019-08-23 13:00 評論0 收藏0
es6基礎0x007：展開

摘要：概述展開符號真的是一個非常好用的東西，我常用于字符串分割數組合并數組拷貝對象合并對象拷貝。 0x000 概述展開符號真的是一個非常好用的東西，我常用于字符串分割、數組合并、數組拷貝、對象合并、對象拷貝。 0x001 語法 ...iterableObj 0x002 函數調用的時候參數展開這是在函數調用的時候，將參數展開，和剩余參數有區別，剩余參數是在函數聲明中使用 myFunctio...

RyanQ 2019-08-23 13:02 評論0 收藏0
es6基礎0x001：箭頭函數

摘要：這就是所謂的箭頭函數不綁定，而在我看來，回調函數就是箭頭函數最好的歸宿。 0x000 概述箭頭函數有兩個作用：更簡短的寫法不綁定this 0x001 語法一表覽 ()=>{} ()=>{console.log(arrow);return null} ()=>hello (num1, num2)=>num1+num2 num=>++num ()=>({name:arrow})...

stonezhu 2019-08-23 12:51 評論0 收藏0