The way to Angular 2 | Part.1

Angular 2 已经进入 beta 通道有一段时间了，也有不少人开始在各种情景中使用 Angular 2。我自己也在过去两个月里进行了一些基于 Angular 2 的项目尝试。

The way from Angular 1.x to 2

这应该是大多数人很关心的一个问题，从 1.x 到 2，Angular 究竟改变了什么？ 一言难尽，这依旧是 Angular，依旧是最基础的那套思想，然后已经从最基础的设计架构层面进行了变更。

新的设计架构，真正的模块化 ANGULAR ARCHITECTURE OVERVIEW

  1. Component，控制页面上的每一个 View。

  2. Template，改进以后模板语法，熟悉 Angular 1.x 的人应该可以比较快地上手。

  3. Metadata，因为采用 Class 作为基础而引入的新特性，它向 Angular 描述了如何去处理一个 Class。

  4. Data Binding，Angular 2 将数据绑定的形式（或者说语法）设计成了 4 种，相比原来的，更加统一。

  5. Directive，Directive 依旧和以前一样执行它的任务，根据自身的指令将 DOM 转化成相应的形态。

  6. Serivces，服务一直都是一个宽广的概念，任何应用需要的值、方法和功能都可以是一个服务。Angular 2 没有对 Service 进行任何特殊的设定（没有 Service 相关的基础 Class），只要按照应用的需求进行设计就可以了。

  7. Dependency Injection，依赖注入现在语法变得更加简单，而在 TypeScript 版本中，Angular 还可以让 Component 根据构造参数去查询 Service（自动提示和类型校验会变得友善和精确）。

  8. 其他

    • 应用启动方法
    • 基于 Zone 的变化检测
    • 针对 Component 的路由
    • 事件体系
    • 表单模块
    • 新的生命周期设计
    • filter 被重命名为 Pipe（管道），更加贴切了

TypeScript

毫无疑问，在迈向 Angular 2 的路上，会遇到的第一道坎就是 TypeScript。其实官方是有 JavaScript 和 Dart 版本的，但是作为官方推荐的编写语言，TypeScript 带来的好处也是显而易见的：

  1. 强类型。动态语言总是让人觉得不放心，在逻辑和结构复杂的大型应用中，难免会出现因为使用偏差而导致的错误，TypeScript 提供的强类型校验，可以有效地避免这个问题。
  2. ES2015 的超集。从最古老的 JavaScript 语法，一直到最新的 Async/Await 以及 Decorator，得益于 TypeScript 的编译器，我们现在就可以从这些新特性中受益。
  3. 模块化。不管是 AMD、CMD 还是 ES2015 的模块化设计， TypeScript 的编译器都可以帮你自动处理（将它自己的模块化语法转换成你需要的标准）。
  4. 编译器检查。编译过程中的错误检查可以在很大程度上提高我们的 debug 效率，也可以辅助我们解决一些问题。
  5. 开发环境。静态类型检查，自动补全，代码提示等等。
  6. 健壮性。以上这些都是为了提高你的应用的健壮性和可扩展性。

我基本上已经表明了自己的立场，我是非常推荐使用 TypeScript 来进行 Angular 2 的应用开发的，理由也已经在上面描述过。 我认为 TypeScript 不会成为向 Angular 2 升级的阻碍。毫不夸张地说，将现有的 JavaScript 文件后缀名改成.ts就可以正常使用，因此 TypeScript 对于 plain JavaScript 的兼容性是非常好的。 你在 TypeScript 中写的东西依旧是 JavaScript，并非一种全新的语言。就像 TypeScript 官方所说：始于 JavaScript，终于 JavaScript。