typescript声明联合类型元组后加入新元素

Question

刚刚看ts的文档看到元组越界的时候，尝试了下

let x: [string, number];
x = ['hello', 10];
当访问一个越界的元素，会使用联合类型替代：
x[3] = 'world'; // OK, 字符串可以赋值给(string | number)类型
console.log(x[5].toString()); // OK, 'string' 和 'number' 都有 toString

x[6] = true; // Error, 布尔不是(string | number)类型

写到这里就会报错了，表示不能直接更改一个长度为2的数组的第三个索引值，试了下另一个教程的push方法，发现可以插入成功，但是依旧不能通过索引访问，也不能改变元组length属性

感到有些疑惑，ts是js超集，这里感觉不能直接改变数组元素呢，push之后元素已经插入了但是却访问不了该元素，又是怎么回事呢 求教

Answer 1

官方文档关于这一点上没有更新。

事实上在 Typescript 2.7（Fixed Length Tuples 一节中） 之后， Tuple 的定义已经变成了有限制长度的数组了。

interface NumStrTuple extends Array<number | string> {
    0: number;
    1: string;
    length: 2; // using the numeric literal type '2'
}

所以你不能再越界访问了。

Answer 2

typescript的静态类型并不属于强类型，就算声明约束为长度2的数组，它仍然可以push，因为它始终还是js。所以typescript能做的就是在你尽管对数组的操作超越了约束，它还是限制你继续在约束范围外进行其他操作。