Angular 教程

Angular 是一款开源 JavaScript 库，由 Google 维护，用来协助单一页面应用程序运行。

Angular 是 Angular 1.x 的升级版本，性能上得到显著的提高，能很好的支持 Web 开发组件。

Angular 发布于 2016 年 9 月份，它是基于 ES6 来开发的。

Angular 与 AngularJS 的区别

随着 Angular 版本的频繁推出，有必要了解下 AngularJS、 Angular 2、Angular 4 Angular 8 等 的区别。

我们常说的 Angular 1 是指 AngularJS（Angular2 以后官方命名为 Angular, 2.0 以前的版本称为 AngualrJS）；

从 Angular 开始已经改名了。不再带有 JS，只是单纯的 Angular；

Angular.x 与 Angular1.x 的区别类似 Java 和 JavaScript 或者说是雷锋与雷峰塔的区别，

所以在学习 Angular.x 时大家需要做好重新学习一门语言的心里准备。

学习本教程需要的基础知识

学习本教程前，你需要具备基本的前端基础：HTML、CSS、JavaScript。此外你还需要了解 NPM 及 TypeScript。

• NPM 文档
• TypeScript 教程

运行条件

由于目前各种环境（浏览器或 Node）支持 ES6 的代码并不完美，所以需要一些 shim 和 polyfill（IE 需要）让 ES6 写的代码能够转化为 ES5 形式并可以正常运行在浏览器中。

从上图可以看出在 Es5 浏览器下需要以下模块加载器：

• systemjs - 通用模块加载器，支持 AMD、CommonJS、ES6 等各种格式的 JS 模块加载。
• es6-module-loader - ES6 模块加载器，systemjs 会自动加载这个模块。
• traceur - ES6 转码器，将 ES6 代码转换为当前浏览器支持的 ES5 代码，systemjs 会自动加载 这个模块。

Angular 简介

Angular 是 Google 推出的一个跨平台全终端的框架，和目前比较火的 React 和 Vue.js 相比，有如下优点：

• 由于 Google 的目的是推出一个完整解决方案，所以官方默认提供的类库（比如 routing，http，依赖性注入（DI）等）非常完整，无需自己选择。React 的一大痛点就是选择太多导致在配置寻找组件和类库的过程中消耗太多精力，当然从另一方面看这也是其优势，选择众多且自由。
• 官方支持 TypeScript（微软出品，是 JavaScript 的超集，是 JavaScript 的强类型版本）作为首选编程语言，使得开发脚本语言的一些问题可以更早更方便的找到。
• RxJS 友好使得响应式编程在 Augular2 中变得极为容易（Google 开发的框架依赖这么多的微软的产品，可见微软的转型还是很成功的）
• 支持 NativeScript 甚至 ReactNative 等进行原生 Android/iOS 应用开发（React 支持 React Native）
• 支持服务器端渲染（React 也支持）

但总体来讲，个人认为 Angular 更适合从原生 App 开发或后端 Java/.Net 等转型过来开发前端的程序员，因为它的开发模型更接近于传统强类型语言的模式，加上官方内建的组件和类库比较完整，学习曲线要低一些。有过 Angular 1.x 开发经验的同学要注意了，虽然只有一个版本号的差距，但 2.x 和 1.x 是完全不同的，不要奢望 1.x 的应用会平滑迁移到 2.x。

相关参考文档

• Angular 官网：https://angular.io/
• Angular 官方文档：https://angular.io/docs/ts/latest/quickstart.html