[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 ); ~~~