关于javascript:什么是箭头函数-函数相关总结

箭头函数

箭头函数能让代码更简洁；箭头函数能让函数的性能更加纯正；

let fn3 = x => x * 2;

什么是箭头函数

ES6 中容许应用箭头函数的形式来定义一个函数。后面学习的定义一个函数有两种形式:

1. 函数申明式
2. 函数表达式

当初有了一个新的形式：

​ 3. 箭头函数

格局

let 函数名 =（形参 1，... 形参 n）=>{// 函数体}

定义一个箭头函数

// 1. 函数申明式
function fu1(x) {return x * 2;}
// 2. 函数表达式
let fn2 = function (x) {return x * 2;}
// 3. 箭头函数
let fn3 = (x) => {return x * 2;}

第一眼看到这个箭头函数时，会感觉很奇怪。如果从函数表达式的格局登程，通过如下 2 步演变步骤就能够失去。

把 function 关键字 后挪动到（）和 {} 两头
把 function 改写成 =>
留神：

- `=>` 是一个整体，不要加空格
- 箭头函数只在定义上有些区别，但在函数调用格局上，是没有区别的。

简化写法

当形参有且只有一个，能够省略小括号

let f = (x) => {console.log(x)}
// 能够简化成：let f = x => {console.log(x)}

当函数体只有一条语句，能够省略大括号;

let f = x => {console.log(x)}
// 能够简化成：let f = x => console.log(x)

当函数体只有一条语句，并且就是 return 语句，则能够省略 return 和大括号。

let f = x => {return x*2}
// 能够简化成：let f = x => x*2

留神如果返回值是一个对象，要加()

let f = x => {return {a:1}  }
// 能够简化成：let f = x => {a:1} // 报错
let f = x =>({a:1})

箭头函数与一般函数的区别

1. 外部没有 arguments

2. 不能作为结构器

3. 外部没有 this

没有 arguments

let fn = (a,b) => {console.log(arguments); // 报错，arguments is not defined
};
fn(1, 2);

外部的 this 对象，指向定义时所在的对象，而不是应用时所在的对象。

1. 箭头函数能够拜访 this 对象，但这个 this 对象指向在定义箭头函数时它时所处的对象(宿主对象), 而不是运行时的对象。

var name = 'lisi'; // 测试时，这里必须用 var，因为用 let 申明的变量不能应用 window 调用
let obj = {
    name: 'zhangsan',
    f1 : () => {console.log(this); // window 对象
        console.log(this.name); // lisi
    },
    f2 : function(){console.log(this); // obj
        console.log(this.name); // zhangsan
    },
    f2 : function(){console.log(this); // obj
        console.log(this.name); // zhangsan
    }
};
obj.f1();

箭头函数中的 this 指向是 固定化 的，并不是因为箭头函数外部有绑定 this 的机制，理论起因是箭头函数基本没有本人的 this，导致外部的 this 就是外层代码块的 this。

var obj = {};
var f1 = functoin(){console.log(this)}
var f2 = ()=>{console.log(this)}

f1();
f1.call(obj)// call 能够批改一般函数外部的 this 的值
f2();
f2.call(obj);// call 并不能批改箭头函数外部的 this 的值

箭头函数不能作为构造函数

let Person = () => {};
let obj = new Person(); // 报错，Person is not a constructor
// 换个角度了解，箭头函数中都没有本人的 this，怎么解决成员，所以不能当构造函数

在 javascript 中，函数是一等公民 , 它除了起到最根本的提炼代码之外，还能够当做结构器来应用，它能做的事件太多了。在 ES6 提出的箭头函数给函数减负了。

最佳实际

（1）优先级：
箭头函数 > 表达式 > 申明式

（2）如果在函数的外部波及 this 的应用，则要特地小心 this，切实不释怀就打印进去看看。（如果函数的外部没有 this，则能够放心使用箭头函数）

（3）留神革新函数申明式成箭头函数时，不会再有函数晋升。