來點CoffeeScript嗎？

KavenFan 發布于2019-08-21 10:22 / 999人閱讀

摘要：一般來說，可以縮短大約的代碼長度。這就避免了意外創建全局變量。使用表示，不推薦的和將不能使用。因此，使用將是有效的解決方法之一。

簡單易懂的介紹

CoffeeScript是什么？

首先，它是一門小巧的編程語言。有一本關于CoffeeScript的指南，寫作“The Little Book on CoffeeScript”：

很小，是嗎？

然后，它是一門JavaScript的轉譯語言。這個轉譯過程看起來像這樣：

.coffee的文件將會被編譯為.js的文件，然后，就像使用JavaScript那樣使用它！

在[coffeescript.org][]上有這樣一句話：

The golden rule of CoffeeScript is: "It"s just JavaScript".

也就是說，良好的面對CoffeeScript的心態是，“它只是JavaScript”！

更少代碼

CoffeeScript可以讓你少寫一點代碼。請看下圖：

可見，CoffeeScript精簡了JavaScript的{}、()、;等符號的使用，并為function、this等關鍵字定義了簡單的符號表示法。這些風格轉換都使得CoffeeScript代碼量更少。

一般來說，CoffeeScript可以縮短大約1 / 3的代碼長度。

語言特性增強

CoffeeScript較JavaScript在語言特性上進行了改善。在CoffeeScript中，所有的變量聲明都不再使用var關鍵字：

number = 1.0

CoffeeScript在編譯時會自動分析上面這樣的語句，如果被賦值的變量未被定義，會在作用域頂部用var定義變量（由.coffee編譯得到的.js）。這就避免了意外創建全局變量。如果要在CoffeeScript中聲明全局變量，必須用顯式的代碼定義：

window.paintSize = 10

CoffeeScript為字符串拼接提供了更方便的寫法，例如：

drawTitle = "Start from #{number}."

其中number會取作用域中的對應變量。

CoffeeScript使用is表示===，不推薦的==和!=將不能使用。例如：

"draw" if 1 is true

其他的語義化的轉化：

CoffeeScript默認將最后一條語句作為返回值（受啟發于Ruby），例如：

description = ->
    console.log "Thinking."
    @

將等同于：

description = function() {
    console.log("Thinking.");
    return this;
};

可能有用的一些說明 隱式括號

在CoffeeScript中，允許用空格的形式來表示括號，這稱為隱式括號。但是，隱式括號使用不當會帶來一些問題，例如：

console.log Math.floor 1.7, Math.ceil 1.7

編譯為.js將是：

console.log(Math.floor(1.7, Math.ceil(1.7)));

這可能不是你想要的結果。關于隱式括號需要理解的一點是：直到表達式末尾，隱式括號才會閉合。所以，建議的寫法是，單條語句只在第一處位置使用隱式括號，其他位置都顯式地把括號寫出來。例如：

console.log Math.floor(1.7), Math.ceil(1.7)

將正確編譯為：

console.log(Math.floor(1.7), Math.ceil(1.7));

此外，不帶參數的函數調用，將不能省略括號。例如你想要init();語句，那么在CoffeeScript中你也需要寫作init()。

語句都是表達式

在CoffeeScript中，所有的語句都視為表達式。請看這樣的語句：

name = if 1 is true 
    "green tea" 
else 
    "black tea"

這在CoffeeScript中是合法的，將被編譯為：

name = 1 === true ? "green tea" : "black tea";

因此可以正常運行。類似的，其他種類的語句也可以這樣使用，CoffeeScript都會很好地處理它們。

從CoffeeScript中學習JavaScript

CoffeeScript所做的很多語言特性增強，都來源于JavaScript的最佳實踐。看一看編譯后的JavaScript，就可以了解到CoffeeScript是如何實現的，這可能對學習JavaScript也有所幫助。例如，CoffeeScript可使用?在賦值之前檢查變量是否存在：

draw?.tool = "pencil"

編譯后的代碼：

if (typeof draw !== "undefined" && draw !== null) {
    draw.tool = "pencil";
}

這里CoffeeScript展示了JavaScript的“空比較”的最正確的方法。

再例如，CoffeeScript可使用=>來定義綁定上下文（this）的函數：

rest = (drink) =>
    @status = "Have a #{drink}!"

對應.js是：

rest = (function(_this) {
    return function(drink) {
        return _this.status = "Have a " + drink + "!";
    };
})(this);

可以看到CoffeeScript用了一個特定結構實現了函數綁定，這個寫法也同樣是有用的參考。

CoffeeScript調試的問題

你可能也想到了，如果需要調試，瀏覽器的錯誤提示是針對編譯后的JavaScript而不是原CoffeeScript，因此調試分析會比較麻煩。這是事實，但我認為影響不大，有以下幾點原因：

語法錯誤會在CoffeeScript編譯時提示，這個提示針對CoffeeScript源碼，可以預先看到（如果不修正，是不能得到編譯后的JavaScript的）。

CoffeeScript和JavaScript實現同一邏輯功能的結構差異較小，如果有錯誤，可以類比推斷。

CoffeeScript支持Source Maps，可以在編譯同時生成.map文件，幫助調試。

其他JavaScript的轉譯語言

可以轉譯為JavaScript的語言一般稱為altJS（Alternative JavaScript）。JavaScript語言本身有較多不方便、有缺陷的地方，且自由度過高，因人和JavaScript庫的不同，代碼風格可能會相差很大，難于維護。因此，使用altJS將是有效的解決方法之一。

除本文介紹的CoffeeScript外，主流alsJS還有TypeScript[]。其中Haxe除JavaScript外，還可以編譯為其他各類平臺的語言，如C++、C#、Java等，算是通用型編程語言。根據實際開展工作的需要，這些altJS也都值得嘗試。

結語

總的來說，CoffeeScript相比JavaScript，寫起來代碼會少一點，好用的語言特性要多一點，大概就像是在用一種更標準的形式使用JavaScript。

“它只是JavaScript”，保持這樣的心態，CoffeeScript也許可以幫到你。

（重新編輯自我的博客，原文地址：http://acgtofe.com/posts/2014/11/have-a-cup-of-coffeescript）

云服務器 GPU云服務器來點 coffeescript nodejs_coffeescript 收費嗎

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/85396.html

《JavaScript快速全棧開發》作者Azat Mardanov：現在是擁抱Node技術棧的最佳時

摘要：長期以來，他都是和等機構的講師，其技術課程獲得一致好評。但是，如果讓我預測的話，我認為未來是很光明的，而現在就是擁抱技術棧的最佳時機。所以在瀏覽器和服務器之間代碼不需要上下文切換。如果沒有上下文切換，那么生產力也會更高。非商業轉載請注明作譯者、出處，并保留本文的原始鏈接：http://www.ituring.com.cn/article/195742 Azat Mardan...

Rango 2019-08-21 10:28 評論0 收藏0
Nicholas C. Zakas：我熱愛互聯網技術的種種異端

摘要：圖靈社區看來，移動互聯網開發會成為下一行業焦點，你覺得呢移動互聯網開發已經是焦點了。圖靈社區現在有很多基于改進的語言，比如，等等。熱愛跨瀏覽器開發帶來的挑戰熱愛互聯網技術的種種異端，熱愛業內的同行，熱愛你的工具。非商業轉載請注明作譯者、出處，并保留本文的原始鏈接：http://www.ituring.com.cn/article/1791 尼古拉斯·澤卡斯（Nicholas...

PascalXie 2019-08-21 12:37 評論0 收藏0
【趣味連載】攻城獅上傳視頻與普通人上傳視頻：（一）生成結構化數據

摘要：背景當知道要上傳的視頻資料從條變成條時，我就明白，絕對不能再人工處理了。背景當知道要上傳的視頻資料從20條變成100條時，我就明白，絕對不能再人工處理了。他們總是想當然的認為，錄入一條數據需要1分鐘，那錄入20條數據就是20分鐘，錄入100條數據，不就是100分鐘嗎？我有時候，真的很想問問他們，沒有考慮過人是會犯錯的嗎？數據越多，出錯的可能就越大；但是數據本身，又是不允許出現紕漏的...

mindwind 2019-06-21 16:16 評論0 收藏0
初識 CoffeeScript

摘要：而造成一些莫名其妙的錯誤。寫一個文件打印出編譯命令會在同級目錄下生成一個同名的文件。將包裹在了一個匿名函數當中，并用調用，這樣使得代碼隔離，不會和外部混淆。其中的表示的就是為了方便使用，可以使用雙冒號來替代。很早就知道這CoffeeScript一門語言，但是一直沒有機會系統的學習下，那天趁在公司沒有什么要緊的項目做，就根據CoffeeScript首頁的例子學了一下。引用Coffe...

騫諱護 2019-08-19 14:42 評論0 收藏0