React JS インタビューのトップ 70 の質問と回答

React のインタビューの質問と回答

ここでは、新人だけでなく経験豊富な候補者も夢の仕事に就くための ReactJ の面接の質問と回答を紹介します。

1) Reactjsとは何ですか?

React は、ユーザー インターフェイスの構築を簡単にする JavaScript ライブラリです。 Facebookによって開発されました。


2) React を使用しますか HTML?

いいえ、HTML に似た JSX を使用します。

無料 PDF ダウンロード: React インタビューの質問と回答


3) React が最初にリリースされたのはいつですか?

React は 2013 年 XNUMX 月に初めてリリースされました。


4) React の最も重大な欠点を XNUMX つ教えてください

  • React を Rails などの MVC フレームワークと統合するには、複雑な構成が必要です。
  • React では、ユーザーは MVC フレームワークへのユーザー インターフェイスの統合に関する知識を必要とします。

5) リアル DOM と仮想 DOM の違いを説明する

実際のDOM 仮想DOM
ゆっくり更新です。 更新が速くなります。
HTML から直接更新できます。 HTML を直接更新するために使用することはできません。
メモリを浪費しすぎます。 メモリ消費量が少なくなる
React JS インタビューの質問
React JS インタビューの質問

6) React の Flux コンセプトとは何ですか?

Facebook は、クライアント側 Web アプリケーションの開発に Flux アーキテクチャの概念を広く使用しています。 フレームワークやライブラリではありません。 これは、単に React と単方向データ フローの概念を補完する新しい種類のアーキテクチャです。


7) React における Redux という用語の定義

Redux はフロントエンド開発に使用されるライブラリです。 これは、アプリケーションの状態管理に使用される JavaScript アプリケーションの状態コンテナーです。 Redux で開発されたアプリケーションをさまざまな環境でテストして実行できます。


8) Redux の「ストア」機能とは何ですか?

Redux には、アプリケーションの状態全体を XNUMX か所に保存できる「ストア」と呼ばれる機能があります。 したがって、コンポーネントの状態はすべてストアに保存されるため、定期的な更新をストアから直接取得できます。 単一の状態ツリーは、経時的な変更を追跡し、アプリケーションをデバッグまたは検査するのに役立ちます。


9) Redux のアクションとは何ですか?

アクションオブジェクトを返す関数です。 アクション タイプとアクション データは常にアクション オブジェクトに格納されます。 アクションは、ストアとソフトウェア アプリケーションの間でデータを送信できます。 ストアによって取得されるすべての情報は、アクションによって生成されます。


10) React の重要な機能に名前を付けます

ここでは React の重要な機能を紹介します。

  • サードパーティのライブラリを使用できるようにします
  • 時間の節約
  • より迅速な開発
  • シンプルさと構成可能性
  • Facebook によって完全にサポートされています。
  • 一方向データバインディングによるコードの安定性
  • React コンポーネント

11) ステートレスコンポーネントという用語の説明

ステートレス コンポーネントは、提供されたプロパティのみに基づいて DOM ベースをレンダリングする純粋な関数です。


12) Reactルーターの説明

React Router は、アプリケーションに新しい画面フローを追加できるルーティング ライブラリであり、URL とページに表示されている内容の同期も保ちます。


13) React エコシステムで人気のあるアニメーション パッケージは何ですか?

React エコシステムで人気のあるアニメーション パッケージは次のとおりです。

  • リアクションモーション
  • React 遷移グループ

14) ジェストとは何ですか?

Jest は、Jasmine に基づいて Facebook によって作成された JavaScript 単体テスト フレームワークです。 自動化されたモック作成と jsdom 環境を提供します。 テストコンポーネントとしても使用されます。


15) ディスパッチャとは何ですか?

ディスパッチャは、アクションを受信し、登録されたコールバックにペイロードをブロードキャストするアプリの中心ハブです。


16) コールバック関数とは何を意味しますか? その目的は何ですか?

setState が終了し、コンポーネントが再レンダリングされるときに、コールバック関数を呼び出す必要があります。 setState は非同期なので、XNUMX 番目のコールバック関数を受け取ります。


17) 高次成分という用語の説明

HOC とも呼ばれる高次コンポーネントは、コンポーネント ロジックを再利用するための高度な技術です。 React の一部ではありません API, しかし、これらは React の構成上の性質から現れるパターンです。


18) プレゼンテーションセグメントについて説明する

プレゼンテーション パーツは、HTML をレンダリングできるセグメントです。 セグメントの容量はマークアップで表現されます。


19) React JS の Props とは何ですか?

Props はプロパティを意味し、親から子にデータを渡す方法です。 プロップはコンポーネント間の単なる通信チャネルであると言えます。 常に親コンポーネントから子コンポーネントに移動します。


20) React でのスーパー キーワードの用途は何ですか?

super キーワードは、オブジェクトの親の関数にアクセスして呼び出すのに役立ちます。


21) JavaScript での yield キャッチフレーズの説明

利回りのキャッチフレーズは、遅延と 履歴書 ジェネレーターワーク、イールドキャッチフレーズとして知られています。


22) XNUMX 種類の React コンポーネントに名前を付けます

XNUMX 種類の反応コンポーネントは次のとおりです。

  • 機能コンポーネント
  • クラスコンポーネント

23) React jsで合成イベントを説明する

合成イベントは、ブラウザーのネイティブ イベントのクロスブラウザー ラッパーとして機能するオブジェクトの一種です。 また、さまざまなブラウザーの動作をシグナル API に組み合わせるのにも役立ちます。


24) React Stateとは何ですか?

これは、特定のコンポーネントがどのようにレンダリングされ、どのように動作するかを決定するオブジェクトです。 状態には、React コンポーネントの存続期間中に変更できる情報が保存されます。


25) React JS で状態を更新するにはどうすればよいですか?

コンポーネントの状態は直接的または間接的に更新できます。


26) React のアロー関数の使い方を説明する

アロー関数は、コールバックとして渡されたときのバグの動作を予測するのに役立ちます。 したがって、これに起因するバグを一括して防止します。


27) React のライフサイクル ステップは何ですか?

React js の重要なライフサイクル ステップは次のとおりです。

  • 初期化
  • 状態/プロパティの更新
  • 破壊は React のライフサイクルです

28) プロとステートの主な違いを述べてください

XNUMX つの主な違いは、State は変更可能であり、Pro は不変であることです。


29) React js の純粋なコンポーネントについて説明する

純粋なコンポーネントは、任意のコンポーネントを render() のみで置き換えることができる最も高速なコンポーネントです。 コードの簡素化とアプリケーションのパフォーマンスの向上に役立ちます。


30) React のセグメントを制御する情報は何ですか?

セグメントを制御する情報は主に、State と Props の XNUMX 種類です。

  • State: 変化する State 情報。State を利用する必要があります。
  • プロパティ: プロパティは親によって設定され、パーツの存続期間全体を通じて設定されます。

31) 「create-react-app」とは何ですか?

「create-react-app」は、基本的な反応アプリケーションを XNUMX つ作成できるコマンドライン ツールです。


32) 反応リストでの「キー」の使用法を説明する

キーを使用すると、各リスト要素に安定した ID を提供できます。 キーは一意である必要があります。


33) 子供用プロップとは何ですか?

子プロパティは、コンポーネントをプロパティとして他のコンポーネントに渡すために使用されます。 を使用してアクセスできます

{props.children}

34) エラー境界について説明してください?

エラー境界は、子コンポーネント内の任意の場所で Javascript エラーを検出するのに役立ちます。 これらは、エラーをログに記録し、フォールバック UI を表示するために最も使用されます。


35) 空のタグ <> の用途は何ですか? ?

空のタグは、React でフラグメントを宣言するために使用されます。


36) 厳密モードについて説明する

StrictMode を使用すると、反応コンポーネントのチェックと警告を実行できます。 開発ビルドでのみ実行されます。 これは、目に見える UI をレンダリングせずに問題を強調表示するのに役立ちます。


37) リアクションポータルとは何ですか?

ポータルを使用すると、子を DOM ノードにレンダリングできます。  CreatePortalメソッド それに使われます。


38) コンテキストとは何ですか?

React コンテキストは、React コンポーネントのツリーを使用してデータを渡すのに役立ちます。 これは、さまざまな反応コンポーネント間でデータをグローバルに共有するのに役立ちます。


39) Webpack の用途は何ですか?

Webpack は基本的にモジュールビルダーです。 これは主に開発プロセス中に実行されます。


40) React js の Babel とは何ですか?

Babel は、ES6、ES7 などの最新の JavaScript を、ほとんどのブラウザーが理解できる昔ながらの ES5 JavaScript に変換する JavaScript コンパイラーです。


41) ブラウザはどのようにして JSX ファイルを読み取ることができますか?

ブラウザに JSX を読み取らせたい場合は、Babel などの JSX トランスフォーマを使用してその JSX ファイルを置き換えてから、ブラウザに送り返す必要があります。


42) React で MVC アーキテクチャを使用する際の主な問題は何ですか?

MVC アーキテクチャを扱う際に直面する主な課題は次のとおりです。

  • DOM の処理は非常に高価です
  • ほとんどの場合、アプリケーションは遅くて非効率的でした
  • 循環関数のため、モデルとアイデアを中心に複雑なモデルが作成されています

43) 表現が複数行ある場合はどうすればよいですか?

現時点では、複数行の JSX 式が唯一残された選択肢です。


44) 削減とは何ですか?

リダクションはStateの扱い方の応用方法です。


45) 合成イベントという用語の説明

これは実際には、ブラウザのネイティブ イベントのクロスブラウザ ラッパーです。 これらのイベントには、stopPropagation() およびPreventDefault() インターフェイスがあります。


46) function 要素のトップクラス要素をいつ使用する必要がありますか?

要素がステージまたはライフタイム サイクルを実行する場合は、トップクラスの要素を使用する必要があります。


47) 解析時に要素を共有するにはどうすればよいですか?

状態を使用すると、データを共有できます。


48) 和解という用語について説明する

コンポーネントの状態またはプロパティが変更されると、Rest はレンダリングされた要素を以前にレンダリングされた DOM と比較し、必要に応じて実際の DOM を更新します。 このプロセスは調整として知られています。


49) setState() 関数を使用せずにコンポーネントを再レンダリングすることはできますか?

コンポーネントを再レンダリングするには、forceUpdate() 関数を使用できます。


50) React で props を更新できますか?

props は読み取り専用であるため、react js で props を更新することはできません。 また、親から受け取ったpropsを子に変更することはできません。


51)「リストラ」という用語を説明してください。

再構築とは、 配列 オブジェクト。 プロセスが完了したら、各オブジェクトを個別の変数に分離できます。


52) 小道具の値を更新できますか?

props の値は不変であるため、更新することはできません。


53) 取り付けと取り外しの意味を説明する

  • 要素を DCOM にアタッチするプロセスは、マウントと呼ばれます。
  • DCOM から要素を切り離すプロセスは、マウント解除プロセスと呼ばれます。

54) 「prop-types」ライブラリの用途は何ですか?

「Prop-types」ライブラリを使用すると、最近のアプリケーションでプロパティや同様のオブジェクトの実行時型チェックを実行できます。


55) 反応フックについて説明する

React フックを使用すると、クラスを作成せずに State やその他の React 機能を使用できるようになります。


56) フラグメントとは何ですか?

Fragment キーワードを使用すると、DOM に追加のノードを使用せずに子コンポーネントのリストをグループ化できます。 例えば ​​:

render() {

return (
);
}

57) createElement と cloneElment の主な違いは何ですか?

  • createElement は、react 要素を作成するために React によって使用されます。
  • cloneElement は、要素のクローンを作成し、それに新しい props を渡すために使用されます。

58) 制御コンポーネントとは何ですか?

制御対象コンポーネントは、入力要素を制御するコンポーネントです。


59) props.children を使用する必要があるのはなぜですか?

この props.children を使用すると、コンポーネントをデータとして他のコンポーネントに渡すことができます。


60) React-dom パッケージ内のメソッドのいくつかをリストアップする

React-dom パッケージの重要なメソッドは次のとおりです。

  • render()
  • 水和物()
  • createPortal()
  • unmountComponentAtNode()
  • findDOMNode()

61) React でサーバーサイドレンダリングを行うにはどうすればよいですか?

リアクションサーブを使用してサーバー側のレンダリングを行うことができます。


62) getInitialState() とconstructor() の違いを述べてください?

「React.」を拡張してコンポーネントをXNUMXつ作成したい場合。 コンポーネント」のコンストラクターは、状態の初期化に役立ちます。 ただし、「Reat.createClass」を使用して作成する場合。 その場合は、「genInitiaState」を使用する必要があります。


63) 参照とは何ですか?

Ref は DOM 要素の属性です。 ref の主な目的は、DOM 要素を簡単に見つけることです。


64) ComponentWillMount()とは何ですか

ComponentWillMount() は、コンポーネントが開始された後に API 呼び出しを行い、値を状態に設定します。 API 呼び出しを行うには、Axios などの HttpClient を使用するか、fetch() を使用して AJAX 呼び出しをトリガーできます。


65) 店舗内でデータを送信するにはどうすればよいですか?

親コンポーネントを格納するアクションに基づく必要がある別のコンポーネントにデータをディスパッチできます。


66) redux を使用すると、どのようにしてより多くのアクションを処理できるようになりますか?

より多くのアクション フローで同じコンポーネントを作成するために、さまざまなモジュールで同じ機能を使用しています。


67) どうやって減速機をこぼすことができますか?

イベントアクションに基づいてレスキューをこぼすことができます。 そのアクションは別のモジュールに分割する必要があります。


68) React で使用される XNUMX つの事前定義されたプロトタイプに名前を付けてください

React js で使用される最も重要なプロトタイプは次のとおりです。

  • string
  • 配列
  • オブジェクト
  • 素子

69)bindActionsCreators を使用する目的は何ですか?

BindActionCreator は、アクション ディスパッチャに基づいてイベントを HTML 要素にバインドするのに役立ちます。


70) React における REFS とは何ですか

Ref は要素への参照です。 ほとんどの場合、これは避けるべきです。 ただし、DOM またはコンポーネントのインスタンスに直接アクセスする必要がある場合に使用されることがあります。


71) JSX 要素を他の JSX コンポーネントにアタッチできますか?

はい、JSX 要素を他の JSX コンポーネントとともに使用できます。これは、HTML 要素をネストするのとよく似ています。


72) React の現在の安定バージョンは何ですか?

React の現在の安定バージョンはバージョン 17.5 です。


73) Redux ワークフロー機能の重要な機能を挙げてください

Redux ワークフローの重要な機能は次のとおりです。

  • リセット: ストアの状態をリセットするのに役立ちます
  • 元に戻す: 最後にコミットされた状態にロールバックできます。
  • スイープ: 誤って発射する可能性のあるすべての無効化アクションが削除されます
  • コミット: 現在の状態を初期状態にするのに役立ちます。

74) React JS と React Native の違いを述べてください

React JS は、UI の構築に使用されるフロントエンドのオープンソース JavaScript ライブラリですが、React Native は、開発者が Android や Android などのプラットフォームで React を使用できるようにするオープンソースのモバイル フレームワークです。 iOS。 これらの面接の質問は、あなたのビバ(口頭)にも役立ちます。

シェアする

10のコメント

  1. アバター リシャブ 言います:

    良い質問セットです。

  2. アバター ヴァルミク・ジャダフ 言います:

    64) ComponentWillMount()とは何ですか

    答えは間違っています..

    1. アレックス・シルバーマン アレックス・シルバーマン 言います:

      修正されました..!!

  3. アバター スバニ 言います:

    質問番号 74「Rect Native」のスペルミス。

    1. アレックス・シルバーマン アレックス・シルバーマン 言います:

      こんにちは、ご指摘ありがとうございます。 修正されています。

  4. アバター ポール・フライシャー=ジョレト 言います:

    良い質問です。 機能フックの質問は見当たりませんでした。 XNUMXつもありません。

  5. アバター アジアト 言います:

    質問番号 62「getIntialState()」のスペルミス

    1. アバター kishor 言います:

      ありがとうございます。コンテンツが更新されました。

  6. アバター アトゥル・ギサリ 言います:

    React に関する質問をさらに追加する

  7. アバター 匿名の 言います:

    あなたは、再構築は再構築ではなく、破壊であると述べました。 修正してください

コメントを残す

あなたのメールアドレスは公開されません。 必須フィールドは、マークされています *