箭头函数和普通函数的一些重要区别
摘抄自Understanding ECMAScript 6
:
- No
this
,super
,arguments
, andnew.target
bindings - The value ofthis
,super
,arguments
, andnew.target
inside of the function is by the closest containing nonarrow function. (super
is covered in Chapter 4.) - Cannot be called with
new
- Arrow functions do not have a[[Construct]]
method and therefore cannot be used as constructors. Arrow functions throw an error when used withnew
. - No prototype - since you can't use
new
on an arrow function, there's no need for a prototype. Theprototype
property of an arrow function doesn't exist. - Can't change
this
- The value ofthis
inside of the function can't be changed. It remains the same throughout the entire lifecycle of the function. - No
arguments
object - Since arrow functions have noarguments
binding, you must rely on named and rest parameters to access function arguments. - No duplicate named parameters - arrow functions cannot have duplicate named parameters in strict or nonstrict mode, as opposed to nonarrow functions that cannot have duplicate named parameters only in strict mode.
There are a few reasons for these differences. First and foremost, this
binding is a common source of error in JavaScript. It's very easy to lose track of the this
value inside a function, which can result in unintended program behavior, and arrow functions eliminate this confusion. Second, by limiting arrow functions to simply executing code with a single this
value, JavaScript engines can more easily optimize these operations, unlike regular functions, which might be used as a constructor or otherwise modified.
The rest of the differences are also focused on reducing errors and ambiguities inside of arrow functions. By doing so, JavaScript engines are better able to optimize arrow function execution.
Note: Arrow functions also have a
name
property that follows the same rule as other functions.