箭头函数 => - Javascript

在Javascript ES6中，引入了箭头函数（Arrow function）这个新特性。箭头函数是一种更为简洁的函数定义方式，它不仅让代码更简短，也更易读易懂。

箭头函数的语法

箭头函数的语法非常简单，使用后只需要在函数名称前面加上小括号（如果有参数），然后在箭头=>之后加上函数体即可。例如：

// 定义一个普通函数
function sayHello(name) {
  console.log(`Hello, ${name}!`);
}

// 定义一个箭头函数
const sayHi = (name) => {
  console.log(`Hi, ${name}!`);
}

箭头函数的特性

更简短的代码

箭头函数相比传统函数定义，可以让代码更为简短。例如：

// 传统函数
function double(num) {
  return num * 2;
}

// 箭头函数
const double = num => num * 2;

this指向

箭头函数拥有一个很大的特点，就是它的this指向在定义时就已经确定，不会受到函数运行时环境的影响。在箭头函数内部，this指向它所在的上下文对象（即函数定义时的上下文对象）。例如：

var person = {
  name: 'Tom',
  sayHi: function() {
    console.log(`Hi, my name is ${this.name}`);
  },
  sayHiArrow: () => {
    console.log(`Hi, my name is ${this.name}`);
  }
}

person.sayHi(); // 输出 "Hi, my name is Tom"
person.sayHiArrow(); // 输出 "Hi, my name is undefined"

从上面的例子中可以看出，传统函数使用this关键字时，它指向函数运行时的上下文对象，即person对象。而箭头函数的this指向的是定义时的上下文对象，在这个例子中就是全局对象（Window）。

没有arguments对象

箭头函数没有自己的arguments对象，但是它可以访问到定义时所在函数的arguments对象。例如：

function sum() {
  return (a, b) => {
    console.log(arguments); // 输出 [1, 2, 3]
    return a + b;
  }
}

const add = sum(1, 2, 3);
add(4, 5);

不能使用new关键字

箭头函数不能像传统函数一样使用new关键字来生成实例对象，因为它没有自己的this指向。如果使用new关键字，会导致this指向错误，从而产生意外的结果。

总结

箭头函数是Javascript ES6中的一种新特性，它可以让代码更为简短、易读易懂。它拥有许多特性，例如this指向、没有arguments对象、不能使用new关键字等等，这些特性都需要我们熟悉和掌握，方便我们更好地进行开发。