sunnyxujian's blog sunnyxujian's blog
首页
  • JavaScript
  • CSS
  • HTML和浏览器
  • Vue
  • Vue3
  • React
  • 基础知识
  • webpack
  • rollup
  • vite
  • 其他
  • Nodejs
  • 网络
  • TypeScript
  • 架构设计
  • 性能优化
  • 数据结构和算法
  • JavaScript教程 笔记
  • ES6 教程 笔记
  • TypeScript 从零实现 axios
  • Git学习 笔记
  • 渲染器原理
  • TypeScript 笔记
  • 技术文档
  • GitHub技巧
  • 博客搭建
  • 网站
  • 资源
  • Vue资源
  • 友情链接
  • 分类
  • 标签
  • 归档
  • 友链
  • 关于
GitHub (opens new window)

xujian

劝君惜取少年时。
首页
  • JavaScript
  • CSS
  • HTML和浏览器
  • Vue
  • Vue3
  • React
  • 基础知识
  • webpack
  • rollup
  • vite
  • 其他
  • Nodejs
  • 网络
  • TypeScript
  • 架构设计
  • 性能优化
  • 数据结构和算法
  • JavaScript教程 笔记
  • ES6 教程 笔记
  • TypeScript 从零实现 axios
  • Git学习 笔记
  • 渲染器原理
  • TypeScript 笔记
  • 技术文档
  • GitHub技巧
  • 博客搭建
  • 网站
  • 资源
  • Vue资源
  • 友情链接
  • 分类
  • 标签
  • 归档
  • 友链
  • 关于
GitHub (opens new window)
  • Nodejs

  • 网络

  • TypeScript

    • 搭建TypeScript环境
    • 基础类型
      • 一.布尔、数字、字符串类型
      • 二.元组类型
      • 三.数组
      • 四.枚举类型
      • 五.any类型
      • 六.null 和 undefined
      • 七.void类型
      • 八.never类型
      • 九.Symbol类型
      • 十.BigInt类型
      • 十一.object对象类型
    • TS类型推导
  • 架构设计

  • 性能优化

  • 数据结构和算法

  • 进阶
  • TypeScript
xujian
2022-11-18

基础类型

# 2.基础类型

TS中冒号后面的都为类型标识

# 一.布尔、数字、字符串类型

let bool:boolean = true;
let num:number = 10;
let str:string = 'hello zf';
1
2
3

# 二.元组类型

限制长度个数、类型一一对应

let tuple:[string,number,boolean] = ['zf',10,true];
// 像元组中增加数据,只能增加元组中存放的类型
tuple.push('回龙观');
1
2
3

# 三.数组

声明数组中元素数据类型

let arr1:number[] = [1,2,3];
let arr2:string[] = ['1','2','3'];
let arr3:(number|string)[] = [1,'2',3];
let arr4:Array<number | string> = [1,'2',3]; // 泛型方式来声明
1
2
3
4

# 四.枚举类型

enum USER_ROLE {
    USER, // 默认从0开始
    ADMIN,
    MANAGER
}
// {0: "USER", 1: "ADMIN", 2: "MANAGER", USER: 0, ADMIN: 1, MANAGER: 2}
1
2
3
4
5
6

可以枚举,也可以反举

// 编译后的结果
(function (USER_ROLE) {
    USER_ROLE[USER_ROLE["USER"] = 0] = "USER";
    USER_ROLE[USER_ROLE["ADMIN"] = 1] = "ADMIN";
    USER_ROLE[USER_ROLE["MANAGER"] = 2] = "MANAGER";
})(USER_ROLE || (USER_ROLE = {}));
1
2
3
4
5
6
  • 异构枚举

    enum USER_ROLE {
        USER = 'user',
        ADMIN = 1,
        MANAGER,
    }
    
    1
    2
    3
    4
    5
  • 常量枚举

    const enum USER_ROLE {
        USER,
        ADMIN,
        MANAGER,
    }
    console.log(USER_ROLE.USER)// console.log(0 /* USER */);
    
    1
    2
    3
    4
    5
    6

# 五.any类型

不进行类型检测

let arr:any = ['jiagou',true,{name:'zf'}]
1

# 六.null 和 undefined

任何类型的子类型,如果strictNullChecks的值为true,则不能把null 和 undefined付给其他类型

let name:number | boolean;
name = null;
1
2

# 七.void类型

只能接受null,undefined。一般用于函数的返回值

let a:void;
a = undefined;
1
2

严格模式下不能将null赋予给void

# 八.never类型

任何类型的子类型,never代表不会出现的值。不能把其他类型赋值给never

function error(message: string): never {
    throw new Error("err");
}
function loop(): never {
    while (true) { }
}
function fn(x:number | string){
    if(typeof x == 'number'){

    }else if(typeof x === 'string'){

    }else{
        console.log(x); // never
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# 九.Symbol类型

Symbol表示独一无二

const s1 = Symbol('key');
const s2 = Symbol('key');
console.log(s1 == s2); // false
1
2
3

# 十.BigInt类型

const num1 = Number.MAX_SAFE_INTEGER + 1;
const num2 = Number.MAX_SAFE_INTEGER + 2;
console.log(num1 == num2)// true


let max: bigint = BigInt(Number.MAX_SAFE_INTEGER)
console.log(max + BigInt(1) === max + BigInt(2))
1
2
3
4
5
6
7

number类型和bigInt类型是不兼容的

# 十一.object对象类型

object表示非原始类型

let create = (obj:object):void=>{}
create({});
create([]);
create(function(){})
1
2
3
4
编辑 (opens new window)
上次更新: 2022/11/18, 18:18:56
搭建TypeScript环境
TS类型推导

← 搭建TypeScript环境 TS类型推导→

最近更新
01
😍Vue3和React都在用的函数式编程,学起来~
02-03
02
链表
11-24
03
搭建TypeScript环境
11-18
更多文章>
Theme by Vdoing | Copyright © 2020-2023 xujian | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式