三、 基本语法
1.前言
- 在语法层面,缺省类型注解的 TypeScript 与 JavaScript 完全一致。
let num = 1
;此写法同时满足两种与语法。 - 而 TypeScript 语法与 JavaScript 语法的区别在于,我们可以在 TypeScript 中显式声明变量num仅仅是数字类型,也就是说只需在变量num后添加
: number
类型注解即可,如下代码所示:
let num :number = 1;
/* 同理,我们也可以把:后的number换成其他的类型
(比如 JavaScript 原始类型:number、string、boolean、
null、undefined、symbol 等),
此时,num 变量也就拥有了 TypeScript 同名的原始类型定义。*/
-
因此,我们可以把 TypeScript 代码的编写看作是为 JavaScript 代码添加类型注解。
-
在 JavaScript 中,原始类型指的是非对象且没有方法的数据类型,它包括
string
、number
、bigint
、boolean
、undefined
和symbol
这六种 (null
是一个伪原始类型,它在 JavaScript 中实际上是一个对象,且所有的结构化类型都是通过 null 原型链派生而来)。 -
在 JavaScript 语言中,原始类型值是最底层的实现,对应到 TypeScript 中同样也是最底层的类型。
-
为了实现更合理的逻辑边界,我们把以上原始类型拆分到简单基础类型和复杂基础类型这两部分进行讲解。
2. 简单基础类型
2.1 字符串
// 1.字符串字面量
let firstname: string = 'Captain';
// 2.显式类型转换
let familyname: string = String('S');
// 3.模板字符串
let fullname: string = `my name is ${
firstname}.${
familyname}`;
2.2 数字(包括 number 和bigint)
- 所有 JavaScript 支持的定义数字的方法,我们都可以直接在 TypeScript 中使用。
- 我们可以使用number类型表示JavaScript 已经支持或者即将支持的十进制整数、浮点数,以及二进制数、八进制数、十六进制数。
let integer: number = 6;
let integer2: number = Number(42);
let decimal: number = 3.14;
let binary: number = 0b1010;
let octal: number = 0o744;
let hex: number = 0xf00d;
// 如果使用较少的大整数,那么我们可以使用bigint类型来表示
let big: bigint = 100n;
2.3 布尔值
let TypeScriptIsGreat: boolean = true;
let TypeScriptIsBad: boolean = false;
2.4 symbol
即我们可以通过Symbol构造函数,创建一个独一无二的标记;同时,还可以使用symbol表示如下代码所示的类型。
let sym1: symbol = Symbol();
let sym2: symbol = Symbol('42');
注意
- 当然,TypeScript 还包含 Number、String、Boolean、Symbol 等类型(注意区分大小写)。
- 实际上,我们压根使用不到 ,因为它们并没有什么特殊的用途。
- 这就像我们不必使用 JavaScript 的
Number
、String
、Boolean
等构造函数 new 一个相应的实例一样。
3. 复杂基础类型
3.1 null
- 实际上并没有太大的用处,strict 模式下,是名副其实的“废柴”。
- 价值主要体现在接口制定上,它表明对象或属性可能是空值。尤其是在前后端交互的接口,如 Java Restful、Graphql任何涉及查询的属性、对象都可能是 null 空对象。
// 鸡肋
let undeclared: undefined = undefined;
// 用处:接口制定时
const userInfo: {
name: null | str