TypeScript の面接の質問

Jan 05, 2025 pm 01:44 PM

TypeScript Interview Questions

質問 - TypeScript とは何ですか?

  • TypeScript は Javascript のスーパーセットです
  • 静的型を追加して、コード品質の向上と実行前のエラーチェックを可能にします。
  • インターフェイス、列挙型、ジェネリックなどの機能をサポートします。
  • より優れたエラーチェック、強化されたツール、改善されたコードの可読性を提供します。

質問 - 明示的および暗黙的な型の割り当てとは何ですか?

  • 明示的とは、型を書き出すことを意味します。以下のように -

1

let firstName: string = "Rutvik";

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
  • 暗黙的とは、TypeScript が値に基づいて型を推測することを意味します。以下の型は数値とみなされます

1

let age = 23;

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - TypeScript の any、unknown、never の違いは何ですか?

  • any の型は、任意の型の変数を割り当てるために使用されます。
  • 別の型を割り当て直してもエラーにはなりません。

1

2

3

let x: any = 10;

x = 'hello'; // No TypeScript error

console.log(x.toUpperCase()); // No TypeScript error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
  • unknown 型は、値に対する操作を実行する前に型をチェックする必要があるため、any 型よりも優れています。

1

2

3

4

5

let y: unknown = 10;

// Type assertion needed before using y as number

if (typeof y === 'number') {

    console.log(y.toFixed(2));

}

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
  • 型は決して発生しない値を表すことはありません。
  • これは通常、正しく返されない関数の return ステートメントに使用されます。

1

2

3

function throwError(message: string): never {

    throw new Error(message);

}

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - 配列の型を指定するにはどうすればよいですか?

  • 配列を型指定するには、以下のように型を指定する必要があります。以下の例では、配列には文字列タイプのみを含めることができます。

1

2

const names: string[] = ["Rutvik", "Rohit", "Virat"];

names.push("Bumrah"); // no error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
  • 配列の変更を防ぐ readonly キーワードを使用することもできます。

1

2

const names: readonly string[] = ["Rutvik", "Rohit", "Virat"];

names.push("Bumrah"); // Error: Property 'push' does not exist on type 'readonly string[]'.

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - 配列の型推論とは何ですか?

  • 配列に型を指定しない場合、配列は自動的に型を推測します。

1

2

const numbers = [1, 2, 3]; // inferred to type number[]

numbers.push(4); // no error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - タプルとは何ですか?

  • これは、長さと型が事前定義された型配列です。
  • 異なる型の混合配列の型を与えるのに非常に便利です。

1

2

3

4

let ourTuple: [number, boolean, string];

 

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - 読み取り専用タプルとは何ですか?

  • タプルを読み取り専用にしない場合は、定義された項目にさらに項目を追加でき、TypeScript はエラーをスローしません。

1

2

3

4

5

6

let ourTuple: [number, boolean, string];

 

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

//No safety in indexes from 3

ourTuple.push('This is wrong');

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
  • ここで、これを修正するために、type の前にキーワード readonly を使用します。

1

2

3

4

5

let ourTuple: readonly [number, boolean, string];

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

// throws error as it is readonly

ourTuple.push('Coding Hero took a day off');

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - オブジェクトのタイプを指定するにはどうすればよいですか?

  • 別のオブジェクトのような構造を作成し、オブジェクト内のキーとキーのタイプを指定することで、オブジェクトのタイプを指定できます。

1

2

3

4

5

6

7

8

9

10

11

12

interface CarTypes {

    brand: string,

    model: string,

    year: number

}

 

 

const car: CarTypes = {

  brand: "Tata",

  model: "Punch",

  year: 2020

};

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - オブジェクトにオプションのプロパティを設定するにはどうすればよいですか?

  • オプションのプロパティまたはキーを指定するには、? を追加する必要があります。 t キーの後に。

1

let firstName: string = "Rutvik";

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - TypeScript の enum について説明してください。

  • 列挙型は定数である変数の一種です。その中の値のみを使用する必要があります。
  • 値はデフォルトでは数値であり、0 から始まり 1 ずつ増加します。
  • 数値または文字列ベースにすることができます

1

let age = 23;

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

1

2

3

let x: any = 10;

x = 'hello'; // No TypeScript error

console.log(x.toUpperCase()); // No TypeScript error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - 型エイリアスとは何ですか?

  • カスタム名で型を定義でき、文字列や数値などのすべてのプリミティブ型だけでなく、オブジェクトや配列などの複合型にも使用できます。

1

2

3

4

5

let y: unknown = 10;

// Type assertion needed before using y as number

if (typeof y === 'number') {

    console.log(y.toFixed(2));

}

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - インターフェースとは何ですか?

  • インターフェイスは型に似ていますが、オブジェクトに対してのみ使用できます。

1

2

3

function throwError(message: string): never {

    throw new Error(message);

}

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - インターフェイスを拡張するにはどうすればよいですか?

  • インターフェイスは、extend キーワードを使用して拡張できます。

1

2

const names: string[] = ["Rutvik", "Rohit", "Virat"];

names.push("Bumrah"); // no error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - Union タイプと Intersection タイプとは何ですか?

ユニオン:-

  • 共用体タイプは、プロパティが文字列や数値など、複数の値になる場合に使用されます。
  • このため、これらは OR とも呼ばれ、 | を使用して使用されます。シンボル。

1

2

const names: readonly string[] = ["Rutvik", "Rohit", "Virat"];

names.push("Bumrah"); // Error: Property 'push' does not exist on type 'readonly string[]'.

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

交差点:-

  • 交差タイプは、複数のタイプを 1 つに結合する場合に使用されます。
  • このため、AND とも呼ばれ、& 記号を使用して使用されます。

1

2

const numbers = [1, 2, 3]; // inferred to type number[]

numbers.push(4); // no error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - Typescript の関数とは何ですか?

関数で戻り値の型を指定するにはどうすればよいですか?

  • 関数名の後に : 記号を付けると、関数の戻り値の型を指定できます。

1

2

3

4

let ourTuple: [number, boolean, string];

 

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

関数でパラメータの型を指定するにはどうすればよいですか?

  • 各パラメータの後に : 記号を使用してパラメータの種類を指定することができます。

1

2

3

4

5

6

let ourTuple: [number, boolean, string];

 

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

//No safety in indexes from 3

ourTuple.push('This is wrong');

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

関数にオプション、デフォルト、残りのパラメータを与えるにはどうすればよいですか?

  • デフォルトのパラメータを使用すると、パラメータをオプションとしてマークできます。このように、c はオプションであり、? で示されます。

1

2

3

4

5

let ourTuple: readonly [number, boolean, string];

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

// throws error as it is readonly

ourTuple.push('Coding Hero took a day off');

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
  • デフォルト値 (ES6 の機能) はタイプの後に続きます。

1

2

3

4

5

6

7

8

9

10

11

12

interface CarTypes {

    brand: string,

    model: string,

    year: number

}

 

 

const car: CarTypes = {

  brand: "Tata",

  model: "Punch",

  year: 2020

};

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
  • 残りのパラメータ (ES6 機能) は、渡された項目を配列に変換するため、配列の型が与えられます。

1

2

3

4

5

6

7

8

9

10

interface CarTypes {

    brand: string,

    model: string,

    year?: number

}

 

const car: CarTypes = {

  brand: "Tata",

  model: "Punch"

};

ログイン後にコピー
ログイン後にコピー

質問 - TypeScript のキャストとは何ですか?

  • キャストは、変数の型をオーバーライドするプロセスです。
  • 以下の例のように、型は不明ですが、as キーワードを使用すると文字列になります。

1

2

3

4

5

6

7

8

enum Direction {

  Up = 1,

  Down,

  Left,

  Right,

}

console.log(Direction.Up); // 1

console.log(Direction.Down); // 2

ログイン後にコピー
ログイン後にコピー
  • <> も使用できます。としての代わりに。どちらも同じ意味です。

1

let firstName: string = "Rutvik";

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - TypeScript のジェネリックとは何ですか?

  • Typeascript のジェネリックを使用すると、複数のデータ型を処理できる再利用可能なコンポーネントまたは命令を作成できます。

1

let age = 23;

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

質問 - Typescript のユーティリティ型?

  • TypeScript は、一般的な型変換を簡素化するユーティリティ型を提供します。
  • これらの型により、オブジェクトおよびインターフェイス型の操作と対話が容易になります。
  • 一般的に使用されるいくつかのユーティリティ タイプの内訳を次に示します。

1. 部分的

  • タイプ T のすべてのプロパティをオプションにします。
  • ユースケース: 一部のプロパティのみが必要なオブジェクトを作成する場合。

1

2

3

let x: any = 10;

x = 'hello'; // No TypeScript error

console.log(x.toUpperCase()); // No TypeScript error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

2. 必須

  • タイプ T のすべてのプロパティを必須にします。
  • 使用例: すべてのプロパティが存在する必要があることを強制したい場合。

1

2

3

4

5

let y: unknown = 10;

// Type assertion needed before using y as number

if (typeof y === 'number') {

    console.log(y.toFixed(2));

}

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

3. 読み取り専用

  • タイプ T のすべてのプロパティを読み取り専用にします。
  • 使用例: オブジェクトのプロパティが変更できないようにするため。

1

2

3

function throwError(message: string): never {

    throw new Error(message);

}

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

4.ピック

  • 型 T からプロパティ K のセットを選択して型を作成します。
  • ユースケース: 型の特定のプロパティのみが必要な場合。

1

2

const names: string[] = ["Rutvik", "Rohit", "Virat"];

names.push("Bumrah"); // no error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

5.省略

  • 型 T からプロパティ K のセットを省略して型を作成します。
  • ユースケース: 特定のプロパティを除くすべてのプロパティが必要な場合。

1

2

const names: readonly string[] = ["Rutvik", "Rohit", "Virat"];

names.push("Bumrah"); // Error: Property 'push' does not exist on type 'readonly string[]'.

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

6. 記録

  • キー K と型 T の値を使用して型を構築します。
  • 使用例: 固定キーと一​​貫した値タイプを持つオブジェクト タイプを作成します。

1

2

const numbers = [1, 2, 3]; // inferred to type number[]

numbers.push(4); // no error

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

7.除外する

  • U に割り当て可能なすべての型を型 T から除外します。
  • 使用例: 特定のタイプをフィルタリングして除外します。

1

2

3

4

let ourTuple: [number, boolean, string];

 

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

8. 抽出

  • 型 T から U に割り当て可能な型のみを抽出します。
  • 使用例: タイプを特定のサブセットに絞り込むため。

1

2

3

4

5

6

let ourTuple: [number, boolean, string];

 

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

//No safety in indexes from 3

ourTuple.push('This is wrong');

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

9.Null不可

  • 型 T から null と unknown を除外します。
  • 使用例: 値が null または未定義でないことを確認します。

1

2

3

4

5

let ourTuple: readonly [number, boolean, string];

// initialize correctly

ourTuple = [5, false, 'Coding Hero was here'];

// throws error as it is readonly

ourTuple.push('Coding Hero took a day off');

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

10. 戻り値の型

  • 関数型の戻り値の型を推論します。
  • 使用例: 関数の戻り値の型をキャプチャして使用します。

1

2

3

4

5

6

7

8

9

10

11

12

interface CarTypes {

    brand: string,

    model: string,

    year: number

}

 

 

const car: CarTypes = {

  brand: "Tata",

  model: "Punch",

  year: 2020

};

ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

11. インスタンスタイプ

  • コンストラクター関数型 T のインスタンス型で構成される型を構築します。
  • 使用例: クラス インスタンスの型を取得します。

1

2

3

4

5

6

7

8

9

10

interface CarTypes {

    brand: string,

    model: string,

    year?: number

}

 

const car: CarTypes = {

  brand: "Tata",

  model: "Punch"

};

ログイン後にコピー
ログイン後にコピー

12. パラメータ

  • 関数型のパラメータの型を抽出します。
  • 使用例: 関数のパラメーターの型を再利用する。

1

2

3

4

5

6

7

8

enum Direction {

  Up = 1,

  Down,

  Left,

  Right,

}

console.log(Direction.Up); // 1

console.log(Direction.Down); // 2

ログイン後にコピー
ログイン後にコピー

以上がTypeScript の面接の質問の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

JavaScriptの文字列文字を交換します JavaScriptの文字列文字を交換します Mar 11, 2025 am 12:07 AM

JavaScript文字列置換法とFAQの詳細な説明 この記事では、javaScriptの文字列文字を置き換える2つの方法について説明します:内部JavaScriptコードとWebページの内部HTML。 JavaScriptコード内の文字列を交換します 最も直接的な方法は、置換()メソッドを使用することです。 str = str.replace( "find"、 "置換"); この方法は、最初の一致のみを置き換えます。すべての一致を置き換えるには、正規表現を使用して、グローバルフラグGを追加します。 str = str.replace(/fi

jQuery日付が有効かどうかを確認します jQuery日付が有効かどうかを確認します Mar 01, 2025 am 08:51 AM

単純なJavaScript関数は、日付が有効かどうかを確認するために使用されます。 関数isvaliddate(s){ var bits = s.split( '/'); var d = new Date(bits [2] '/' bits [1] '/'ビット[0]); return !!(d &&(d.getmonth()1)== bits [1] && d.getdate()== number(bits [0])); } //テスト var

jQueryは要素のパディング/マージンを取得します jQueryは要素のパディング/マージンを取得します Mar 01, 2025 am 08:53 AM

この記事では、jQueryを使用して、DOM要素の内側のマージン値とマージン値、特に外側の縁と要素の内側の縁の特定の位置を取得して設定する方法について説明します。 CSSを使用して要素の内側と外側の縁を設定することは可能ですが、正確な値を取得するのは難しい場合があります。 // 設定 $( "div.header")。css( "margin"、 "10px"); $( "div.header")。css( "padding"、 "10px"); このコードはそうだと思うかもしれません

10 jQuery Accordionsタブ 10 jQuery Accordionsタブ Mar 01, 2025 am 01:34 AM

この記事では、10個の例外的なjQueryタブとアコーディオンについて説明します。 タブとアコーディオンの重要な違いは、コンテンツパネルの表示方法と非表示にあります。これらの10の例を掘り下げましょう。 関連記事:10 jQueryタブプラグイン

10 jqueryプラグインをチェックする価値があります 10 jqueryプラグインをチェックする価値があります Mar 01, 2025 am 01:29 AM

ウェブサイトのダイナミズムと視覚的な魅力を高めるために、10の例外的なjQueryプラグインを発見してください!このキュレーションされたコレクションは、画像アニメーションからインタラクティブなギャラリーまで、多様な機能を提供します。これらの強力なツールを探りましょう。 関連投稿: 1

ノードとHTTPコンソールを使用したHTTPデバッグ ノードとHTTPコンソールを使用したHTTPデバッグ Mar 01, 2025 am 01:37 AM

HTTP-Consoleは、HTTPコマンドを実行するためのコマンドラインインターフェイスを提供するノードモジュールです。 Webサーバー、Web Servに対して作成されているかどうかに関係なく、HTTPリクエストで何が起こっているかをデバッグして正確に確認するのに最適です

カスタムGoogle検索APIセットアップチュートリアル カスタムGoogle検索APIセットアップチュートリアル Mar 04, 2025 am 01:06 AM

このチュートリアルでは、カスタムGoogle検索APIをブログまたはWebサイトに統合する方法を示し、標準のWordPressテーマ検索関数よりも洗練された検索エクスペリエンスを提供します。 驚くほど簡単です!検索をyに制限することができます

jQueryはscrollbarをdivに追加します jQueryはscrollbarをdivに追加します Mar 01, 2025 am 01:30 AM

次のjQueryコードスニペットを使用して、Divコンテンツがコンテナ要素領域を超えたときにスクロールバーを追加できます。 (デモンストレーションはありません、それを直接firebugにコピーしてください) // d =ドキュメント // w =ウィンドウ // $ = jQuery var contentarea = $(this)、 wintop = contentarea.scrolltop()、 docheight = $(d).height()、 winheight = $(w).height()、 divheight = $( '#c

See all articles