Readonly<[]> 和 ReadOnlyArray<> 之间的区别

Question

代码 1:

 let readonlyArray: ReadonlyArray<string | number> = ["test", 1, 1];

代码2：

let readonlyArray: Readonly<[string, number]> = ["test", 1, 1];

这两行代码似乎做的事情相似。我不知道将数组声明为 ReadOnly 和 ReadOnlyArray.

有什么区别

此外，哪一个最适合性能？为什么？

Answer 1

从性能的角度来看，两者之间应该没有任何区别，因为在运行time 类型被擦除并且相同的 javascript 将运行不管

这两种类型在编译时有根本的区别：

Readonly<T> - 是一种与 T 具有相同形状但所有属性都是只读的类型。在您的例子中，T 是元组类型 [string, number]，因此它将具有数组的所有属性以及索引 0 和 1。因此我们可以调用 push 方法，但是我们无法重新分配 concat 方法。

let readonlyArray: Readonly<[string, number]> = ["test", 1, 1];
readonlyArray.concat = ()=> {} // Not valid, concat is readonly 
readonlyArray.push(1); // This is valid 
readonlyArray[1] =  ""; // Invalid we cannot change a property by indexing 
readonlyArray[3] =  ""; // Valid as it was not in the original tuple type

编辑：从 3.4 开始，typescript 改变了映射类型在数组和元组上的行为，因此 Readonly<[string, number]> 现在等同于只读元组 readonly [string, number]，所以错误有点不同：

let readonlyArray: Readonly<[string, number]> = ["test", 1];
readonlyArray.concat = ()=> {} // Not valid, concat is readonly 
readonlyArray.push(1); // This is not invalid, no push method anymore
readonlyArray[1] =  ""; // Invalid we cannot change a property by indexing 
readonlyArray[3] =  ""; // Invalid now tuple length preserved

ReadonlyArray<T> 是一个真正的只读数组，没有任何可以更改数组的方法。在您的情况下，数组的任何项目都可以是 string 或 number:

let readonlyArray2: ReadonlyArray<string | number> = ["test", 1, 1];
readonlyArray2.concat = ()=> []; // Valid we can set the concat property on the object 
readonlyArray2.push(1) // No push method, invalid
readonlyArray2[1] =  ""; // Invalid it is read only 
readonlyArray2[3] =  ""; // Invalid it is read only

Answer 2

只读

Readonly<T>不一定是数组；期望任何类型 <T>
要使 Readonly 存储值数组，类型 <T> 应该是 [T]

不包含可变方法

let readonlyArray: Readonly<string| number> = ["test", 1, 1];    // not assignable

let readonlyArray: Readonly<[string| number]> = ["test", 1, 1]; // assignable

只读数组

ReadonlyArray 默认接受一个数组

包含可变方法

let readonlyArray: ReadonlyArray<string| number> = "test";      // not assignable

let readonlyArray: ReadonlyArray<string| number> = ["test"];   // assignable

Readonly<[]> 和 ReadOnlyArray<> 之间的区别

Difference between Readonly<[]> and ReadOnlyArray<>

readonly

typescript

只读

只读数组