目录

简介

  1. TypeScript是JavaScript的超集，扩展了JavaScript的语法

环境搭建

  1. 使用npm安装TypeScript：
npm install -g typescript
  1. 查看tsc的版本：
tsc -v
Version 5.6.3
  1. 新建test.ts文件，内容编辑如下：
const str:string = "Hello World"
console.log(str)
  1. 将ts文件转化为js文件
tsc test.ts
  1. 执行js脚本
node test.js

TS中的基础类型

  1. string
  2. number
  3. boolean
  4. array：表示相同类型的元素数组
let list: number[] = [1, 2, 3];
let infos: Array<string> = ["Hi", "I am Nrvcer"];
  1. tuple：表示已知类型和长度的数组
let person: [number, string] = [24, "nrvcer"];
  1. enum
  2. any：任意类型，不进行类型检查
// 定义存储各种类型数据的数组
let arrayList: any[] = [1, false, 'fine'];
  1. void：无返回值，常用于函数或者方法
  2. null：null是一个只有一个值的特殊类型，表示一个空对象引用。用 typeof 检测 null 返回是 object
console.log(typeof null)    // object
  1. undefined： undefined 是一个没有设置值的变量，typeof 一个没有值的变量会返回 undefined。
console.log(typeof undefined)   // undefined
  1. never：表示不会有返回值
  2. object：表示非原始类型
  3. union
let id: string | number;
id = 24
  1. unknown：不确定类型，需类型检查后再使用

运算符

略

条件语句

略

循环

略

函数

  1. 普通函数定义示例如下：
// age为可选参数，调用func1时可以不传递形参对应的实参值
function func1(name: string, age?: number): string {
    if (age) {
        return name + age;
    } else {
        return name;
    }
}

console.log(func1("Nrvcer"));
console.log(func1("Nrvcer", 24));

function func2(name: string, age: number = 24) {
    return name + age;
}

console.log(func2("Nrvcer"));
console.log(func2("Nrvcer", 26));
  1. 匿名函数定义示例如下：
(function(name: string, age: number):void {
    console.log(name, age);
})("Nrvcer", 24);
  1. Lambda函数定义示例如下：
((name: string, age: number) => {
    console.log(name, age);
})("Nrvcer", 24);

Number

原始数值的包装类，详情略

String

用于处理文本，详情略

Array

  1. 数组的定义示例如下：
let arr: any[] = ["Nrvcer", 24];

console.log(arr instanceof Array)   // true

arr = [1024, 2048];

Map

Map对象用于保存键值对。详情略

元组

  1. 元组：表示已知类型和长度的数组，其中存储的元素类型可以不同
  2. 示例：
let me: [number, string] = [24, "Nrvcer"];

console.log(me[0], me[1]);

// 元组的解构赋值
let [age, name] = me;
console.log(age, name);

联合类型

  1. 联合类型可以通过管道|将变量设置为多种类型，赋值时可以根据设置的类型来赋值
  2. 语法格式为：
Type1 | Type2 | Type3
  1. 示例如下：
function func(arg: string | string[]) {
    if (typeof arg == "string") {
        console.log(arg);
    } else {
        for (let i = 0; i < arg.length; ++i) {
            console.log(arg[i]);
        }
    }
}

func("test");
func(["Hi", "World"]);

接口

接口是一系列抽象方法的声明

类

  1. 一个类示例如下：
class Person {
    private static head: number = 1;
    public static getHead(): number {
        return this.head;
    }

    private name: string;
    private age: number;

    public constructor(name: string, age: number) {
        this.name = name;
        this.age = age;
    }
    public getName(): string {
        return this.name;
    }

    public getAge(): number {
        return this.age;
    }
}

var p = new Person("Nrvcer", 24);
console.log(p.getName(), p.getAge(), Person.getHead(), p instanceof Object);

泛型

  1. 泛型函数示例：
function func<T>(arg: T): T {
    return arg;
}

console.log(func<string>("test"));
console.log(func<number>(1024));
  1. 泛型接口示例：
interface Introduce<T, U> {
    name: T;
    age: U;
}

let pair: Introduce<string, number> = {name: "Nrvcer", age: 24};
  1. 泛型类示例：
class Test<T> {
    private value: T;

    constructor(value: T) {
        this.value = value;
    }

    getValue(): T {
        return this.value;
    }
}

let obj = new Test<number>(1024);
console.log(obj.getValue());
  1. 泛型约束示例：
interface CalcLength {
    length: number;
}

// 传递的参数拥有 length 属性，TypeScript 就会认定其符合要求
function len<T extends CalcLength>(arg: T) {
    console.log(arg.length);
}

len("test");

TS中的声明文件

  1. 在TS中引用第三方JS编写的库时，需要引用第三方JS编写的库对应的声明文件，后缀名为d.ts。声明文件或模块的语法格式如下：
declare module Module_Name {
}