TS学习笔记之基础数据类型

基础数据类型

js的数据类型在ts中都有与之对应的类型。

ini 复制代码

const temp1: string = 'jack';
const temp2: number = 1;
const temp3: boolean = true;
const temp4: undefined = undefined;
const temp5: null = null;
const temp6: object = { name: 'jack' };
const temp7: symbol = Symbol('jack');
const temp8: bigint = 111111n;

值得注意的的是在关闭strictNullChecks后, null和undefined被看做是其它类型的子类，可以赋值给任意类型的变量。

ini 复制代码

const temp8: string = undefined;
const temp9: number = null;
const temp10: null = undefined;
const temp11: undefined = null;

void

void类型用于表示函数的返回值为空或者没有返回值

javascript 复制代码

function foo():void{};
function bar():void{return};
function min():void { return void 0 };
function sider():void { return undefined };

数组类型

数组有两种声明方式

ini 复制代码

const arr: string[] = [];
const arr1: Array<string> = [];

对于长度固定的数组来说，可以使用元祖类型进行声明，当访问越界的时候ts会给出警告提示。

ini 复制代码

// 数组显式越界
const arr2: number[] = [1,2,3];
const tupe2: [number,number,number] = [1,2,3];
arr[5]; //undefiend
tupe2[5]; //长度为 "3" 的元组类型 "[number, number, number]" 在索引 "5" 处没有元素

// 隐式越界
const [a,b,c,d] = tupe2; //长度为 "3" 的元组类型 "[number, number, number]" 在索引 "3" 处没有元素。ts(249

对象类型

对象类型的声明可以使用interface和type

typescript 复制代码

interface  User{
    account: string,
    readonly modifyDate: string, // 只读
    avatorUrl?: string; // 可选属性
}
// 类型别名
type Book = {name: string, readonly price: number,  author?: string };

interface和type在功能相近，很多场景可以替换使用，比较推荐的做法是使用interface声明类和对象的结构，使用类型别名声明函数、联合类型、类型体操等更复杂的场景。除此之外type和interface在功能上也有一些差异： type中可以使用联合类型，多个同名interface会进行合并

kotlin 复制代码

interface Book{
    name: string;
}

interface Book{
    price: number;
}

const JsBook: Book = { name: "JavaScript", price: 28}

Object、object以及{}

在javascript中object是原型链的顶端，而在ts中Objcet包含所有类型

ini 复制代码

const tem1: Object = 1;
const tem2: Object = 'str';
const tem3: Object = {name:'jack'};
const tem4: Object = [];
const tem5: Object = () => {}

object 类型在ts中才是真正和js中的object对应的, 我们知道在js中数组、对象、函数、都是属于object类型，因此你可以使用object类型声明数组、对象和函数。

ini 复制代码

const obj1: object = { name: 'jack' };
const obj2: object =[];
const obj3: object = ()=>{};
const obj4: object = 1; //不能将类型"number"分配给类型"object"

所以应该使用object去声明一个对象类型而不是Object, 类似的还有 String、Number、Boolean等装箱类型，它们也包含类一些超出预期的类型，所以任何情况下都不要使用这些装箱类型。

{}使用字面量声明类一个空的对象。

字面量类型

字面量类型可以更精准的定义类型。字面量类型有字符字面量类型、数字字面量类型和布尔字面量类型、对象字面量类型等。

ini 复制代码

let tem1: 'jack' = 'jack';

let tem2: 8 = 8;

let tem3: false = false;

interface tem4 {
  name: 'jack',
  age: 21,
}

联合类型和交叉类型

前面我们讲到在类型别名中可以使用联合类型和交叉类型。联合类型的操作符是 "|", 可以理解为js中的||(逻辑或)，只要满足其中的一个类型就符合这个联合类型。而交叉类型则对应js中的&&(逻辑与), 会将多个类型进行合并，合并后的每个类型都要满足才算符合这个交叉类型。

ini 复制代码

// 联合类型
type Code = 1001 | 1002 | 1003;
type Name = 'jack' | 'rose' | 'lucy';
type Users = { type: 'common' } | { type: 'vip' };
type Bol1 = true | false; // boolean

// 交叉类型
type UserCommon = { name: string } & { age: number };
const user1: UserCommon = { name: 'jack', age: 21 };
type Bol2 = false & true; //never

枚举

枚举类型和对象类型的区别是，枚举类型是双向映射的，可以通过成员属性访问枚举值，也可以通过枚举值访问成员属性

arduino 复制代码

enum Colors {
  red, // 0
  green, // 1
  yeellow, // 2
  blue,//3
  pink,// 4
}

enum Books {
  JavaScript, // 0
  TypeScript, // 200
  Java, // 201
  Ruby,//202
  Python,// 203
}

console.log(Colors.red);// 0
console.log(Colors[0]); // red

还可以声明常量枚举，常量枚举只能通过成员属性访问值，而不能通过枚举值访问成员。

arduino 复制代码

// 常量枚举
const enum Colors {
  red, // 0
  green, // 1
  yeellow, // 2
  blue,//3
  pink,// 4
}

console.log(Colors.red);// 0
console.log(Colors[0]); // 报错：只有使用字符串文本才能访问常数枚举成员