CoffeeScript和Sass提高Web開發效率

如果您是一位每天都要編寫JavaScript和Css的Web前端開發人員，可能您已經開始感覺到JavaScript的關鍵字 var, function, {} 要被您每天敲擊若干遍。是否可以省掉這些重複的敲擊。編寫Css，先要一層一層的選到元素，然後開始寫樣式，如果要寫下一層的樣式，又要重複的選一次父層元素然後再到子層，Css是否可以巢狀呢。

下面是同樣功能的CoffeeScript和JavaScript的程式碼對比:

同樣功能的Sass程式碼和Css程式碼的對比：

是不是CoffeeScript和Sass更加的簡潔易懂，同時又省了很多程式碼? CoffeeScript和Sass都採用了簡潔的Ruby語法風格，都是用程式碼生成程式碼，即用右邊的CoffeeScript程式碼生成左邊的JavaScript程式碼，用Sass/Scss程式碼生成Css程式碼。這兩個Library的作者都想用新的程式碼方式來省去一些重複的，有些"鋪張"的程式碼。
CoffeScript:    

CoffeeScript的一些有用特性:  
1.  Lexical Scoping and Variable Safety    
2.  If, Else, Unless, and Conditional Assignment    
3.  The Existential Operator    
4.  Classes, Inheritance, and Super    
5.  Function binding    
6.  Extended Regular Expressions

Sass:  

Sass 的一些有用特性:  
1.  Variables: 變數以$開始，它能定義 顏色，數字，或者文字。    
2.  Nesting: 巢狀，將選擇器嵌入到其他層級的選擇器。    
3.  Mixins: 混合型別，允許抽象出性質的共同點，然後命名並且加入到選擇器中。    
4.  Selector Inheritance: 繼承，繼承其它選擇器的屬性。    
5.  Functions: 函式，支援簡單的算術操作，如+-×/，及函式。如：將某顏色亮度增加10%: lighten(red, 10%)。

歡迎大家在GCDN討論～～