前端 ES6 面试题, ES6 箭头函数和普通函数有什么区别?

Step 1

Q:: ES6 箭头函数和普通函数有什么区别？

A:: ES6 中的箭头函数和普通函数有以下几个主要区别： 1. this 绑定：箭头函数不具有自己的 this，它的 this 值继承自外部上下文。而普通函数的 this 在调用时由调用者决定。 2. 语法简洁：箭头函数的语法更为简洁，可以省略 function 关键字，如果只有一个参数，甚至可以省略括号和花括号。 3. arguments 对象：箭头函数没有 arguments 对象，无法像普通函数一样访问传入的参数列表。可以通过 Rest 参数 (...args) 来获取参数。 4. 作为构造函数：箭头函数不能作为构造函数使用，也不能使用 new 关键字创建实例。 5. yield 关键字：箭头函数不能用作生成器函数（不能使用 yield 关键字）。

Step 2

Q:: 为什么箭头函数的 this 继承外部上下文？

A:: 箭头函数的设计初衷是为了简化 this 的使用。在传统的 JavaScript 函数中，this 的指向可能会由于不同的调用方式而发生变化，这通常会导致混淆。箭头函数通过静态地继承外部作用域的 this，避免了 this 的指向问题，使得代码更加简洁和易于维护。

Step 3

Q:: 什么时候应该使用箭头函数？

A:: 箭头函数非常适合用于那些不需要动态改变 this 指向的场景，如事件处理器、数组方法的回调函数（如 map、filter、reduce 等）以及不需要构造函数或生成器功能的场景。使用箭头函数可以使代码更加简洁明了。