这是我参与11月更文挑战的第15天,活动详情查看:2021最后一次更文挑战
前言
如今 TypeScript 应用特别广了,如果不学习, 总感觉跟不上大厂的步伐了. 学习 TypeScript
(当然也是可选的). 这里记录学习 TypeScript
的过程, 收录在 TypeScript 实战专栏
回顾上一篇: 学习了 TS 的初始化, 安装, 创建 TS 项目, 编译运行以及初识 TS 类型约束的世界: TypeScript 原始数据类型 各个击破
1. Typescript 文档
Typescript 官网地址: www.typescriptlang.org/zh/
Typescript 文档地址:Basic Types
TypeScript 其他常见类型(特色)
上一篇学习了 TypeScript 的原始类型, 和 JavaScript 差不多比较基础的, 当然 TypeScript 以类型约束著称(算是这样个人理解的吧), 还有其他特色的类型:
-
any 比如
any
any "大发好, 可不能贪用", 不然那就和 anyScript 差不多了. 但是对于最初开始学习 TS 还是可以用用的, 比方说一些不确定的类型 -
unknown
-
never 类型系统中的底部类型
当然还有用的比较多的非原始类型, 当然这些类型多少和 JavaScript 中的比较类似的: 如下
- object
- Array
- Tuple
any
let iamnotsure: any = 213
iamnotsure = 'and i maybe a string'
如上代码: 有时候可能要为那些在开发阶段还不清楚类型的变量指定一个类型,
unknown
unknown
是 TypeScript 3.0
引入了新类型, 是 any
类型对应的安全类型。
虽然它和 any
都可以是任何类型, 但是当 unknown 类型被确定是某个类型之前,它不能被进行任何操作比如实例化、getter、函数执行等等
let unknownValue: unknown
unknownValue[2][1][3] // ERROR
unknownValue.foo.bar // ERROR
unknownValue() // ERROR
new unknownValue() // ERROR
never
never 类型表示的是那些永不存在的值的类型, never 类型是任何类型的子类型, 也可以赋值给任何类型; 没有类型是 never 的子类型或可以赋值给 never 类型(除了 never 本身之外)。而且 any
也不可以赋值给 never
...
never 比较常见的两个场景 :
// 空数组, 而且永远是空的
const empty: never[] = []
// 抛出异常的函数永远不会有返回值
function throwError(msg: string): never {
throw new Error(msg)
}
数组
数组在熟悉不过了. 它有两种类型定义方式, 一种是使用泛型:
const arr: Array<number> = [1, 2, 3]
另一种使用更方便的就是在元素类型后面直接跟上 []:
const arr: number[] = [1, 2, 3]
元组(Tuple)(定制化数组)
元组类型: 个人理解就是元素可指定类型定制化数组
, 与数组类型差不多相似, 元组表示一个已知元素数量和类型的数组, 各元素的类型不必相同(可定义)
let x: [string, number]
x = ['hello', 10, false] // Error
x = [10, 'hello'] // Error
我们看到, 这就是元组与数组的不同之处, 元组的类型如果多出或者少于规定的类型是会报错的, 必须严格跟事先声明的类型一致才不会报错。
元组中包含的元素, 必须与声明的类型一致, 而且不能多、不能少, 甚至顺序不能不符。
元组继承于数组, 但是比数组拥有更严格的类型检查。
Object
object 表示非原始类型, 也就是除 number, string, boolean, symbol, null 或 undefined 之外的类型。
enum Direction {
Center = 1,
}
let value: object
value = Direction
value = [1]
value = [1, 'hello']
value = {}
以上: 普通对象、枚举、数组、元组都是 object
Vue3 学习实战系列更文:
- Vue3 源码学习-工具函数 utils(二)
- Vue3-初体验,
- Vue3-
生命周期
和setup()函数
, - Vue3-
computed & watch
, - Vue3-
Teleport
改变组件挂载的根节点, - Vue3-
Suspense
处理异步请求, - Vue3-
defAsyncComponent
异步组件(新增), - Vue3-
fragments
(新增), - Vue3-
v-model
(非兼容),
- Vue3 源码仓库
vue-next
: github.com/vuejs/vue-n… - Vue3.x 官方中文文档: v3.cn.vuejs.org
- TypeScript 系列: