【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) {
	}
}
相关推荐
csdnLN17 分钟前
$.ajax() 对应事件done() 、fail()、always() 的用法
前端·javascript·ajax
甜味橘阳18 分钟前
echarts地图可视化展示
前端·javascript·echarts
bloxed1 小时前
前端文件下载多方式集合
前端·filedownload
余生H1 小时前
前端Python应用指南(三)Django vs Flask:哪种框架适合构建你的下一个Web应用?
前端·python·django
LUwantAC1 小时前
CSS(四)display和float
前端·css
cwtlw1 小时前
CSS学习记录20
前端·css·笔记·学习
界面开发小八哥1 小时前
「Java EE开发指南」如何用MyEclipse构建一个Web项目?(一)
java·前端·ide·java-ee·myeclipse
谢道韫6662 小时前
今日总结 2024-12-24
javascript·vue.js·elementui
一朵好运莲2 小时前
React引入Echart水球图
开发语言·javascript·ecmascript
米奇妙妙wuu2 小时前
react使用sse流实现chat大模型问答,补充css样式
前端·css·react.js