最近浏览 GitHub 发现一个有趣的项目 PT Plugin Plus 代码拉下来发现是 ts 语言写的,就顺便了解一下。1 目标很简单,不是为了写 ts 项目,只是为了能看懂项目。
ts in 5 minutes
强类型
JavaScript 中原来变量是没有类型的,只有运行时赋值了才决定变量的类型,但是 TypeScript 在方法定义的时候可以给参数加上类型校验:
function greeter(person: string) {
return "Hello, " + person;
}
一旦类型不匹配,在编译时就会报错。
Interfaces
可以使用 interface 来定义对象
interface Person {
firstName: string;
lastName: string;
}
Classes
ts 支持基于类的面向对象编程,classes 和 interfaces 可以协同工作,
class Student {
fullName: string;
constructor(public firstName: string, public middleInitial: string, public lastName: string) {
this.fullName = firstName + " " + middleInitial + " " + lastName;
}
}
interface Person {
firstName: string;
lastName: string;
}
function greeter(person: Person) {
return "Hello, " + person.firstName + " " + person.lastName;
}
let user = new Student("Jane", "M.", "User");
document.body.textContent = greeter(user);
handbook
类型
ts 支持 js 的类型,number, string, structure, boolean 等等,不过 ts 增加了枚举类型。
Boolean
let isDone: boolean = false;
Number
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;
String
文本是任何一门语言都避免不了的,和 js 一样可以使用双引号和单引号。
let color: string = "blue";
color = 'red';
也可以使用 template strings, 使用反引号 (`) 来框住长文本。
Array
直接声明:
let list: number[] = [1, 2, 3];
或者使用 Array:
let list: Array<number> = [1, 2, 3];
Tuple
元组,用来表达固定长度数组,其他元素不一定类型相同。
定义:
let x: [string, number];
初始化:
x = ["abc", 123];
Enum
枚举类型是 ts 新增加的,用来扩展 number 表达的含义。
enum Color {RED, GREEN, BLUE}
let c: Color = Color.RED;
枚举类型默认从 0 开始,可以手动指定。
enum Color { RED=1, GREEN, BLUE}
enum Color { RED=1, GREEN=2, BLUE=4}
Any
any
类型可以使得开发者可以自行选择使用类型检查,或者不使用。
let notSure: any = 4;
notSure = "maybe a string instead";
notSure = false; // okay, definitely a boolean
Void
void
像是 any
类型的反面,void
经常被用来作为方法的 void 返回。
Null and Undefined
在 ts 中,undefined 和 null 都有各自的类型,和 void 一样,null 和 undefined 一般都不自己使用。默认 null 和 undefined 是其他类型的子类型,这意味着可以将 null 和 undefined 赋值给 number.
Never
never
类型表示类型的值永远不会发生。
Object
非原始类型,不是 number, string, boolean, bigint, symbol, null 或者 undefined.
Type assertions
尖括号语法:
let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
as 语法:
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;