【02】基础知识:typescript数据类型

1、布尔类型 boolean

javascript 复制代码
let flag: boolean = false

2、数字类型 number

javascript 复制代码
let num: number = 6 //十进制
let num2: number = 0xf00d //十六进制
let num3: number = 0b1010 //二进制
let num4: number = 0o744 //八进制

3、字符串类型 string

用双引号(")或单引号(')来表示字符串类型。

模版字符串:可以定义多行文本和内嵌表达式,使用反引号(`)包围,并且以${ expr }这种形式嵌入表达式。

javascript 复制代码
let name: string = 'Tom'
let years: number = 5
let str: string = `Hello, my name is ${name}, I'm ${years + 1} years old.`

4、数组类型 array

ts定义数组分为两种方式,一种是在元素类型后面接 [],表示由此类型元素组成的数组;

另一种是使用数组泛型,Array<元素类型>。

javascript 复制代码
let arr: number[] = [1, 2, 3] // 在元素类型后面加上[]
let arr2: Array<string> = ['1', '2'] //使用数组泛型
let arr3: any[] = [1, "Tom"]

5、元组类型 tuple

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

javascript 复制代码
let x: [string, number]
x = ['hello', 6] //运行正常
x = [6, 'hello'] //报错
console.log(x[0]) //输出hello

6、枚举类型 enum

枚举类型用于定义数值集合。(定义更多的其他非数值类型的数据)

定义:

enum 枚举名称 {

标识符[=整型常数],

...

}

javascript 复制代码
enum Color { Red, Green, Blue }
let c: Color = Color.Red
console.log(c)  // 输出 0,如果枚举类型没有赋值,那么输出的就是下标

enum Color { Red = 1, Green, Blue }
let colorName: string = Color[2] 
// 如果前一个赋值,后面没有赋值,那么后面会根据前面赋值,往后+1
console.log(colorName)  // 显示'Green'因为上面代码里它的值是2

7、任意类型 any

javascript 复制代码
let num:any = 1
num = false // 修改值类型,不会报错

let box = document.getElementById('box')  // 可以运行代码,但是会报错
let box: any = document.getElementById('box')  // 可以运行代码,也不会报错
box.style.color = 'red'

8、void 类型

void 类型表示没有任何类型。一般用户定义方法时方法没有返回值。

javascript 复制代码
function run(): void {
	console.log('方法没有返回任何类型')
}

function run(): number {
	return 1 // 方法返回类型为 number
}

9、null 和 undefined

null 和 undefined 两者各自有自己的类型分别叫做 null 和 undefined。

javascript 复制代码
let u: undefined = undefined
let n: null = null

默认情况下 null 和 undefined 是所有类型的子类型。 就是说你可以把 null 和 undefined 赋值给 number 类型的变量。

然而,当你指定了 --strictNullChecks 标记,null 和 undefined 只能赋值给 void 和它们各自。 这能避免很多常见的问题。 也许在某处你想传入一个 string 或 null 或 undefined,你可以使用联合类型 string | null | undefined。

javascript 复制代码
let num: number // 输出 undefined,会报错
let num: undefined // 输出 undefined,不会报错

// 一个变量可能是 number类型,可能是 undefined 类型
let num: number | undefined // 定义未赋值,输出 undefined,不会报错
num = 3 // 输出3,不会报错

console.log(num) 

10、never类型

never 类型表示从不会出现的值, never 类型是任何类型的子类型。

声明为 never 的变量只能被 never 类型所赋值。

javascript 复制代码
// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
	throw new Error(message)
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
	while (true) {
	}
}
相关推荐
minDuck4 分钟前
ruoyi-vue集成tianai-captcha验证码
java·前端·vue.js
小政爱学习!25 分钟前
封装axios、环境变量、api解耦、解决跨域、全局组件注入
开发语言·前端·javascript
魏大帅。30 分钟前
Axios 的 responseType 属性详解及 Blob 与 ArrayBuffer 解析
前端·javascript·ajax
花花鱼36 分钟前
vue3 基于element-plus进行的一个可拖动改变导航与内容区域大小的简单方法
前端·javascript·elementui
k093340 分钟前
sourceTree回滚版本到某次提交
开发语言·前端·javascript
EricWang13581 小时前
[OS] 项目三-2-proc.c: exit(int status)
服务器·c语言·前端
September_ning1 小时前
React.lazy() 懒加载
前端·react.js·前端框架
web行路人1 小时前
React中类组件和函数组件的理解和区别
前端·javascript·react.js·前端框架
番茄小酱0011 小时前
Expo|ReactNative 中实现扫描二维码功能
javascript·react native·react.js
子非鱼9212 小时前
【Ajax】跨域
javascript·ajax·cors·jsonp