ES6之函数的扩展(一)

主要讲解：

1. 参数默认值
2. 参数默认值位置
3. 函数的length属性
4. "参数"作用域

1.参数默认值

function log(x,y='babe'){
    console.log(x,y);
}
  
log(1,'')
//1 ""

log(1,[])
//1 []

log(1,0)
//1 0

log(1,false)
//1 false

log(1,null)
//1 null
-----------------------------
log(1)
//1 "babe"

log(1,undefined)
//1 "babe"

上面的代码完全等价于:

function log(x,y){
    if(y === undefined){
        y = 'babe';
    }
    console.log(x,y);
}

而es5中常用的默认值赋值方式

function log(x,y){
    y = y || 'babe'; 
    // 此时y会进行隐式转换 0/''/[]/false 的情况都会被赋值为'babe',不过如果需求就是如此,那还是用此种方式书写
    console.log(x,y);
}

**可以发现一个问题ES6之后很多值比较都是完全等于undefined的情况,
不像es5,''/[]/0 隐式转换为 false , null == undefined //true
----一些美丽的瑕疵都被遮掉了，以后代码就显得一览无遗了

注意:es6中进行过内部包装转换的代码参数定义是采用let,故同一层级的作用域内不要出现多次声明,会报错

---

用途：解构赋值 关键就是看变量个数 ,{...} 括起来的其实是一个参数，在后面进行解构了而已

function log({user,pwd='123456'}={}){
    console.log(`user: ${user},password: ${pwd}`);
}
log4()
//user: undefined,password: 123456

log4({user:'babe'})
//user: babe,password: 123456

阮老师书中说的练习可以这么理解:

function m1({x = 0, y = 0} = {}) {
  return [x, y];
}

function m2({x, y} = { x: 0, y: 0 }) {
  return [x, y];
}
//m1中不仅对函数参数给了默认值{},而且对待解构的x,y分别赋予了默认值0
//m2中仅仅对函数参数给了默认值{x: 0, y: 0 } ,那这就仅在函数调用时未传参或者传undefined进去的时候，使用了默认值

---

2.参数默认值位置

通常写法是置于函数参数的最后,可以放中间,这样一来意义就不大了，还是要手动传进来(想使用默认值就得传undefined)

function log(user='babe',pwd){
    console.log(`user: ${user},password: ${pwd}`);
}
log(undefined,123)
//user: babe,password: 123
//可以发现这种写法就毫无意义了,方法扩展性为0。当然也不会有人这样写代码了

---

3.函数的length属性

指代函数语气传入的参数个数 -- 不包括指定了默认值的参数(由于正常写法默认参数置于最后,length属性也仅遍历到默认参前一个为止)

function log(user='babe',pwd){
    console.log(`user: ${user},password: ${pwd}`);
}
log.length //0

function log(pwd,user='babe'){
    console.log(`user: ${user},password: ${pwd}`);
}
log.length //1

---

4."参数"作用域

es5中函数参数的作用域与函数体作用域处于同一层级,es6中设置了默认值之后，会另外创建一层作用域，位于函数体上面,参数作用域中不存在的变量会往上一层找寻，直至找到window下

---

如果bug请指正，Thanks♪(･ω･)ﾉ!