TypeScript vs Babel的问题如何看待。

TypeScript vs Babel的问题

2018年10月24日 星期三

下午2:22

babel很多,更加好的生态,太自由?,typescript太约束,太难?

 

1)Es2016是必学的,但是并非都支持。。。

用类型记录编写的代码和Babel是Babel的标准Javascript,您只需使用它以JavaScript方式支持的任何新特性,类型记录就是所谓的JavaScript类型化超集。

理论上,在将.js重命名为.ts之后,任何现有的JavaScript都可以通过类型记录进行处理。

虽然实际上有些边缘情况不符合这一规则,但很容易识别和修复。使用类型记录和Babel进行转换溢出与CoffeeScript和其他替代方法不同。我们现在实际上正在编写未来的JavaScript。好好享受吧。

 

ES6新特性支持请检查ECMAScript 6兼容性表。一般来说,对新ES6功能的类型记录支持无法赶上Babel。如果你对此有很大的顾虑,唯一的选择就是Babel更新更快,而ts不一定。

 

Babel 会把代码翻译成 ES5 的 js,但是 TypeScript 不会。

如果你在 TypeScript 中使用了 6 的特性,它会直接翻译成 ES6 的 js。

如果指定了 --target es5,它 TypeScript 就不支持 6 的特性(但支持 TypeScript 的特性,比如类等)

 

-------------来自微软官方===

今天,我们很兴奋地宣布一些特别的东西给Babel用户。一年多前,我们开始寻找用户在typescript方面遇到的最大困难,我们发现Babel用户的一个共同主题是,试图设置typescript太难了。原因常常是多种多样的,但对许多开发人员来说,重新构建一个已经在工作的构建可能是一项艰巨的任务。Babel是一个非常棒的工具,拥有一个充满活力的生态系统,通过将最新的JavaScript特性转换为旧的运行时和浏览器,为数百万开发人员提供服务;但它不进行类型检查,我们的团队认为这可以将这种体验提升到另一个层次。虽然打字本身可以做到这两种方式,但我们希望在不强迫用户从Babel切换的情况下更容易获得这种体验。这就是为什么在过去的一年中,我们与Babel团队合作,今天我们很高兴地宣布Babel 7现在已经提供了typescript支持!

 

How do I use it?

If you’re already using Babel and you’ve never tried TypeScript, now’s your chance because it’s easier than ever. At a minimum, you’ll need to install the TypeScript plugin.如果你已经在使用Babel,而且你从未尝试typescript记录,那么现在是你的机会,因为它比以往任何时候都容易。至少,您需要安装类型记录插件。

npm install --save-dev @babel/preset-typescript===>preset-es2015;

Though you’ll also probably want to get the other ECMAScript features that TypeScript supports:

npm install --save-dev @babel/preset-typescript@babel/preset-env @babel/plugin-proposal-class-properties @babel/plugin-proposal-object-rest-spread

这里有一个例子。 用 babel 的好处是有各种插件。

关键地方是

      {
        test: /\.ts(x?)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: 'babel-loader'
          },
          {
            loader:'ts-loader'
          }
        ]
      },

然后 tsconfig 里面要禁止 jsx

"jsx": "preserve"

尽早地识别出问题

 

无论我们使用的是 Atom, VS Code, Visual Studio, Web Storm, 还是 Sublime Text,我们所要享受的都是其多得有点过剩的固有功能或者可供我们选择的工具扩展,是它们在帮助我们较快的写出更好的代码。这些工具应该(而且能够)对尽早识别出问题起到有所帮助。

当我们编写代码时候,如果能马上找到一个问题的话,就会更加有意思,于是我们就可以就地解决它 … 或者在早上5点钟被叫醒,因为恰好在那时候触发了我们隐藏的bug而导致业务中断,生产环境爆出问题?5点那个时候我宁愿跟我的家人待在一起 :)

今天的这些工具在试图帮助我们识别问题,而它们的工作确实令人钦佩。不过如果我们可以给它们更多一点点的帮助会如何呢?如果我们赋予它们跟今天其它像C#和Java这样的语言相同的类型的帮助会如何呢? 那这些工具就确实能尽早而且频繁的帮助我们识别出问题来。

这就是 TypeScript 的用武之地。

TypeScript 的价值并不在于编写更少的代码,其价值在于编写更加安全的代码。从长远看来,它能帮助我们利用其工具识别问题并自动填充参数、属性、函数以及更多东西(通常被成为自动补全和智能感知),从而更有效率的编写出代码。

babel都能翻译,但是写代码如果没有typescript===也就是这个“type”名字一样,你所有的代码都是any。你知道你的代码是否有问题?当你快速编写的时候,确实es2015非常方便,但是带来的东西是any,你会怀念java/c#类型检查,和代码提示,帮助你快速编写和安全编写带来的好处,如果你不喜欢的话,那么ts的好处也在于此。

但是typescript严格的约束,也会有很多的多了一点难度,一旦你打通了,typescript的好处会更多。

 

为什么不就使用 ES2015 得了?

这是一个很棒的选择 ! 学习 ES2015 是从 ES5 的一个很大的进步。一旦你掌握了 ES2015, 我敢说从此 TypeScript 就是只是非常小的一步。因此回头我会建议,一旦你学习了 ES2015, 要尝试一下 TypeScript 并利用好它的工具。

 

利用Babel学习ES2015是本,Typescript的type是一个更好的工具和应用。

自己拿捏吧。。。。。。。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值