js的箭头函数手记

什么是箭头函数

说起箭头函数，那得感谢 es6 ，因为在很大程度上，箭头函数是很方便的，不光是它的写法，还有它的一些特性。

// 这就是一个箭头函数
let fn = (a, b) => {
	return a + b;
}

(参数) => { 函数体 }

是不是很简单？它还可以更简单

特性

1. 箭头函数如果只有一个参数，小括号可以省略

let fn = x => {
	return x
};

参数 => { 函数体 } 等同于 (参数) => { 函数体 };

// 没有参数  就需要带上小括号 

let fn = () => {
  return "constRen";
};

()=>{};

2. 箭头函数只有一个语句且是 return 语句，可以省略 return 和外层大括号

let fn = (a, b) => {
	return a + b;
};
等同于
let fn = (a, b) =>  a + b; // let fn = (a, b) => return   a + b;  这样写不行哈  没有{} 也就不需要return了

可能这儿就小伙伴疑惑了，那如果我要返回一个 {} ,怎么写呢？问得好

注意：如果箭头函数只返回一个对象，那么对象外层要加小括号

当箭头函数只包含一个表达式，那就真的是简单到了极致

x => x + x   ======>  (x) => { return x + x}

3. 箭头函数没有 arguments 对象

注意：虽然没有 arguments 对象，但是可以使用 剩余参数

4. 箭头函数的this指向 注意：箭头函数的 this 始终跟外层 function 的 this 一致，外层 function 的 this 指向谁，箭头函数的 this 就指向谁，如果外层没有function 则指向 window

   简单来说：就是指向定义时所在的对象，而不是调用时的对象，而且一旦指定，就不会再发生变化（当真是忠义无双啊）

 let name = 'constRen';
 const obj1 = {
    age: 28,
    fn1: function () {
        const obj2 = {
            age: 29,
            fn2: () => {
                console.log(this.age);
            }
        }
        obj2.fn2();
    }
 }
 obj1.fn1(); // 28

5. 箭头函数没有 prototype，所以箭头函数不能当作构造函数，也就是不能使用 new

6. 箭头函数存在 变量提升，不存在函数声明提升

   name 函数是存在函数提升的，但是箭头函数是没有的，它只有变量提升