Info
Content

ES6箭头函数

箭头函数是ES6中引入的一种新的函数声明方式，它具有更短的语法和更简单的作用域规则。箭头函数的语法形式为(arguments) => { statement }或(argument) => expression。

下面是一个简单的箭头函数的例子：

const sum = (a, b) => a + b;
console.log(sum(2, 3)); // 输出5

在这个例子中，我们定义了一个箭头函数sum，它接收两个参数a和b，并返回它们的和。箭头函数用=>表示，左侧是函数参数，右侧是函数体。

与传统函数不同，箭头函数没有自己的this关键字，它的this是继承自父级作用域的。这意味着在箭头函数中，this的值与外部作用域的this值相同，不会随着函数的调用方式而改变。例如：

const person = {
  name: 'John',
  greet: function() {
    console.log(`Hello, my name is ${this.name}.`);
  },
  greetArrow: () => {
    console.log(`Hello, my name is ${this.name}.`);
  }
};

person.greet(); // 输出"Hello, my name is John."
person.greetArrow(); // 输出"Hello, my name is undefined."

在这个例子中，我们定义了一个名为person的对象，并在对象中定义了两个方法greet和greetArrow，分别是传统函数和箭头函数。在greet函数中，this关键字指向person对象，输出正常。但在greetArrow函数中，this关键字指向全局对象(window对象)，因为箭头函数中的this是继承自父级作用域的，而person对象不是箭头函数的父级作用域。

除了继承父级作用域的this值，箭头函数还有一些其他的特点：

  1. 箭头函数没有arguments关键字，但可以使用Rest参数来处理不定数量的参数。

  2. 箭头函数不能作为构造函数使用，不能使用new关键字来创建实例。

  3. 箭头函数没有prototype属性。

总之，箭头函数具有更短的语法和更简单的作用域规则，可以简化JavaScript代码，但也需要注意它的特点和限制。

Back to top