TIL. TypeScript interface -9/21
9074 ワード
TypeScript-interface
-オプションの構成
インタフェースのすべてのプロパティは必須ではありません.
"option bags"
のようなモードを作成する場合、オプションのPropertyは、オブジェクト内のいくつかのPropertyのみを埋め込み、関数に渡すのに役立ちます.interface SquareConfig {
color?: string;
width?: number;
}
function createSquare(config: SquareConfig): {color: string; area: number} {
let newSquare = {color: "white", area: 100};
if (config.color) {
newSquare.color = config.color;
}
if (config.width) {
newSquare.area = config.width * config.width;
}
return newSquare;
}
let mySquare = createSquare({color: "black"});
オプションのプロパティを持つインタフェースは、他のインタフェースと同様に、オプションのプロパティは、宣言のプロパティ名の末尾に?
を付けて表示されます.オプションのプロパティの利点は、使用可能なプロパティを記述し、インタフェースに属さないプロパティを使用しないことです.
-読み取り専用プロパティ
一部のプロパティは、オブジェクトが最初に作成されたときにのみ変更できる必要があります.
property名の前に
readonly
を付けて指定できます.interface Point {
readonly x: number;
readonly y: number;
}
オブジェクトのテキストを割り当ててポイントを作成します.割り当て後にx,yを変更することはできません.let p1: Point = { x: 10, y: 20 };
p1.x = 5; // 오류!
readonly vs constreadonlyとconstで最も簡単な方法は、変数とpropertyを尋ねることです.変数はconst、propertyはreadonly
-超過プロセスのチェック
interface SquareConfig {
color?: string;
width?: number;
}
function createSquare(config: SquareConfig): { color: string; area: number } {
// ...
}
let mySquare = createSquare({ colour: "red", width: 100 });
createSquareのパラメータは色ではなく色で渡されることに注意してください.この場合、JavaScriptではこっそりエラーが発生します.
width propertyは適切で、色propertyがなく、追加の色propertyは重要ではないので、プログラムが正しく作成されていると思います.
ただし、TypeScriptは、このコードにエラーがある可能性があると考えています.
オブジェクト文字が別の変数に割り当てられたり、引数として渡されたりすると、特殊な処理が受け入れられ、超過属性チェック(overseproperty checking)が受け入れられます.
オブジェクトのテキストにターゲットタイプ(target type)にないアウトラインがある場合、エラーが発生します.
このチェックを回避する最も簡単な方法は、タイプブレークスルーを使用することです.
let mySquare = createSquare({ width: 100, opacity: 0.5 } as SquareConfig);
このように、異なるPropertyを持っている可能性があります.次のコードを見てください.interface SquareConfig {
color?: string;
width?: number;
[propName: string]: any;
}
上記のコードについては、このようなチェックを「避ける」ことを試みないほうがいいです.このメソッドは、メソッドとステータスを含むより複雑なオブジェクト文字で考慮できます.
しかし,ほとんどの超過プログラムエラーは実際のエラーである.
つまり、オプションパッケージなどで超過パーセンテージチェックの問題が発生した場合は、タイプ定義を変更する必要があります.
Reference
この問題について(TIL. TypeScript interface -9/21), 我々は、より多くの情報をここで見つけました https://velog.io/@cyheum/TIL.-TypeScript-interface-921テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol