TypeScript 入门笔记

TypeScript

TypeScript是一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。

Visual Code 安装 TypeScript

npm install -g typescript

构建第一个TypeScript文件

• 创建文件 *** greeter.ts *** 键入如下内容

function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

console.log(greeter(user));

• 编译代码

命令行运行如下代码

tsc greeter.ts

• 当前目录下生成一个文件名相同的js文件 greeter.js

• 使用node 执行当前js文件

node ./greeter.js

• 可以看到当前Terminal输出

Hello, Jane User

• 通过以上代码也就完成了TypeScript第一个小Demo

类型注释

• TypeScript里的类型注解是一种轻量级的为函数或变量添加约束的方式.我们希望 greeter函数接收一个字符串参数。 然后尝试把 greeter的调用改成传入一个数组：

function greeter(person: string) {
    return "Hello," + person;
}

let user = [ '0' , '1' , '2'];

console.log(greeter(user));

• 重新编译(可以Terminal报如下错误)

Argument of type 'string[]' is not assignable to parameter of type 'string'.

接口(interface)

• 在TypeScript里，只在两个类型内部的结构兼容那么这两个类型就是兼容的。 这就允许我们在实现接口时候只要保证包含了接口要求的结构就可以，而不必明确地使用 implements语句。

interface Person {
    firstName: string;
    lastName: string;
}
function greeter(person: Person) {
    return "Hello," + person.firstName + " " + person.lastName;
}
let user = {
    firstName: "Jane",
    lastName: "User"
}
console.log(greeter(user));

• 编译运行

Hello,Jane User

类(class)

• TypeScript支持JavaScript的新特性，比如支持基于类的面向对象编程。
• 创建一个Student类，它带有一个构造函数和一些公共字段。
• 注意类和接口可以一起共作，程序员可以自行决定抽象的级别
• 在构造函数的参数上使用public等同于创建了同名的成员变量.
• 创建文件 student.ts

class Student {
    fullName: string;
    constructor(public firstName, public middleInitial, public lastName) {
        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");

console.log(greeter(user));

• 编译运行

Hello, Jane User