# TypeScript Basic

# 什么是 TypeScript

TypeScript 就是添加了类型系统的 JavaScript

# TypeScript 的特性

  • 类型系统

从 TypeScript 的名字就可以看出来,「类型」是其最核心的特性。

JavaScript 是一门非常灵活的编程语言,这种灵活性就像一把双刃剑,一方面使得 JavaScript 蓬勃发展,无所不能,另一方面也使得它的代码质量参差不齐,维护成本高,运行时错误多。

而 TypeScript 的类型系统,在很大程度上弥补了 JavaScript 的缺点。

  • TypeScript 是静态类型

静态类型是指编译阶段就能确定每个变量的类型,这种语言的类型错误往往会导致语法错误。TypeScript 在运行前需要先编译为 JavaScript,而在编译阶段就会进行类型检查,所以下面这段代码在编译阶段就会报错了。

let foo = 1;
foo.split(" ");
// Property 'split' does not exist on type 'number'.
// 编译时会报错(数字没有 split 方法),无法通过编译

TypeScript 的核心设计理念: 在完整保留 JavaScript 运行时行为的基础上,通过引入静态类型系统来提高代码的可维护性,减少可能出现的 bug。

# 安装 TypeScript

TypeScript 的命令行工具安装方法如下:

npm install -g typescript

以上命令会在全局环境下安装 tsc 命令,安装完成之后,我们就可以在任何地方执行 tsc 命令了。

tsc hello.ts

此外我还安装了ts-node可以更方便的执行 ts 文件,如下:

npm install ts-node -g
ts-node hello.ts

# Hello TypeScript

在 TypeScript 中,我们使用 : 指定变量的类型,: 的前后有没有空格都可以。

我们从一个简单的例子开始。

// hello.ts
function sayHello(person: string) {
  return "Hello, " + person;
}

let user = "Tom";
console.log(sayHello(user));
tsc hello.ts

这时候会生成一个编译好的文件 hello.js:

function sayHello(person) {
  return "Hello, " + person;
}
var user = "Tom";
console.log(sayHello(user));

# 总结

什么是 TypeScript?

  • TypeScript 是添加了类型系统的 JavaScript。
  • TypeScript 是一门静态类型、弱类型的语言。
  • TypeScript 是完全兼容 JavaScript 的,它不会修改 JavaScript 运行时的特性。
  • npm install typescript ts-node -g
  • TypeScript 使用 : 指定变量的类型

# 学习资料

TypeScript 中文网 (opens new window)

TypeScript 入门教程 (opens new window)

深入理解 TypeScript (opens new window)