[TOc] >[success] # es5 常見的幾種函數值傳遞 >[info] ## 使用 '||' 和 '&&' 符號 ~~~ 1.首先 '||' 是一個短路操作符，也就是說只要有1個符合條件后面就不執行， 也就是說符合條件是'true'即可,舉例說明: 1 || 0 或者 0 || 1 兩個返回的都是1， 但如果多個都是'false' 則返回最后一個值，例如 ""||0 返回的是0。 有點類似 if(true){}else{} 2.'&&' 也是一個短路操作符，也就是說只要有1個符合條件后面就不執行， 符合條件的條件是'false',舉例說明: 1 && 0 或者 0 && 1 兩個返回的都是0， 但如果多個都是'true' 則返回最后一個值，例如 2&&1 返回的是1。 有點類似 if(執行前置條件()){ '執行后置條件' } ~~~ >[danger] ##### 利用'||'特性傳值 ~~~ getParam(0) // default 注意:0轉成布爾類型為false 有漏洞 ~~~ ~~~ function getParam(param){ let a = param || 'default'; return a; } // 返回默認值 setParam1 = getParam(); // 返回指定值 setParam2 = getParam('指定內容'); console.log(setParam1) console.log(setParam2) ~~~ * 打印結果 ~~~ default 指定內容 ~~~ >[danger] ##### 解決'||' 這種形式漏洞 ~~~ //解決漏洞 function show(a,b){ var a=typeof a === 'undefined'?20:a; var b=typeof b === 'undefined'?30:b; console.log(a,b) } show(0,0) //0 0 ~~~ >[danger] ##### 利用'&&' 特性定義回調函數參數 ~~~ function getCallBack(param,callback){ try{ console.log('param',param) // 傳參只能是當期函數中的例如param console.log(callback && callback()) }catch(err){ console.log('回調函數') } } // 這個會打印 param 1 然后執行到callback就會抓住異常執行打印出'回調函數胡' // getCallBack(11,11); // 下面這種是正常操作，使用'&&' 的原因，如果過沒有并且那每次都會執行這個callbak() // 因此沒有傳值回調函數則會出現錯誤，所以使用并且特性有的時候才執行回調 getCallBack(11,() => { return '我是測試的回調函數' }); ~~~ * 打印結果 ~~~ param 11 我是測試的回調函數 ~~~ >[danger] ##### 利用循環華而不實寫法 ~~~ function getCallBack(params){ let defaultConfig = { age:17, name:'wang', sex:'男' } for(let i in params){ defaultConfig[i] = params[i] || defaultConfig[i] } return defaultConfig } console.log(getCallBack()) console.log(getCallBack({name:'ss'})) ~~~ * 打印結果 ~~~ {age: 17, name: "wang", sex: "男"} {age: 17, name: "ss", sex: "男"} ~~~ >[danger] ##### 利用對象和'||' 和'&&' 進行配合操作(重點) ~~~ CT.loginAjax = function (params,callback) { /*params====> {} */ $.ajax({ type: params.type || 'get', url: params.url || '#', data: params.data || '', dataType: params.dataType || 'json', success:function (data) { /*未登錄的處理 {error: 400, message: "未登錄！"} 所有的需要登錄的接口 沒有登錄返回這個數據*/ if(data.error == 400){ /*跳到登錄頁 把當前地址傳遞給登錄頁面 當登錄成功按照這個地址跳回來*/ callback && callback() return false; }else{ params.success && params.success(data); } }, error:function () { mui.toast('服務器繁忙'); } }); }; ~~~ >[danger] ##### arguments 不確定實參 ~~~ function add(){ return arguments } console.log(add(10,20,30,{'name':'wang'})) ~~~ * 打印結果 ~~~ ?[10, 20, 30, {'name':'wang'}] ~~~ >[success] # es6常見的幾種函數傳值 ~~~ 1.參數中使用下面的方法注意的順序，(a, b=20, ...val) 2.沒有類似python中對對象的解包 ~~~ >[danger] ##### 設置默認參數 ~~~ 1.es6 設置默認參數案例 ~~~ ~~~ function getParams(b, a = 10) { console.log(a, b) } getParams(5); getParams(6,7); ~~~ * 打印結果 ~~~ 10 5 7 6 ~~~ >[danger] ##### 設置默認(參數為函數) ~~~ function getVal(n){ return n+10; } function add(a,b = getVal(a)){ return a+b } console.log(add(10));//30 ~~~ >[danger] ##### ... 三個點的解包 ~~~ 1.等同于python 中*args，在函數中當參數使用的時候，接受多個數值可以變成數組 ，當普通使用的時候可以給數組解包 ~~~ ~~~ function add(a, b=20, ...val){ console.log(a, b, val) } add(10,21,30,{'name':'wang'},1) console.log(...[1,2,3]) ~~~ * 打印結果 ~~~ 10 21 (3)?[30, {'name':'wang'}, 1] 1 2 3 ~~~ >[danger] ##### 解構賦值對象拆包 ~~~ 1.場景具體限制，或者只使用傳入的對象參數特定的key ~~~ * 定義一個方法對立面對象結構賦值 ~~~ function info1({name, age, height}){ console.log(name, age, height) } ~~~ * 使用 ~~~ info1({name:'1', age:"1",height:'2', other:'999'}); ~~~ * 打印結果 ~~~ 1 1 2 ~~~ >[danger] ##### 解構賦值設置默認值 ~~~ 1.給拆包后的key設置默認值，也是給對象設置默認值得一種方式 2.但這種方式，如果使用時不傳值，整體會報錯例如： info2({}) -- 這樣可以不報錯 info2() -- 什么都不傳這樣報錯 ~~~ * 定義一個有默認值得結構賦值 ~~~ function info2({ name = 'anonymous', age = 0, height = 160 }){ console.log(name, age, height) } ~~~ * 使用 ~~~ info2({name:'2'}) ~~~ * 打印結果 ~~~ 2 0 160 ~~~ >[danger] ##### 解構賦值設置默認值(解決什么都不傳遞報錯問題) ~~~ 1.給拆包后的key設置默認值，也是給對象設置默認值得一種方式 2.解決上面案例中什么值都不傳遞報錯問題 ~~~ * 定義一個有默認值得結構賦值 ~~~ function info3 ({ name = 'anonymous', age = 0, height = 160 } = {}) { console.log(name, age, height) } ~~~ * 使用起來和上面案例基本一致但解決了可以沒有參數問題 ~~~ info3() ~~~ * 打印結果 ~~~ anonymous 0 160 ~~~ >[danger] ##### 利用默認值做強制傳參 ~~~ // 幫助函數 const err = ( message ) => { throw new Error( message ); } // 函數 const sum = function ( num = err('first param is not defined'), otherNum = err('second param is not defined') ) { return num + otherNum; } ~~~ * 使用 ~~~ // 測試函數 // 輸出: 3 console.log(sum(1, 2)); // 測試第一個參數不傳遞 // Uncaught Error: first param is not defined sum( undefined, 10 ); // 測試第二個參數不傳遞 // Uncaught Error: second param is not defined sum( 10 ); ~~~