从CoffeeScript的角度看ES6中的新特性
栏目: CoffeeScript · 发布时间: 6年前
内容简介：从CoffeeScript的角度看ES6中的新特性
我成为一个CoffeeScript的粉丝超过两年了，我发现我用CoffeeScript生产率更高，低级错误更少，而且支持源码映射使得调试CoffeeScript很轻松。 
最近我在使用Babel玩ES6，总体来讲，我还是很喜欢。这篇文章中，我会从CoffeeScript转换的角度把我对ES6的发现罗列出来，包括那些我喜欢的东西，看还有哪些是我不知道的。
强调语法缩进：好还是不好
我对CoffeeScript的语法缩进是爱恨交加，好的时候能带来很多的便利，但有时会导致严重的bug，这些bug浪费了你很多的时候，让你觉得依赖缩进的语法真的有些不值当。 ` 当你的代码块有一些嵌套语句，你又不小心地将其中的一个语句不正确地缩进了，就会导致这样的问题。看代码看多了，眼睛累了，这种事情就难免发生，但在CoffeeScript更容易发生。
当我开始写ES6代码时，我还不是很确定我应该怎么来写这样的代码。但我很快发现用花括号来写感觉很好。现在流行的编辑器普遍都支持花括号的匹配，你只要写开始的花括号，编辑器就可以自动生成结束的花括号。
`
当然我还是不用分号，如果你不需要分号，那就不要再用了，分号又难看，又要额外打一个字符，多余得很！
类的支持
ES6中类的支持简直完美，如果你从CoffeeScript转换过来，你会觉得很自然。我们通过一个简单的例子来比较一下他们的语法： ES6的类： `` I am an animal with ${this.numberOfLegs} legs` } }
class Monkey extends Animal { constructor(bananas) { super(2) this.bananas = bananas } toString() { let superString = super.toString() .replace(/an animal/, 'a monkey') return } } ```
CoffeeScript的类： ```coffeescript class Animal constructor: (@numberOfLegs) ->
toString: -> "I am an animal with #{@numberOfLegs} legs"
class Monkey extends Animal constructor: (@numberOfBananas) -> super(2)
toString: -> superString = super.toString() .replace(/an animal/, 'a monkey') "#{superString} and #{@numberOfLegs} bananas"
```
第一印象
你或许首先会注意到ES6比CoffeeScript冗余一些，原来在CoffeeScript中感觉很顺手的是构造器中实例变量的自动赋值的支持，就像这样： javascript constructor(numberOfLegs) { this.numberOfLegs = numberOfLegs } ```
当然这也不是什么大问题，如果都用明确的语法写出来，代码就会比较容易看。另外一个小的缺失点是不能用@快捷方式来做这个事情，原来做 ruby 的话，会感觉这种方式还是挺好用的。一般来说，这些地方我也感觉比较自然，我实际上还喜欢ES6的定义方法的语法方式。
super的使用
ES6中super处理的方式有点难以理解，CoffeeScript中用Ruby的方式来处理super（就是发一个消息给同名的超类方法），但是在ES6中，你只能在构造函数中使用裸super。ES6使用一种更加传统的类似 JAVA 的方式，也就是super是超类实例的引用。
如何Return
CoffeeScript中我们使用隐式的返回来构建像这样的漂亮代码： `
你调用foo()的时候，这样可以让foo返回。ES6没有这样的方式，需要我们使用return关键字返回：
`
就像我们上面看到的那样，这样做一般来说是好事，但我发现我有时会忘记加上return，结果到处都得到了不期望的undefined。我就曾遇到过一个关于Arrow函数的异常，你得到了一个隐式的返回，就像这样： javascript array.map( x => { return x * 10 }) ``` 然而，这样做还是有意义的。原因在于既然你用花括号，你是有多行语句的，如果你有多行语句，使用return会使你返回的内容就变得清晰。
ES6类语法的好处
我们已经看到了CoffeeScript在定义类的时候的几个语法上的小技巧，但ES6也有一些它自己的小技巧：
Getters和Setters
如下面例子所示，ES6通过getters和setters，对通过getters和setters进行封装有强大的支持：
` 由于有getter，我们在访问bananaStore.bananas的时候，它只会返回ripe的香蕉。但在CoffeeScript中，就需要通过一个类似bananaStore.getBananas()的getter方法来实现这样的功能。这样一点都不自然，因为在javascript中我们一直都是直接访问属性的。这也让开发的时候感到困惑，我们需要如何访问每个属性，到底用.bananas呢还是用getBananas()？
在清除设置的数据，或者置入无效的数据时抛出异常的时候，Setter一样是有用的，就像上面toy例子上所示的。对于有Ruby背景的人来说，这是很熟悉的。
我个人不认为这意味着你要疯狂地在所有的地方都使用setters和getters。如果你通过getters和setters的方式封装实例变量，你觉得比较好，那你就尽管用这种方式。但如果你只是一个布尔变量，类似于isEditable，就没有必要了。因为你直接访问也不会引起什么坏处，为简单期间，那就直接访问好了。
静态方法
ES6支持静态方法，这样我们就可以玩这样的小技巧了： ` 这样，如果你不喜欢写new Foo()，你现在就可以写成Foo.new(). new本来是一个关键字，却被用作函数名，看上去似乎不太好，但在Node.js以及新版的浏览器中，这种方式跑得很好。生产环境下你很可能不想这样用。
不幸的是，因为在ES6中不支持静态属性，如果你想定义类常量，并在静态方法中访问他们，你需要这样做：
`
是不是感觉怪怪的？
ES7中有人建议实现陈述式实例和类属性，这样我们可以这样写：
` 看起来要更好一些。
在CoffeeScript中做起来就比较好：
```coffeescript class Foo @ROOT_PATH: '/foo'
@imgPath: -> @ROOT_PATH
```
字符串插值
Javascript中终于可以做字符串插值了!
。从CoffeeScript和Ruby中走过来，这种语法看起来有些好玩。也许Ruby中字符”`“（数字1左边的字符）一般用来执行系统命令，也许Ruby用熟了，开始用起来很不爽。此外用美元符号给我感觉有点80的感觉（$有点像8？），可能只有我有这个感觉吧，呵呵。
我想只是后向兼容性的考虑，于是不能实现CoffeeScript类型的字符串插值。就像这样"What a #{expletive} shame".
箭头函数
在CoffeeScript中箭头函数是理所当然的。ES6实现了大多数的类似于CoffeeScript中的箭头语法，这样我们可以写好看的短语句，我们也可以得到词典式。所以我们不需要像ES6中这样跳转：
` ES6中对等的写法是这样的：
```javascript doSomethingAsync().then( res => { this.foo(res) })
注意我忽略了回调函数的括号，ES6支持这样写。
对象语法
ES6中对象词法有重大的性能提升，他们能做所有的事情
动态属性名
我实际上没有意识到自从CoffeeScript 1.9.1 以来，直到写这篇文章，我们能这样做：
`
要是以前，你得这样写：
` ES6有一个替代的语法，我觉得很漂亮，但也算不上重大的进步：
`
这实际上是从CoffeeScript拿来的，但我之前一直没有用过。其实还是蛮有用的：
` 现在obj对象的内容是{ foo: 'foo', bar: 'bar' }。这种方式很有用，值得记住。
类能做的我都能做
Object literals能做类所能做的绝大多数的事情，甚至想这样的：
` 你为什么这样做我不关心，但现在你确实可以这样写了。你当然不能定义静态方法，因为这根本没有意义。
让你困惑的for循环
ES6中for循环可能会让经验丰富的CoffeeScript程序员引入内存方面的bug，因为ES6中的for-of与CoffeeScript中的for-in对应。
ES6
` CoffeeScript
```coffeescript for i of [1, 2, 3] console.log(i)
0
1
2
```
是否应该切换到ES6
我现在在做一个大型的Node.js工程，其中全部用的都是CoffeeScript，用起来感到很高兴，生产率也超高。ES6中唯一对我有吸引力的是getters和setters。
我现在用ES6还是感到有些痛苦，如果你使用最新的Node.js版本，那么你就可以使用所有的ES6特征，但如果你用老一些的版本，或者在浏览器中使用，就没有这么好玩了。是的，你可以使用Babel，但这样就需要将Babel集成到你的技术栈中。
我还会观察ES6一到两年，我希望在ES7中看到更好的东东。
我对ES6真正满意的是 “plain old JavaScript”像CoffeeScript一样便于使用，过去我在写Javascript工程的时候总是感到不爽，但用ES6的话就没有这个问题。
译自： What's New in ES6? Perspective of a CoffeeScript Convert
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持 码农网
猜你喜欢:
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
计算机程序设计艺术（第2卷）
高德纳 / 机械工业出版社 / 2008-1 / 109.00元
《计算机程序设计艺术:半数值算法(第2卷)(英文版)(第3版)》主要内容：关于算法分析的这多卷论著已经长期被公认为经典计算机科学的定义性描述。迄今已出版的完整的三卷已经组成了程序设计理论和实践的惟一的珍贵资源，无数读者都赞扬Knuth的著作对个人的深远影响，科学家们为他的分析的美丽和优雅所惊叹，而从事实践的程序员已经成功地将他的“菜谱式”的解应用到日常问题上，所有人都由于Knuth在书中表现出的博......一起来看看 《计算机程序设计艺术（第2卷）》 这本书的介绍吧!
