1. 程式人生 > 其它 >普通函式與箭頭函式的區別

普通函式與箭頭函式的區別

一、外形不同

箭頭函式是用箭頭定義。

// 普通函式
function func(){
}
// 箭頭函式
const func=()=>{
}

二、命名

普通函式可以是匿名函式和具名函式,而箭頭函式只能是匿名函式。

// 具名函式
function func(){
}
 
// 匿名函式
let func = function(){
}

// 箭頭函式都是匿名函式
let func=()=>{
}

三、建構函式

就因為箭頭函式都是匿名函式,所以不能作為建構函式,不能使用new。

let a = () => { console.log(111)} 
a()
/// 111

let fn = new a()
/// VM82:4 Uncaught TypeError: a is not a constructor at <anonymous>:4:10

四、this

箭頭函式本身不繫結this,會捕獲其所在的定義時上下文的this值,作為自己的this值,而且通過apply()bind()call() 改變不了this 的指向。

普通函式中的this指向呼叫它的物件,具體要根據情況而定。

五、arguments

每一個普通函式呼叫後都具有一個arguments物件,用來儲存實際傳遞的引數。但是箭頭函式並沒有此物件。

箭頭函式不繫結arguments,取而代之用rest引數…解決。

function A(a){
  console.log(arguments);
}
A(1,2,3,4,5,8);  //  [1, 2, 3, 4, 5, 8, callee: ƒ, Symbol(Symbol.iterator): ƒ]


let B = (b)=>{
  console.log(arguments);
}
B(2,92,32,32);   // Uncaught ReferenceError: arguments is not defined


let C = (...c) => {
  console.log(c);
}
C(3,82,32,11323);  // [3, 82, 32, 11323]

五、原型物件

普通函式都有原型物件,而箭頭函式沒有原型物件。

function c() {}
c.prototype
// {constructor: ƒ}

let cc = () => {}
cc.prototype
// undefined

六、Generator函式

箭頭函式不能當做Generator函式,不能使用yield關鍵字,因為標準規範定義了生成器必須是function*