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

ES6 函数扩展

程序员文章站 2022-05-29 13:32:41
1、参数默认值 控制台输出: 2、rest参数 rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。 3、严格模式 ES2016 做了一点修改,规定只要函数参数使用了默认值、解构赋值、或者扩展运算符,那么函数内部就不能显式设定为严格模式,否则会报错。 4、箭头函数 箭头函数的一个用处是 ......

1、参数默认值

function point(x = 0, y = 0) {
  this.x = x;
  this.y = y;
}

const p = new point();

控制台输出:

ES6 函数扩展

 

2、rest参数

rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。

function add(...values) {
  let sum = 0;

  for (var val of values) {
    sum += val;
  }

  return sum;
}

add(2, 5, 3);//输出10

3、严格模式

es2016 做了一点修改,规定只要函数参数使用了默认值、解构赋值、或者扩展运算符,那么函数内部就不能显式设定为严格模式,否则会报错。

4、箭头函数

箭头函数的一个用处是简化回调函数。

// 正常函数写法
[1,2,3].map(function (x) {
  return x * x;
});

// 箭头函数写法
[1,2,3].map(x => x * x);

如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回。

'use strict';
console.log(sum(1,2))
let sum = (a,b)=>{return a+b};

 箭头函数使用时需要注意:

函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象

function foo() {
  settimeout(() => {
    console.log('id:', this.id);
  }, 100);
}

var id = 21;

foo.call({ id: 42 });
// id: 42

普通函数为:

function foo() {
                settimeout(function() {
                    console.log('id:', this.id);
                }, 100);
            }

            var id = 21;

            foo.call({
                id: 42
            });
            //输出id:21

箭头函数根本没有自己的this,导致内部的this就是外层代码块的this

如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。

var f = () => 5;
// 等同于
var f = function () { return 5 };

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
  return num1 + num2;
};