TypeScript 教程

本文目录结构

TypeScript 教程

TypeScript 是 JavaScript 的一个严格超集,并添加了可选的静态类型和使用看起来像基于类的面向对象编程语法操作 Prototype。C#的首席架构师以及 Delphi 和 Turbo Pascal 的创始人安德斯·海尔斯伯格参与了 TypeScript 的开发。

TS 支持 ECMAScript 6 标准。

TypeScript 设计目标是开发大型应用,然后转译成 JavaScript。

由于 TypeScript 是 JavaScript 的严格超集,任何现有的 JavaScript 程序都是合法的 TypeScript 程序;

TypeScript 由微软开发的自由和开源的编程语言。

TypeScript 设计目标是开发大型应用,它可以编译成纯 JavaScript,编译出来的 JavaScript 可以运行在任何浏览器上。

语言特性

TypeScript 是一种给 JavaScript 添加特性的语言扩展。增加的功能包括:

  • 类型批注和编译时类型检查
  • 类型推断
  • 类型擦除
  • 接口
  • 枚举
  • Mixin
  • 泛型编程
  • 名字空间
  • 元组
  • Await

以下功能是从 ECMA 2015 反向移植而来:

  • 模块
  • lambda 函数的箭头语法
  • 可选参数以及默认参数

在语法上,TypeScript 很类似 JScript .NET,它是另外一个微软对 ECMA-262 语言标准的实现,添加了对静态类型、经典的面向对象语言特性(如类、继承、接口和名字空间等)的支持。

JavaScript 与 TypeScript 的区别

TypeScript 是 JavaScript 的超集,扩展了 JavaScript 的语法,因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改,TypeScript 通过类型注解提供编译时的静态类型检查。

TypeScript 可处理已有的 JavaScript 代码,并只对其中的 TypeScript 代码进行编译。

类型批注

TypeScript 通过类型批注提供在编译时启动类型检查的静态类型。这是可选的,而且可以忽略而使用 JavaScript 常规的动态类型。

function Add(left: number, right: number): number {
	return left + right;
}

对于基本类型的批注是 number、bool 和 string。而弱或动态类型的结构则是 any 类型。

类型批注可以被导出到一个单独的“声明文件”,以让使用类型已被编译为 JavaScript 的 TypeScript 脚本中的类型信息仍可用。批注可以为一个现有的 JavaScript 库声明,就像已经为 Node.js 和 jQuery 所做的那样。

当类型没有给出时,TypeScript 编译器利用类型推断来推断类型。如果由于缺乏声明而不能推断出类型,那么它的类型被视作默认的动态 any 类型。

第一个 TypeScript 实例

以下实例我们使用 TypeScript 来输出 Hello World!:

const hello : string = "Hello World!"
console.log(hello)

编译器

TypeScript 编译器,叫做 tsc,本身也是用 TypeScript 写成的。可以将 TypeScript 编译为可以在任何 JavaScript 引擎(如浏览器)中执行的标准 JavaScript。编译器包也包含了脚本解释器,用来执行编译器。同时也有个 Node.js 包,在 Node.js 平台执行。

另外还有一个用 JavaScript 写的 alpha 版本的客户端编译器,它在页面加载时,实时执行 TypeScript 代码。

这种编译器的当前版本默认支持 ECMAScript 5。

一个选项是允许以 ECMAScript 2015 为目标,以利用该版本独有的语言特性(比如生成器)。类尽管是 ECMAScript 2015 标准的一部分,在这两个模式下都可以使用。

IDE 和编辑器支持

  • 微软为 Visual Studio 2012 和 WebMatrix 提供了一个插件,在 Visual Studio 2013 和 Visual Studio 2015 中内嵌了支持,也为 Sublime Text、Emacs 和 Vim 提供了基本的文本编辑器支持。
  • Visual Studio Code 是一个开源的、跨平台的代码编辑器,是微软在 Electron 的基础上开发的。它支持 TypeScript,同时也支持其他几个语言,同时提供了调试和自动代码补全的功能。
  • JetBrains 在他们的 IDE 系列中支持 TypeScript,而且已经发行了具有部分支持的 PhpStorm 6 和 WebStorm 6 以及 IntelliJ IDEA。 同时他们的 Visual Studio 扩展 ReSharper 8.1 也支持。
  • Atom 也有一个 TypeScript 插件, 由 Basarat 开发,支持代码补全、跳转、格式化和快速完成。
  • 在线的 Cloud9 IDE 和 Codenvy 也支持 TypeScript。
  • NetBeans 也有一个 插件。
  • Eclipse IDE (Kepler) 也有一个 插件
  • TypEcs 也是一个 Eclipse IDE 插件
  • Microsoft 为 Sublime Text 提供了 TypeScript 插件
  • 跨平台云 IDE Codeanywhere 支持 TypeScript
  • Webclipse 是一个 Eclipse 插件,用于开发 TypeScript 和 Angular 2.
  • Angular IDE 是一个可以从 npm 安装的 IDE,可以开发 TypeScript 和 Angular 2 应用,集成终端支持
  • Tide — Emacs 的 TypeScript 交互开发环境

开源

TypeScript 是开源的,其源代码可以在 Apache 2 License 下从 Github 获得。这个项目由 Microsoft 维护,但是任何人可以通过在 Github 项目页发送反馈、提出建议和提交 bugfixes 而做出贡献。

已有一些批评提到,TypeScript 鼓励强类型,当前只有 Microsoft Visual Studio 支持在该语言上方便开发。最初的方案是在其它的编辑器上带来强类型,IntelliSense, 代码完成和代码重构的功能,但这可能不是一个简单的任务。此外,支持 TypeScript 开发的 Visual Studio 扩展不是开源的。最好的 TypeScript 开发体验是在 Microsoft Windows 上,然而随着时间的流逝以及这种语言的开放性,加之编译器自我托管,而且用 TypeScript 自身写的,这很有可能会改变。通过编译器的源代码访问到 AST(抽象句法树)以及详细的语言规范文档,社群已开始构建一个跨平台的编辑器,利用和 Visual Studio 所用到的相同的语言服务以提供一个增强的编辑体验。编辑器仍然在概念检验的阶段,但已经运行于 Linux, OSX 和 Windows,提供功能强度相同的 IntelliSense, 代码完成和句法高亮方法。

阿西河

AXIHE / 精选教程

浏览全部教程

HTML

CSS

JS

关于本站

阿西河前端教程more,是一个提供大前端开发教程的网站;这里不仅会有传统的WEB开发教程,还会包含Nodejs,Docker,云服务相关的介绍;