Typescript安装及基本类型

了不起的小瑜儿

已于 2022-08-05 13:28:53 修改

阅读量188

点赞数 1

文章标签： typescript 前端 javascript

于 2022-06-09 17:36:52 首次发布

本文链接：https://blog.csdn.net/qq_43057018/article/details/125207946

版权

Typescript

学习参考

正式开始前的一些准备工作

安装

npm install -g typescript

在终端输入：tsc -v

如果出现版本号则说明安装成功

注意！在编写ts文件时，常常会出现报错显示重复声明，为了解决这个问题可以在扩展商店里安装deno

Ts编译

在终端输入tsc --init，这样会在文件夹下自动生成tsconfig.json文件（也可以自动手动创建文件）

tsconfig.json是ts的配置文件，ts编译器可以根据它的信息来对代码进行编译，include用来指定哪些ts文件需要被编译

然后在终端输入tsc，则会将所有ts文件编译成js文件
如果想要ts文件每次自动编译成js文件，可以右键终端，点击运行任务，选择tsc:监视-XXX/tsconfig.json

TS基本

基础类型

let str: string = "jimmy";
let num: number = 24;
let bool: boolean = false;
let u: undefined = undefined;
let n: null = null;
let obj: object = {x: 1};
let big: bigint = 100n;
let sym: symbol = Symbol("me");

注意

null和undefined是所有类型的子类型，也就是说你可以把null和undefined赋值给其他类型，但是如果在tsconfig.json中指定了"stricNullChecks":true，null和undefined只能赋值给void和它们各自的类型
number和bigint

虽然两者都表示数字，但是这两个类型不兼容

let big: bigint =  100n;
let num: number = 6;
big = num;//！报错：不能将number分配给bigint
num = big;//！报错：不能将bigint分配给number

对象
数组

对数组的定义方式

//1.在某元素类型后面加上[]
//string[] 表示字符串数组
let m:string[];
m = ['a','b','c'];
//number[]表示数值数组

let p:number[];
//2.使用数组泛型
let j:Array<number>;

！！一些新的

任意类型 any 声明为any的变量可以赋予任意类型的值
unkown 表示未知类型的值，typescript推荐使用unkown，因为unkown是类型安全的

any与unkown的区别

any类型的可以赋值给任意变量；unknown实际上就是一个类型安全的any，不能直接赋值给其他变量

let a:unkown;
let b:any;
let k : boolean | string;
k = b;
k = a;//！会报错

元组元组类型用来表示已知元素数量和类型的数组，各元素的类型不必相同，对应位置的类型需要相同。

let x: [string, number];
x = ['Runoob', 1];    // 运行正常
x = [1, 'Runoob'];    // !报错
console.log(x[0]);    // 输出 Runoob

枚举 enum 枚举类型用于定义数值集合
枚举类型支持枚举值到枚举名的正、反向映射

enum Color {Red, Green, Blue};
let c: Color = Color.Blue;
console.log(c);    // 输出 2

泛型
我们需要一种方法使返回值的类型与传入参数的类型是相同的。这里，我们使用了类型变量，它是一种特殊的变量，只用于表示类型而不是值

function identity<T>(arg: T): T {
    return arg;
}

学习参考

void 用于表示方法返回值的类型，表示该方法没有返回值

function fn():void{
    return undefined;
    //return null;   会报错
}

never 表示永远不会返回结果，是其他类型（包括null和undefined）的子类型

function fn1():never{
    throw new Error('出错了！')
}

注意：参数名后加?:表示为可缺省参数

联合/交叉类型
联合类型 |表示一个值可以是几种类型之一
交叉类型 & 各种类型叠加到一起成为一种类型，它包含了所需的所有类型的特性