[解決済み] TypeScriptの「as const」の意味とその使用例とは？

質問

について混乱しています。 as const キャストを使用します。いくつかのドキュメントやビデオを確認しましたが、完全には理解できませんでした。

私の懸念は as const 下記のコードの意味と、これを使うメリットは何でしょうか？

const args = [8, 5] as const;
const angle = Math.atan2(...args);
console.log(angle);

解決方法は？

として知られています。 const アサーション . A const アサーションは、コンパイラに 最も狭い ^* または 最も具体的 を式に使用することができます。 このオプションをオフにすると、コンパイラはデフォルトの型推論を使用し、結果として より広い または より一般的 タイプになります。

これは、quot;assertion" と呼ばれ、quot;cast" と呼ばれないことに注意してください。 TypeScriptでは一般的に"cast"という用語は避けるべきとされている。"cast"という場合、実行時に観察できる何らかの効果を意味することが多いが、TypeScriptの型システム（タイプアサーションと const アサーションは、完全に 消去 を生成したJavaScriptから削除します。 ですから、以下のような違いは全くありません。 実行時 を使用するプログラムと as const とそうでないものがあります。

コンパイル時には、顕著な差が出ますが。 では、次のような場合にどうなるか見てみましょう。 as const を、上の例のようにします。

const args = [8, 5];
// const args: number[]
const angle = Math.atan2(...args); // error! Expected 2 arguments, but got 0 or more.
console.log(angle);

コンパイラは const args = [8, 5]; の型を推論し number[] . これは，0個以上の要素からなる可変長の配列で，型は number . コンパイラは いくつ または どの の要素があります。 このような推論は一般に妥当なものです。多くの場合、配列の内容は何らかの形で変更されることを意図しています。 もし誰かが args.push(17) または args[0]++ のようなタイプが喜ばれるでしょう。 number[] .

残念ながら次の行は Math.atan2(...args) というエラーが発生します。 その Math.atan2() 関数は正確に2つの数値引数を必要とします。 しかし、コンパイラが知っているのは args は、数値の配列であるということです。 要素が2つあることを完全に忘れてしまっているので、コンパイラはあなたが Math.atan2() は、正確に2つの引数が必要なときに、"0 or more"の引数で指定します。

というコードと比較してみてください。 as const :

const args = [8, 5] as const;
// const args: readonly [8, 5]
const angle = Math.atan2(...args); // okay
console.log(angle);

ここで、コンパイラは次のように推論します。 args は型 readonly [8, 5] ... a readonly タプル その値は、まさに数字である 8 と 5 の順で表示します。 具体的には args.length は正確に知られている 2 をコンパイラで実行します。

そして、これだけで次の行の Math.atan2() が動作します。 コンパイラは Math.atan2(...args) と同じです。 Math.atan2(8, 5) であり、有効な呼び出しである。

そしてまた、実行時には、何の違いもありません。どちらのバージョンも 1.0121970114513341 をコンソールに出力します。 しかし const アサーションは、静的型システムの他の部分と同様に、実行時に効果を発揮するものではありません。 その代わり、コンパイラに 意図 正しいコードとバグをより正確に区別することができます。

コードへのプレイグラウンドリンク

^{* これは、配列やタプル型には厳密には当てはまりません。 readonly 配列やタプルは、技術的には より広い はミュータブルバージョンより ミュータブル配列は readonly のような変異メソッドを持つことは知られていない。 push() 後者がそうであるのに対し}