箭头函数和普通函数在以下几个方面存在区别:
语法
- 普通函数 :使用
function
关键字定义,有函数名、参数列表和函数体,形式为function functionName(parameters) { functionBody }
。 - 箭头函数 :使用箭头
=>
定义,参数放在箭头左边,函数体放在箭头右边。如果只有一个参数,可以省略参数的括号;如果函数体只有一条语句,可以省略花括号,并且会自动返回该语句的结果。例如param => expression
或(param1, param2) => { functionBody }
。
函数上下文(this
指向)
- 普通函数 :
this
的指向在函数被调用时确定,取决于函数的调用方式。在全局环境中调用,this
指向全局对象(浏览器中是window
);作为对象的方法调用时,this
指向该对象;使用call
、apply
或bind
方法调用时,可以显式指定this
的指向。 - 箭头函数 :没有自己独立的
this
,它的this
继承自外层作用域,在定义时就被确定,不会被调用方式改变。
构造函数
- 普通函数 :可以作为构造函数使用,通过
new
关键字创建对象实例,函数内部的this
会指向新创建的对象,并且可以使用prototype
属性来添加原型方法和属性。 - 箭头函数 :不能作为构造函数使用,不能使用
new
关键字调用,否则会抛出错误。因为箭头函数没有自己的this
,也没有prototype
属性。
arguments 对象
- 普通函数 :在函数内部可以使用
arguments
对象来获取传递给函数的所有参数,即使没有在函数定义中显式声明参数,也可以通过arguments
来访问。 - 箭头函数 :没有
arguments
对象,如果需要获取参数,可以使用剩余参数...
来代替。
执行上下文
-
普通函数:会创建自己的执行上下文,包括变量环境、词法环境等,在函数执行时进行一系列的初始化操作。
-
箭头函数:不会创建自己的执行上下文,而是直接继承外层函数的执行上下文。
一般来说,当需要使用独立的this
指向、作为构造函数或者需要访问arguments
对象时,应使用普通函数;而在一些回调函数、箭头函数更简洁的场景下,或者需要确保this
指向稳定的情况下,箭头函数更为合适。