JavaScriptのそれぞれの使い方

JavaScript は、Web 開発、モバイル アプリケーション、デスクトップ アプリケーションで広く使用されている高レベルの動的オブジェクト指向プログラミング言語です。中でも each ループは JavaScript で最もよく使われるループメソッドの 1 つであり、応用範囲が非常に広いです。

それぞれは何ですか?

each は、配列またはオブジェクト内のデータを反復処理するために特別に設計されたループ メソッドです。これはイテレータとして使用されるため、ループの作成が簡素化され、コードが読みやすく理解しやすくなります。

JavaScript では、それぞれが異なるライブラリやフレームワークによって提供されるメソッドを使用できます。たとえば、jQuery の $.each()、Underscore.js の _.each()、Lodash の _.forEach() wait などです。この記事ではLodashの各メソッドを例に説明していきます。

それぞれの使い方は?

配列の場合:

各ライブラリが提供する各メソッドを使用する前に、ライブラリまたはフレームワークを参照してから、そのメソッドを使用する必要があります。 Lodash では、次のメソッドを使用して each メソッドを導入できます:

const _ = require('lodash');

次に、_.each() メソッドを使用して配列を走査できます。コードは次のとおりです:

let arr = ['apple', 'banana', 'pear'];

_.each(arr, function(fruit) {
    console.log(fruit);
});

上記のコードでは、配列 arr を走査し、無名関数をコールバック関数として使用して、各要素の値をコンソールに出力します。

この例では、匿名関数を使用して各果物を出力します。ただし、より簡単な記述方法を使用して上記の例を処理することもできます。たとえば、アロー関数を使用して従来の匿名関数を置き換えることができます。

_.each(arr, fruit => console.log(fruit));

この方法はより簡潔で読みやすく、コードを 1 行のみで匿名関数を単純化するのにも非常に適しています。

オブジェクトの場合:

each を使用してオブジェクトを走査する場合、各メソッドのパラメータを変更する必要があります。たとえば、次のようになります。

let obj = {name: 'Tom', age: 18};

_.each(obj, function(value, key) {
    console.log(key + ': ' + value);
});

上記のコードでは、次のように使用します。オブジェクト obj を取得し、 each メソッドを介してそれを走査し、オブジェクトのキーと値のペアをコンソールに出力します。各オブジェクトのキーと値はそれぞれパラメータとしてコールバック関数に渡されます。

valueOf

Lodash の _.each() メソッドには、デフォルトの項目ごとの処理ロジックとは異なる別のメソッド、valueOf() メソッドがあります。 valueOf() メソッドを使用する場合、コールバック関数は、最初のパラメーターが常に valueOf() によって返される値に渡されることを指定します。例:

let obj = {name: 'Tom', age: 18};

_.each(obj, function(value, key) {
    console.log(value);
}, function() {
    return this.age;
}.valueOf());

上記のコードでは、valueOf() メソッドを使用し、コールバック関数でオブジェクトの年齢を返します。したがって、コンソールでは、オブジェクトの年齢 18 のみが出力されます。

要約:

上記の例を通して、JavaScript では各ループが非常に一般的で実用的であることがわかります。あらゆる種類のデータ構造を横断でき、従来の for ループと比較して、より簡潔で、読みやすく、書きやすいという利点があります。さらに重要なのは、ほとんどの JavaScript ライブラリまたはフレームワークで広く使用されており、コードがより標準化され、保守と拡張が容易になることです。

異なる JavaScript ライブラリまたはフレームワークは、各メソッドとパラメータの実装方法が若干異なりますが、一般に、それらの目的と機能は一貫しています。したがって、実際のアプリケーションでは、プロジェクトのニーズやチームの習慣に応じて柔軟に選択できます。

以上がJavaScriptのそれぞれの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。