CoffeeScript模式

2018-08-25 11:39 更新

使用CoffeeScript的一個(gè)重要理由,就是她用自己的語(yǔ)法實(shí)現(xiàn)了很多很常用的js編程模式,而且,通常是在社區(qū)內(nèi)廣泛被承認(rèn)的最佳實(shí)踐,如果不熟悉JavaScript的這些模式,可能會(huì)在調(diào)試代碼上遇到一些麻煩,不過,基本上來(lái)說還是比較簡(jiǎn)單易懂的。


JavaScript代碼的例子:

以斐波納契函數(shù)舉例來(lái)說,這個(gè)函數(shù)對(duì)絕大多數(shù)程序員來(lái)是應(yīng)該知道的。這里有一個(gè)談不上漂亮的實(shí)現(xiàn),因?yàn)榇a缺乏結(jié)構(gòu)化,而且使用了很多沒必要的冗長(zhǎng)代碼:

JavaScript

function f(n) {
var s= 0;
if(n == 0) return(s);
if(n == 1) {
s += 1;
return(s);
}
else {
return(f(n - 1) + f(n - 2));
   }
}

function f(n) {
var s= 0;
if(n == 0) return(s);
if(n == 1) {
s += 1;
return(s);
}
else {
return(f(n - 1) + f(n - 2));
   }
}


這里是另外一個(gè)版本的實(shí)現(xiàn),我發(fā)現(xiàn)了更多優(yōu)雅和優(yōu)美之處,尤其是如果你熟悉單行的if else的話(三目條件運(yùn)算):


JavaScript

function fib(n) {
    return n<2 ? n : fib(n-1) + fib(n-2)}

function fib(n) {
    return n<2 ? n : fib(n-1) + fib(n-2)}
同樣優(yōu)美的一段碼,代碼的行數(shù)并不見得那么重要

JavaScript

function fib(n) {
    if (n < 2)
        return n
    return fib(n-2) + fib(n-1)}

function fib(n) {
    if (n < 2)
        return n
    return fib(n-2) + fib(n-1)}
JavaScript的毛?。?br />
我認(rèn)為JavaScript的一個(gè)主要問題就是它那令人困惑的混雜多種不同語(yǔ)言的模式: JavaScript是函數(shù)式語(yǔ)言 JavaScript是面向?qū)ο蟮恼Z(yǔ)言,但它是基于原型的 JavaScript是動(dòng)態(tài)的非常接近于Lisp而不是C/Java,但是有C/Java的語(yǔ)法 JavaScript的名字就很讓人疑惑,但是和Java沒有半點(diǎn)關(guān)系 這種語(yǔ)言有特性危機(jī),程序員嘗試強(qiáng)加范式到JavaScript中,但這并不是什么好主意,因?yàn)镴avaScript不是Java,不是Sheme,也不是Python,就像其它語(yǔ)言一樣有自己的強(qiáng)項(xiàng)和弱項(xiàng)。

同時(shí),JavaScript草率的設(shè)計(jì)和糟糕的決策表現(xiàn)在this,像this的動(dòng)態(tài)域、用于繼承的語(yǔ)法,由于考慮到向后兼容的原因修復(fù)這些問題非常困難。這里是一個(gè)很好的引用來(lái)自于JavaScript的創(chuàng)造者,亮點(diǎn)在JavaScript誕生的所處的環(huán)境:“JavaScript聽起來(lái)像Java,僅此而已,像是Java的啞巴小兄弟,但是我不得不在十天完成或者比JavaScript更糟糕的事情會(huì)發(fā)生”— Brendan Eich


CoffeeScript:全新的方式寫出更好的JavaScript


CoffeeScript是一種精致的語(yǔ)言,能編譯成JavaScript。它的目的是用簡(jiǎn)單的方法揭示JavaScript優(yōu)秀的部分。


CoffeeScript不會(huì)終結(jié)你的JavaScript代碼


我喜歡CoffeeScript的原因之一是它能編譯成JavaScript,這就意味著我可以重用我當(dāng)前所有的JavaScript代碼,我不需要重寫任何代碼到CoffeeScript,這是一筆偉大的交易,尤其是因?yàn)槲覀兊腤edoist JavaScript代碼庫(kù)非常龐大,要是重寫成另一種語(yǔ)言夠你花上數(shù)月的時(shí)間。 CoffeeScript同樣是一種迷你型的JavaScript,就像是被改善JavaScript版本,糟糕的部分被替換掉了。同時(shí)它的語(yǔ)法從C/Java語(yǔ)言換成了Ruby或者是Python(棒極了,因?yàn)镴avaScript 更接近于Ruby、Python而不是C或者Java)。



CoffeeScript是怎么樣編譯成JavaScript


為了闡述編譯,我們舉一例子,看他是怎么工作的。 CoffeeScript代碼:


JavaScript


square = (x) -> x * x
cube   = (x) -> square(x) * x

square = (x) -> x * x
cube   = (x) -> square(x) * x
編譯成JavaScript代碼:


JavaScript


var cube, square;
square = function(x) {
  return x * x;
};
cube = function(x) {
  return square(x) * x;
};

var cube, square;
square = function(x) {
  return x * x;
};
cube = function(x) {
  return square(x) * x;
};
正如你從上例中看到的CoffeeScript和JavaScirpt的映射非常的直接。在另外一個(gè)網(wǎng)站你可以發(fā)現(xiàn)很多例子CoffeeScript如何編譯成JavaScript。



CoffeeScript:重寫示例


為了給你一種CoffeeScript的感覺,這里是個(gè)小JavaScript例子,我將重寫成CoffeeScript。


JavaScript


get: function(offset, callback, limit) {
    var self = this;


    var data = {
        project_id: Projects.getCurrent().id,
        limit: limit || this.default_limit
    }


    if(offset)
        data.offset = Calendar.jsonFormat(offset, true);


    this.ajax.getArchived(data, function(data) {
        if(!offset)
            self.setCache(data);
        callback(data);
    });
}

get: function(offset, callback, limit) {
    var self = this;
 
    var data = {
        project_id: Projects.getCurrent().id,
        limit: limit || this.default_limit
    }
 
    if(offset)
        data.offset = Calendar.jsonFormat(offset, true);
 
    this.ajax.getArchived(data, function(data) {
        if(!offset)
            self.setCache(data);
        callback(data);
    });
}
CoffeeScript看起來(lái)像這樣:


JavaScript


get: (offset, callback, limit) =>
    data =
        project_id: Projects.getCurrent().id
        limit: limit or @default_limit


    if offset
        data.offset = Calendar.jsonFormat(offset, true)


    @ajax.getArchived(data, (data) =>
        if !offset
            @setCache(data)
        callback(data)
    )

get: (offset, callback, limit) =>
    data =
        project_id: Projects.getCurrent().id
        limit: limit or @default_limit
 
    if offset
        data.offset = Calendar.jsonFormat(offset, true)
 
    @ajax.getArchived(data, (data) =>
        if !offset
            @setCache(data)
        callback(data)
    )


如你所見,兩者看起來(lái)非常相似,但是CoffeeScript看起來(lái)更輕快,因?yàn)樗蟹潜仨毜恼Z(yǔ)法被移除僅保留了必須的元素。

以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)