對象方法函數：匿名或命名？

Question

我已經看到這兩種類型的代碼，我想知道是否有偏好;使用匿名或命名功能：

function myFunc() { 
    this.myMethod =() => { 
     //.. 
    } 
} 

function myFunc() { 
    this.myMethod = function() { 
     //.. 
    } 
} 

從MDN摘自：相對於功能 表達

箭頭函數表達式具有更短的語法和不綁定自己的這一點，參數，超，或 new.target。箭頭功能始終是匿名的。這些函數 表達式最適合用於非方法函數，並且不能將 用作構造函數。

它對我們匿名是有意義的，因爲您可能想要訪問myFunc屬性而無需執行_this = this。另一方面，它表示匿名函數最適合非方法函數（即回調函數）。

Answer 1

這些並不矛盾。

這是有道理的使用匿名箭頭的功能，你可能希望在不必做_this = this訪問myFunc實例屬性。

是的。雖然如果它是一種方法，你可以簡單地在函數表達式中使用this，它可以工作。

在另一方面它指出匿名功能函數表達式最適合於非方法的功能（即回調）。

「非法」指的是不是函數（總是）使用，它設置this關鍵字object.method(…)圖案調用。無論函數是否爲作爲對象屬性存儲。

順便說一句，這些點都與命名與匿名錶達式無關。

Answer 2

技術上 - 沒關係。

var myFunction = function() { } //anonymous 

和

var myFunction = function myFunction() { } //named 

將在所有方面，但一個相同的 - 使用調試工具，看着堆棧跟蹤會顯示不同的標識符。第一個版本將顯示爲(anonymous function)，而後者則顯示出了它的名字 - myFunction。所以，命名函數純粹是爲了開發人員的方便和開發。

值得關注的是函數的名稱並不需要是相同的對它的引用，例如，你可以有

var myFunction = function someOtherName() { /* ... */ } 

，然後這將顯示在開發工具someOtherName。但是，您將而不是能夠通過做someOtherName()來調用它 - 名稱和對該函數的引用是不同的事情。爲了簡單起見，它們通常被設置爲相同的標識符。現在

，到你的例子 - 有是給你貼什麼

function myFunc() { 
    this.myMethod =() => { 
     //.. 
    } 
} 

這並不等同於一個名爲功能的差異。這是使用ES6箭頭功能 - 正常情況下，它們將被命名爲相同的變量，他們被分配到：

var arrowFunction =() => {}; 
 

 
var obj = { 
 
    arrowMethod:() => {} 
 
} 
 

 
console.log("function name is: " + arrowFunction.name); 
 
console.log("object property function name is: "+ obj.arrowMethod.name);

（注意，這個工作在Chrome，但不能在Firefox的一些原因 - .name屬性應該設置）

除了命名差異之外，箭頭函數與「簡單」函數還有其他差異。最值得注意的是，他們的語境是詞彙綁定的。以下是這在實踐中意味着

function arrowExample() { 
 
    this.data = "Hello arrow"; 
 
    this.myMethod =() => { 
 
     return this.data; 
 
    } 
 
} 
 

 
function normalFunctionExample() { 
 
    this.data = "Hello normal function"; 
 
    this.myMethod = function myMethod() { 
 
     return this.data; 
 
    } 
 
} 
 

 
var arrowInstance = new arrowExample(); 
 
var normalFunctionExampleInstance = new normalFunctionExample(); 
 

 
console.log("Invoking arrow with context: " + arrowInstance.myMethod()); 
 
console.log("Invoking normal function with context: " + normalFunctionExampleInstance.myMethod()); 
 

 
var arrowReference = arrowInstance.myMethod; 
 
var normalFunctionReference = normalFunctionExampleInstance.myMethod; 
 

 
console.log("Invoking arrow without context: " + arrowReference()); 
 
console.log("Invoking normal function without context: " + normalFunctionReference());