Javascript反復方法の概要

3392 ワード

ECMAScript 5は配列に対して5つの反復法を定義する.各メソッドは、各項目で実行する関数と(オプション)関数を実行する役割ドメインオブジェクト(thisの値に影響を与える)の2つのパラメータを受信します.これらのメソッドに入力された関数は、配列アイテムの値、配列内のアイテムの位置、配列オブジェクト自体の3つのパラメータを受信します.使用方法によっては、この関数の実行後の戻り値がメソッドの戻り値に影響を与えない場合があります.この5つの反復方法は、次のとおりです.
5つの反復メソッドは、2つのパラメータを受け入れます.各項目で実行する関数と、その関数を実行する役割ドメイン(オプション)
every():配列内の各項目に対して所定の関数を実行します.関数が各項目に対してtrueを返すと、trueが返されます.filter():配列内の各項目に対して所定の関数を実行します.関数を返すとtrueのアイテムからなる配列が返されます.forEach():配列内の各項目に対して所定の関数を実行します.この関数には値が返されません.map():配列内の各項目に対して所定の関数を実行します.各関数呼び出しの結果からなる関数を返します.some():配列内の各項目に対して所定の関数を実行します.関数がいずれかに対してtrueを返す場合はtrueを返します.
以上のすべての方法では、配列に含まれる値は変更されません.
上記の方法では、every()とsome()は非常に似ており、配列内のアイテムが条件を満たすかどうかをクエリーするために使用されます.every()メソッドでは、入力された関数は、trueを返すには、各アイテムに対してtrueを返さなければなりません.そうでなければfalseを返します.some()メソッドは,入力した関数が配列のいずれかに対してtrueを返す限りtrueを返す.例:

var nums = [1,2,3,4,5,4,3,2,1];
var result = nums.every(function(item, index, array){
 return (item > 2);
})
console.info(result);

上のコードはコンソールにfalseを印刷します.

var nums = [1,2,3,4,5,4,3,2,1];
var result = nums.some(function(item, index, array){
 return (item > 2);
})
console.info(result);

上のコードはコンソールにtrueを印刷します.
次に、指定した関数を使用して、返される配列に1つの項目が含まれているかどうかを決定するfilter()関数の例を示します.たとえば、すべての値が2より大きい配列を返すには、次のコードを使用します.

var nums = [1,2,3,4,5,4,3,2,1];
var result = nums.filter(function(item, index, array){
 return (item > 2);
})
console.info(result);  // [3,4,5,4,3]

上記のコードはfilter()メソッドを呼び出すことによって3,4,5,4,3を含む配列を返す.この方法は、特定の条件を満たすすべての配列をクエリーするのに役立ちます.
map()メソッドも配列を返しますが、この配列の各項目は元の配列の対応する項目で入力関数を実行した結果です.たとえば、配列の各項目に2を乗算し、これらの積からなる配列を返します.

var nums = [1,2,3,4,5,4,3,2,1];
var result = nums.map(function(item, index, array){
 return item * 2;
})
console.info(result);  // [2,4,6,8,10,8,6,4,2]

map()メソッドは、別の配列に対応する項目を含む配列を作成するのに適しています.
最後にforEach()メソッドは、配列内の各項目に対して入力された関数を実行するだけです.この方法は値を返さず,本質的にforループ反復配列を用いるのと同じである.次の例を見てください.

var nums = [1,2,3,4,5,4,3,2,1];
nums.forEach(function(item, index, array){
 //       
})

jsにおけるこれらの配列法は,異なる操作を実行することによって,配列のタスクを大幅に容易に処理することができる.
これらの反復方法をサポートするブラウザは、IE 9+,Firefox 2+,Safari 3+,Opera 9である.5+とChrome.

    var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
    //every() some()   
    //every() item:     ,index:     ,array:      
    var everyResult = numbers.every(function (item, index, array) {
      return item > 2;
    });
    alert(everyResult);//false
    //some()
    var someResult = numbers.some(function (item, index, array) {
      return item > 2;
    });
    alert(someResult);//true
    //filter
    var filterResult = numbers.filter(function (item, index, array) {
      return item > 2;
    });
    alert(filterResult);//[3,4,5,4,3]
    //map()
    var mapResult = numbers.map(function (item, index, array) {
      return (item * 2);
    });
    alert(mapResult);//[2,4,6,8,10,8,6,4,2]
    //forEach     for      
    var forEachResult=numbers.forEach(function(item,index,array){
      alert(item)
    });

以上が本稿のすべてですが、javascript反復方法をよりよく理解できるようにヒントを与えたいと思います.