ES6学习6章：函数的扩展（箭头函数）

一、函数参数默认值

function log(x,y='world'){
    console.log(x,y)
}
log('hello','') //hello
# 解构赋值调用
function fecth(url,{methods='GET',body='',headers={}}){
    console.log(methods)
}
fecth('http://example.com',{}) //'GET'

• 参数变量是默认声明的，不能用let或 const再次声明
• 参数在指定默认值后，不会再计算到length属性中

作用域

• 如果参数默认值是一个变量，则变量所处的作用域先是当前函数的作用域，再是全局作用域

var x=1;
function f(x,y=x){
    console.log(y)
}
f(2) //2
# 情况2
let x=1;
function f(y=x){
    let x=2;
    console.log(y)
}
f() //1  函数调用时，内部变量x还没有生成

REST参数

• …变量名 ：表示rest参数,用于将函数参数存于一个数组中，变量代表一个数组
• rest参数之后不能再有其他参数
• 函数的length局长不包括rest参数

function push(array, ...items) { 
    items.forEach(item => {
        array.push(item)
    })
    console.table(array)
}
var a = []
push(a,1,2,3,4) //[1,2,3,4]

# 扩展运算符
function push(array,...items){
    array.push(...items)
}
var a = []
push(a,1,2,3,4) //[1,2,3,4]

扩展运算符

• … 扩展运算符是Rest参数的逆运算

箭头函数

# 基本用法
var f= v=> v;   
等同于
var f = function(v){
    return v;
}
# 多参数
var f= (a,b)=> a+b;
等同于
var f= function(a,b){
    return a+b;
}
# 返回对象
var f= id =>({id:id,name:'temp'})
# 与变量解构同时使用
var full=({first,last})=>first+''+last
等同于
var full=function(person){
    return person.first+''+person.last
}

# 与rest参数结合使用
const numbers= (...nums)=>nums;
numbers(1,2,3,4) //[1,2,3,4]

# 箭头函数内的this，为定义时所在的对象，而不是调用时的对象
const fn = v => {
    this.a='hello'
    console.log(this) //{a：‘hello’}
}
fn()
var fn1 = function () {
    this.b = 'world'
    console.log(this===global) //true
}
fn1()

• 当没有参数或有多个参数时，用()代替参数部分
• 如果要直接返回一个对象，则需要在返回值外加一个()
• 箭头函数可以与变量解构结合使用
  

  箭头函数作用：

• 用于简化函数表达式，缩减代码量

注意点：

1. 函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。
2. 箭头函数不能用为作为构造函数，即不能用new使用，会抛出错误
3. 箭头函数不可使用arguments对象，该对象在函数体内不存在，可以用Rest参数代替
4. 不能使用yield命令，因此箭头函数不能用作Generator函数

函数的绑定

• foo::callback 用双冒号“::” 将左边的对象绑定到右边的函数，使左边的对象，作为上下文环境绑定到右边的函数上。
• 此语法还只是ES7的一个提案，很大程度上还不是很兼容。