欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ES6知识点整理——函数扩展

程序员文章站 2022-07-16 20:14:54
...

函数新增特性:参数默认值、rest参数、扩展运算符、箭头函数、this绑定、尾调用

1.参数默认值
默认值后面不能有没有默认值的变量

{
  function test(x, y = 'world'){
    console.log('默认值',x,y);//hello world  hello kill
  }
  test('hello');
  test('hello','kill');
}

作用域问题
当函数的参数中有设置默认值的参数时,包含参数的圆括号就会形成一个作用域

{
  let x='test';
  function test2(x,y=x){
    console.log('作用域',x,y);//kill kill
  }
  test2('kill');
}
{
  let x='test';
  function test2(c,y=x){
    console.log('作用域',x,y);//kill test
  }
  test2('kill');
}

2、rest参数
...把输入的参数转成数组

{
  function test3(...arg){
    for(let v of arg){
      console.log('rest',v);//rest 1 rest 2 rest 3 rest 4 rest a
    }
  }
  test3(1,2,3,4,'a');
}

3、扩展运算符
将一个数组转为离散的值

{
  console.log(...[1,2,4]);//1 2 4
  console.log('a',...[1,2,4]);a 1 2 4
}

4、箭头函数
es5: function a(){} this的指向是该函数被调用的对象
es6: (参数) => {} 参数只有一个可以省略(),花括号中的表达式作为返回值的时候可以省略{} this的指向是定义时this的指向
1.写法上省去了function 2.this的指向有了新的意义

·由于箭头函数不绑定this, 它会捕获其所在(即定义的位置)上下文的this值, 作为自己的this值
·箭头函数没有arguments,apply,call, bind,因为箭头函数根本没有this,所以改变this指向的函数对他无效,
·箭头函数不能作为构造函数,不能使用new;
·不可以使用yield命令,因此箭头函数不能用作 Generator 函数。

{
  let arrow = v => v*2;
  let arrow2 = () => 5;
  console.log('arrow',arrow(3));//6
  console.log(arrow2());//5

}

5、尾调用
一个函数依赖于另一个函数的操作,建议使用尾调用

{
  function tail(x){
    console.log('tail',x);
  }
  function fx(x){
    return tail(x)
  }
  fx(123)//tail 123
}