フロントエンド

「読むのに3分」あなたが知らないforEachのいくつかの小さな詳細



Three Minutes Readsome Small Details Foreach That You Dont Know



3分間の読書：不足している知識のポイントを拾うために3分間を与えてください。これが最初の問題です。

序文

今日から、一連の「3分間の読書」を書きます。 3分は長くありません。知識ポイントを体系的に紹介することはできませんが、知識ポイントの一部を説明することはできます。私の当初の意図は、3分以内に知識ネットワークにレンガを追加して、普段見落としている知識ポイントのいくつかを拾い上げ、毎日少しずつ進歩させることです。



テーマ

今日のトピックは話す準備ができていますforEach、forEach一般的に配列をトラバースするために使用されますが、パフォーマンスを向上させるために、データを処理した後、事前にループから飛び出しますbreak、return、continueただし、at forEach少し問題があります。

リターンはループから飛び出すことはできません

以下の例を見てみましょう。 2番目の位置に移動するときに、ループからジャンプします。



const array = [1,2,3] array.forEach((item,index)=>{ if(index === 1){ return } console.log(item) }) Copy code

出力は何ですか？一見、yes 1と言うかもしれませんが、実際の操作では、結果は1 3であることがわかります。これは、forEach内部で使用returnが終了しないためです。ループし、トラバースを続けます。

Breakはループを中止できません

前の例を変更します。同様に、2番目の位置にトラバースする場合は、ループを中止し、出力が1になることを期待します。

const array = [1,2,3] array.forEach((item,index)=>{ if(index === 1){ break } console.log(item) }) Copy code

それを実行すると、直接エラー、プロンプトUnsyntactic breakが見つかります。



続行はループから飛び出すことはできません

もう一度変更します。スキップします2直接出力1 3

const array = [1,2,3] array.forEach((item,index)=>{ if(index === 1){ continue } console.log(item) }) Copy code

繰り返しますが、同様のbreak、エラー、プロンプトUnsyntactic continue

インスピレーション

必要に応じてアボートループからジャンプすることは、不要なトラバーサルを減らし、コードの実行時間を短縮し、パフォーマンスを向上させるため、ビジネス開発では一般的です。では、代替案は何ですか？

  1. 戻り、中断、続行は、単純なforループまたはfor ... ofループを介して通常どおり実行できます。
  2. 特定の条件を完了した後にトラバーサルからジャンプするなど、es6によって提供されるいくつかの新しいAPIは、every()またはsome()メソッドを使用できます。

最後に、配列を走査するときは、どのような方法がより適しているかを考えてください。遭遇するたびに使用しないでください。forEach mapループを事前に中止できる場合は、早期に停止してコードの実行時間を短縮することを学ぶ必要があります。