スモールコードブラザーReactコアテクノロジーと開発実際の戦闘リセットバージョン

reduxミドルウェアの原理は何ですか？回答：ディスパッチを変更しました。アクションとストアの間にあるため、ミドルウェアと呼ばれます。
fucntion createThunkMiddleware（extraArgument）{ return（{dispatch、getState}）=> next => action => { if（typeof action === 'function'）{ return action（dispatch、getState、extraArgument）; }

    return next(action)
};

}

const thunk = createThunkMiddleware（）;
thunk.withExtraArgument = createThunkMiddleware;

デフォルトのサンクをエクスポートします。
管理のためにデータをreduxに入れますか、それとも管理のために共有データをreduxに入れますか？回答：ネイティブに反応しないでください。すべてのデータはreduxで管理する必要があります。共有データをreduxに入れると、コンポーネントに状態、小道具、およびreduxストレージデータが含まれ、ページに問題がある場合は、状態、小道具、およびreduxの3つの側面から確認する必要があります。開発プログラムは非常に高速です。しかし、最も時間がかかるのは、プログラムの保守性とコードの調整可能性です。データがすべてreduxで管理されている場合、プロジェクトでエラーが発生した後、reduxのみがチェックされ、不整合がすぐに特定されます。状態のデータが1つのコンポーネントによってのみ使用されるとは思わないでください。プロジェクトがますます大きくなるにつれて、他のコンポーネントを使用する必要があるかどうかは不確実です。5GBのデータをreduxに保存できます（Dellの教師によるテスト済み）。したがって、reduxを使用できる場合は、reduxを使用する必要があります。これは、後のメンテナンスに非常に便利です。不変、reduxと不変ライブラリを組み合わせると、プロジェクト全体のパフォーマンスが最高になり、非常にシンプルになります。肥大化したデータについて心配する必要はありません。reduxには存在しないため、状態または小道具に保存する必要があります。
componentWillReceivePropsを呼び出すタイミング。回答：小道具が変更されたときにのみ呼び出されます。親コンポーネントが子コンポーネントに初めて値を渡すときには呼び出されません。
反応パフォーマンス最適化のベストプラクティス。回答：shouldcomponentupdateに付属しているPureComponentは、浅い比較です。
クラスTestはReact.PureComponentsを拡張します{ constructor（props）{ super（props）}

render() {
    return <div>hello</div>
}

}
immutable.jsライブラリと組み合わせることで、それは完全に完璧である、反応のパフォーマンスの問題を解決します。

仮想domとは何ですか？仮想domがコードパフォーマンスを向上させる理由。回答：jsオブジェクト、なぜ最近仮想domが使用されているのか、仮想domは実際のdomのjsオブジェクトです。以前は、2つのページの違いが必要でした。実際のdomを比較する必要がありました。実際のdomノードには、イベント、属性、およびさまざまなメソッドがあります。したがって、2つの実際のドームの比較は、パフォーマンスを非常に消費します。したがって、domオブジェクトをjsオブジェクトに変換すると、jsオブジェクトにはdomオブジェクトの厄介な特性がありません。jsオブジェクトはより高速です。
webpackでは、ローダーまたはbabelを使用したJSXコードの変換？回答：babel-
preset -react、setStateを呼び出した後に何が起こりましたか？回答：調整
this.setState（{ age：this.state.age + 1 }）//ボタンをクリックしてこのsetStateを継続的に呼び出すと、値は1つずつ追加されるのではなく、一度に複数追加されますreactは複数のsetStatesを1つに統合し、最終的に状態を変更するため、変更します。

this.setState（（prevState）=>（{ age：++ prevState.age }））//ボタンをクリックしても、ボタンは1つずつ追加されます。setStateを使用する場合は、関数を返すことをお勧めします

setStateは非同期です。この時点でピットに遭遇したのはいつですか。回答：上記と同じです。
参照の役割は何ですか。また、どのビジネスシナリオで参照を使用しましたか。回答：画像の幅と高さを取得します。
class Test extends Component { //要件：ページがスクロールするときに、ページスクロールのイベントをリッスンしますconstructor（props）{ super（props）; this.state = { top：0 } }

componentDidMount() {
    window.addEventListener('scroll', () => {
        this.setState(() => ({
            top: document.body.scrollTop
        }))
    })
}

render() {
    return <div>{this.state.top}</div>
}

}
上記文言、コンポーネントが破棄されると、スクロールイベントがまだ存在

class Test extends Component { //要件：ページがスクロールするときに、ページスクロールのイベントをリッスンしますconstructor（props）{ super（props）; this.state = { top：0 } this.handleWindowScroll = this.handleWindowScroll.bind（this）}

handleWindowScroll() {
    this.setState(() => ({
        top: document.body.scrollTop
    }))
}

componentDidMount() {
    window.addEventListener('scroll', this.handleWindowScroll)
}

componentWillUnmount() {
    window.removeEventListener('scroll', this.handleWindowScroll)
}

render() {
    return <div>{this.state.top}</div>
}

}
refは関数ですが、どのような利点がありますか？
利点：メモリリークを防ぐために、コンポーネントを破棄または再レンダリングするときにReactがrefの内容を効果的にクリアすると便利です。将来的には、refを文字列の形式にすることはできません。非常に低いです。機能書き込み
クラスを使用してください。TestextendsComponent { componentDidMount（）{ this.elem }

render（）{ return <div ref = {（div）=> {this.elem = div}}> // refを使用する場合は関数を使用するのが最適です} }高レベルのコンポーネントをどのように理解しますか？その本質は何？Reactで継承を使用しないでください。なぜ、設計パターンに「組み合わせは継承よりも優れている」という言葉があります。Reactコンポーネントプログラミングは、組み合わせタイプの設計パターンです。継承よりも優れていて、保守可能でなければなりません。セックスは継承よりもはるかに高いです。Reactのすべての問題は、コンポーネントを組み合わせる方法で解決できます。高次コンポーネントは実際には関数であり、パラメーターを受け取り、パラメーターを返します。コンポーネントをラップしてから、コンポーネントを返します。コンポーネントをパッケージ化する理由コンポーネントは多くの場所で使用される可能性があるため、このコンポーネントのほとんどのコンポーネントは他の場所で直接使用できます。異なる場所はごくわずかです。共有の場所を高レベルに書き込むことができます。コンポーネントの内部に入り、ネットワークの高レベルコンポーネントにパラメータを渡して、このコンポーネントの使用の違いを動的に変更します。ハイエンドコンポーネント地獄。新しいバージョンのフックはこの問題を解決します。制御されたコンポーネントと制御されていないコンポーネントの違いは何ですか？制御コンポーネント：このコンポーネントの変更は、データの変更、データの変更、ページの変更によって完全に制御されます。制御されていないコンポーネント：入力ボックス、直接操作します。データをバインドさせません。入力後にボタンをクリックします。当時、私は直接refを使用して、データ制御ではなく、domのコンテンツを操作します。制御されたコンポーネントはより優れている必要があります。Reactはデータ駆動型フレームワークであるため、データ駆動型はreactの中核であるため、コンポーネントはデータによって制御する必要があります。

機能コンポーネントとフック？
これは問題を示していますが、一般的にどのように解決しますか？
この
矢印関数を保存するための矢印関数、バインド、変数の宣言これはスコープチェーンの問題です。
機能コンポーネントのパフォーマンスを最適化する方法。
機能コンポーネントにはクラスの他のプロパティがなく、クラスを構築するプロセスがないため、機能コンポーネントのパフォーマンスは通常のコンポーネントよりも高くなります。その理由は、機能コンポーネントと小道具が変更された後、関数が再度実行されるためです。React.memo（function Test（）{return

123

}）、このようなパッケージの場合、コンポーネントにはshouldComponentUpdateなどの属性があるため、機能コンポーネントのパフォーマンスは通常のコンポーネントのパフォーマンスよりも優れている必要があります。
function Test（）{
return

123

}
ajaxはどのライフサイクルで送信されますか？
これはcomponentDidMountで送信する必要があります。まず、componentWillMountは新しいバージョンのreactで非推奨になり、getDerivedStateFromPropsなどのライフサイクル関数に置き換えられたため、componentWillMountを使用することは適切ではありません。次に、ssrプロジェクトを使用する場合、ComponentWillMountはサーバーデータを取得する必要があるため、占有できません。
ssrの原理は何ですか？
redux-sagaのデザインアイデアは何ですか？sideEffectsとは何ですか？
react、jquery、vueを同じプロジェクトに共存させることは可能ですか？
共存できます。重要なのは、どのように共存するかです。

コンポーネントは何ですか？クラスとは何ですか？クラスは何にコンパイルされますか？
コンポーネントは、クラスによって実装され、コンストラクターにコンパイルされたページの一部を指します

どのようにしてコミュニティとともに成長しましたか？

ajaxデータの再取得を回避する方法
reduxを使用して、データがあるかどうかを判断します。データがある場合は、再度リクエストしないでください。

react-router4のコアアイデアは何ですか？3との違いは何ですか？
3のルートはファイルで簡単に構成する必要がありますが、4のアイデアはルートをコンポーネントとして扱い、それをコンポーネントで直接使用することです.4と3の設計コンセプトの違いです

immutable.jsとreduxのベストプラクティスは？

再選択は何に使用されますか？

react-router、hashHistory、browserHistoryの基本原則？
hashHistoryは＃にあり、browserHistoryは簡潔に見えますが、サーバーのサポートが必要です

非同期コンポーネントをいつ使用するのですか？
非同期コンポーネント、レイジーロード、オンデマンドロード。
可能であれば、すべてのプロジェクトで使用して、パッケージ化後のプロジェクトのサイズを縮小してみてください。フロントエンドでロードする場合、一度に大きすぎるjsファイルをロードすることはありません。

Reactでxss攻撃を防ぐ方法は？

getDerive的StateFromProps

スモールコードブラザーReactコアテクノロジーと開発実際の戦闘リセットバージョン

おすすめ