【学习打卡】第49天 TypeScript(5)
2022/9/24 4:17:01
本文主要是介绍【学习打卡】第49天 TypeScript(5),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
数组类型
字面量表示和泛型表示
- 字面量
const arr: string[] = ['a', 'b'] const arr: (string | number)[] = [1, 2, 'a'] // 或者使用type type List = (string | number)[]; const arr: List = [1, 2, 'a']
- 泛型
const arr: Array<string> = ['a', 'b']; const arr: Array<string | number> = ['a', 'b', 1]; // 或者使用type type List = Array<string | number>; const arr2: List = ['a', 'b', 1];
readonly 只读修饰符
- readonly将使得数组不可以修改
function fn1(arr: readonly string[]) { arr.concat() arr.push() // 错误提示:不可以修改原数组 }
- readonly只能和字面量使用,不能和泛型一起使用
function fn1(arr: readonly Array<string>) { arr.concat(); } // 错误提示:'readonly' type modifier is only permitted on array and tuple literal types
Array泛型的底层原理的简单实现
interface selfArray<T> { [key: number]: T; length: number; pop: () => T | undefined push: (...items: T[]) => number } const arr: selfArray<string> = ['a', 'b', 'c']
元组类型
什么是元组
元组是指长度确定,每项类型确定的特殊的数组。
表示方法如下:
// right const tuple: [string, number] = ['a', 1] // wrong: 元组每项的类型都是确定好的 const tuple: [string, number] = [1, 'a']
readonly 只读修饰符
// wrong: readonly使得元组不可以修改 function fn1(arr: readonly [string, string]): string { arr[0] = 'c'; // 报错 return arr[0]; } fn1(['a', 'b']) // right: 元组解构的变量跟元组无关,可以修改 function fn2([x, y]: readonly [string, string]): string { x = 'c'; // 通过 return x + y; } fn2(['a', 'b'])
元组传参方式不同导致的问题
type Point = [number, number]; function getPoint([x, y]: Point): number { return x + y } // right getPoint([1, 2]) // wrong: point通过类型推断是number[],和元组类型不匹配 const point = [1, 2] getPoint(point); // 解决方法:给point加上元组类型 const point: Point = [1, 2] getPoint(point);
小结
- 数组的类型表示(字面量和泛型)
- 数组的泛型底层简单实现
- 元组的类型表示(字面量)
- 数组和元组的readonly 只读修饰符
这篇关于【学习打卡】第49天 TypeScript(5)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-15PingCAP 黄东旭参与 CCF 秀湖会议,共探开源教育未来
- 2024-05-13PingCAP 戴涛:构建面向未来的金融核心系统
- 2024-05-09flutter3.x_macos桌面os实战
- 2024-05-09Rust中的并发性:Sync 和 Send Traits
- 2024-05-08使用Ollama和OpenWebUI在CPU上玩转Meta Llama3-8B
- 2024-05-08完工标准(DoD)与验收条件(AC)究竟有什么不同?
- 2024-05-084万 star 的 NocoDB 在 sealos 上一键起,轻松把数据库编程智能表格
- 2024-05-08Mac 版Stable Diffusion WebUI的安装
- 2024-05-08解锁CodeGeeX智能问答中3项独有的隐藏技能
- 2024-05-08RAG算法优化+新增代码仓库支持,CodeGeeX的@repo功能效果提升