Javascript揭示模塊模式和咖啡腳本

我正在使用一個使用Revealing Module Pattern的小腳本。Javascript揭示模塊模式和咖啡腳本

隨着goold醇'Javascript的一切工作正常，但我想知道如何轉移到Coffeescript。

拿這個作爲一個例子：

// revealing module pattern 
var anchorChange4 = function() { 

    // this will be a private property 
    var config = { 
     colors: [ "#F63", "#CC0", "#CFF" ] 
    } 

    // this will be a public method 
    var init = function() { 
     var self = this; // assign reference to current object to "self" 

     // get all links on the page 
     var anchors = document.getElementsByTagName("a"); 
     var size = anchors.length; 

     for (var i = 0; i < size; i++) { 
      anchors[i].color = config.colors[i]; 

      anchors[i].onclick = function() { 
       self.changeColor(this, this.color); // this is bound to the anchor object 
       return false; 
      }; 
     } 
    } 

    // this will be a public method 
    var changeColor = function (linkObj, newColor) { 
     linkObj.style.backgroundColor = newColor; 
    } 

    return { 
     // declare which properties and methods are supposed to be public 
     init: init, 
     changeColor: changeColor 
    } 
}();

等於這CoffeeScript中：

anchorChange4 = -> 
    config = colors: [ "#F63", "#CC0", "#CFF" ] 
    init = -> 
    self = this 
    anchors = document.getElementsByTagName("a") 
    size = anchors.length 
    i = 0 

    while i < size 
     anchors[i].color = config.colors[i] 
     anchors[i].onclick = -> 
     self.changeColor this, @color 
     false 
     i++ 

    changeColor = (linkObj, newColor) -> 
    linkObj.style.backgroundColor = newColor 

    init: init 
    changeColor: changeColor

init和changeColor暴露在全球範圍內和JavaScript工作正常，但是CoffeeScript的事情會失敗，因爲它沒有方法'init'。

需要做些什麼才能將此揭示模塊模式轉換爲CoffeeScript？

我也對如何讓它變得更好提供建議。 ;-)

感謝，多米尼克

來源

2011-11-27 dmnkhhn

無需使用'while'環和增量'手動i';使用'for i in [0 ... size]' –

如果你想返回一個新的JSON對象暴露的方法，那麼最終的線應該是...

{ 
    init: init 
    changeColor: changeColor 
}

要返回一個JSON對象，而不是隻是changeColor。請記住，咖啡返回函數的最後一條執行語句，您有兩條要返回的行。

來源

2011-11-27 20:10:28 Travis

Travis是正確的;從函數返回對象文字時使用花括號。我相信有一個公開的問題來討論改變這一點。 –

CoffeeScript和JavaScript版本的區別在於CoffeeScript版本中定義的函數永遠不會被調用。在JS版本中，函數的返回值被放置在anchorChange4中，但在CS版本中，變量自身獲取函數。

您可以通過添加一些括號中的CoffeeScript代碼的第一個和最後一個行更改此：

anchorChange4 = (-> 
    ... 
    changeColor: changeColor)()

來源

2011-11-27 20:17:15

解決了一個問題，我可以從外部調用anchorChange4.changeColor。 :-) 仍然存在一個問題：只要我使用Coffeescript，我就無法從init中調用changeColor方法。 Javascript允許我用'var self = this;'和'self.changeColor'來做到這一點。 – dmnkhhn

這個答案也可以寫成'anchorChange4 = do - > ...' –

@dmnkhhn'self = this'東西與JavaScript相同。你怎麼調用'init'？ –

Javascript揭示模塊模式和咖啡腳本

回答

相關問題