js箭头函数

1、箭头函数

ES6 新增了箭头函数。

箭头函数表达式的语法比普通函数表达式更简洁。

实例：

let sum = (a, b) => a + b;

/* 这个箭头函数是下面这个函数的更短的版本：

let sum = function(a, b) {
  return a + b;
};
*/

alert( sum(1, 2) ); // 3

可以看到 (a, b) => a + b 表示一个函数接受两个名为 a 和 b 的参数。在执行时，它将对表达式 a + b 求值，并返回计算结果。

• 如果我们只有一个参数，还可以省略掉参数外的圆括号，使代码更短。

• 例如：

let double = n => n * 2;
// 差不多等同于：let double = function(n) { return n * 2 }

alert( double(3) ); // 6

• 如果没有参数，括号将是空的（但括号应该保留）：

let sayHi = () => alert("Hello!");

sayHi()

 

• 如果函数部分只是一个语句，则可以省略 return 关键字和大括号 {}，这样做是一个比较好的习惯:
• 例如：

•  let fun = (a, b) => a + b;
   console.log(fun(10, 20));
  // 普通函数
  let fun=function(a,b){
         return a+b;
             
   } 
  console.log(fun(10, 20));

• 如果函数有多个语句需要用{}包括；
• 例如：

 

 let fu = (a, b) => {
                let sum = a + b;
                return sum;
            }
            console.log(fu(3, 4));

箭头函数没有 “this”

箭头函数都没有自己的 this。 不适合定义一个 对象的方法。

        当我们使用箭头函数的时候，箭头函数会默认帮我们绑定外层 this 的值，所以在箭头函数中 this 的值和外层的 this 是一样的。

例如：

let group = {
  title: "Our Group",
  students: ["John", "Pete", "Alice"],

  showList() {
    this.students.forEach(
      student => alert(this.title + ': ' + student)
    );
  }
};

group.showList()

这里 forEach 中使用了箭头函数，所以其中的 this.title 其实和外部方法 showList 的完全一样。那就是：group.title。

箭头函数没有 “arguments”

    箭头函数也没有 arguments 变量。