本文介绍 TypeScript 中元组与数组的定义及区别，重点解析 as const 类型断言的作用。as const 并非强制转换，而是告知编译器推断最具体类型，编译后完全移除，不影响运行时。通过示例展示其在保持字面量类型和简化类型别名中的应用。
一、元组与数组
在 TypeScript 中，元组用于表示元素类型不同的数组。简而言之，若一组数据具有相同的类型，则定义为数组；若类型不同，则定义为元组。数组的 API（如 push、pop 等）对元组同样适用，主要区别在于类型约束。
1、数组的定义
//定义数组的方式
let arr: number[] = [1, 2, 3]; //第一种： 必须全部是number类型；
let arr2: Array<number> = [1, 2, 3]; // 第二种
let arr3: Array<number> = new Array(4); // 第三种：表示定义一个数组的长度，一般固定一个数组的长度时这个方法比较方便
let arr4 = new Array<number>(4); //这种写法和 arr3 效果是一样的
console.log(arr3.length);
// interface 定义
interface NumberArray {
[index: number]: number;
}
let arr5: NumberArray = [1, 2, 3];
//类数组
function sum() {
let args: IArguments = arguments;
// args.callee()
}
2、元组的定义
// 类型固定的元组
// let arrAny: any[] = [1, 'TEST']; 奇葩且没有意义的写法，不推荐
let tuple1: [number, string, boolean] = [1, 'TEST', false];
// 数组和元组的区别
// 利用函数动态拼合一个元组
function useFetch() {
const response: string = "Barry";
const age: number = 25;
return [response, age] as const;
}
// 这里如果不使用 as const 会发现 我们结构出来的数组类型是response: string | number
// 使用完 as const 以后 为string，as const 也叫类型断言
const [response] = useFetch() // 发现 const response: string | number
// 数组转化元组 泛型
function useFetch2() {
const response: string = "Barry";
const age: number = 25;
return tuplify(response, age)
}
function tuplify<T extends unknown[]>(...elements: T): T {
return elements;
}三、as const
1.不强制类型转换
as const 被称为 const 类型断言。它指示编译器将表达式推断为最具体的类型。若不使用该断言，编译器会采用默认的类型推断行为，可能导致表达式被推断为更通用的类型。
需注意，这里的 const 属于类型断言而非强制转换。在 TypeScript 编译过程中，const 类型断言会从生成的 JavaScript 代码中完全移除。因此，无论是否使用 as const，应用程序在运行时无任何区别。
因此，as const 仅用于帮助编译器更准确地理解代码意图，从而更精确地识别正确与错误的代码。
stack overflow : What does the "as const" mean in TypeScript and what is its use case?
https://stackoverflow.com/questions/66993264/what-does-the-as-const-mean-in-typescript-and-what-is-its-use-case
2.强制类型转换
// 强制类型转换
function getLength(str: string | number): number {
// if((<String>str).length) 上下两种方式
if ((str as string).length) {
return (<String>str).length
} else {
return str.toString().length;
}
}3.类型别名
// 类型别名
type Name = string;
type NameResolver = () => string;
type NameOrResolver = Name | NameResolver;
function getName(n: NameOrResolver): Name {
if (typeof n === 'string') {
return n
}
}
// interface 实现 类型
interface A {
}
function helper(options: A): A {
return options
}到此这篇关于TypeScript之元组、数组以及as const的文章就介绍到这了,更多相关TypeScript 元组、数组以及as const内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！