ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptトラバーサルメソッドの紹介(コード例)

JavaScriptトラバーサルメソッドの紹介(コード例)

不言
不言転載
2018-10-24 17:38:492075ブラウズ

この記事では、JavaScript のトラバーサル メソッド (コード例) を紹介します。必要な方は参考にしていただければ幸いです。

オブジェクトオブジェクトを配列に変換すると便利なので、トラバース方法を思いついたので、それも記録したいと思います

1。ループから抜け出す

  • break ループ本体から飛び出す、ループ本体が終了する

  • return 関数の実行を終了する

  • for (let i = 0; i < 5; i++) {
        if (i == 3) break;
        console.log("The number is " + i);
        /* 只输出 0 , 1 , 2 , 到3就跳出循环了 */
    }
    for (let i = 0; i <= 5; i++) {
        if (i == 3) continue;
        console.log("The number is " + i);
        /* 不输出3,因为continue跳过了,直接进入下一次循环 */
    }

    #2. トラバーサル方法

偽のデータ

  • const temporaryArray = [6,2,3,4,5,1,1,2,3,4,5];
    const objectArray = [
        {
            id: 1,
            name: &#39;d&#39;
        }, {
            id: 2,
            name: &#39;d&#39;
        }, {
            id: 3,
            name: &#39;c&#39;
        }, {
            id: 1,
            name: &#39;a&#39;
        }
    ];
    const temporaryObject = {
        a: 1,
        b: 2,
        c: 3,
        d: 4,
    };
    const length = temporaryArray.length;

  • 通常の for ループ トラバーサル
  • for(let i = 0; i < length; i++) {
        console.log(temporaryArray[i]);
    }

  • for in ループ
  • /* for in 循环主要用于遍历普通对象,
    * 当用它来遍历数组时候,也能达到同样的效果,
    * 但是这是有风险的,因为 i 输出为字符串形式,而不是数组需要的数字下标,
    * 这意味着在某些情况下,会发生字符串运算,导致数据错误
    * */
    for(let i in temporaryObject) {
        /* hasOwnProperty只加载自身属性 */
        if(temporaryObject.hasOwnProperty(i)) {
            console.log(temporaryObject[i]);
        }
    }

  • for of ループ。反復可能なオブジェクトを走査するために使用されます。
  • for(let i of temporaryArray) {
        console.log(i);
    }

  • forEach first 最初の値は配列の現在のインデックスの値で、2 番目の値は配列の現在のインデックスの値です。インデックス値のみを実行でき、戻り値はなく、ループから抜け出すことはできません。
  • let a = temporaryArray.forEach(function(item, index) {
        console.log(index, item);
    });

  • map Return 新しい配列は実行のみ可能です。 array
  • temporaryArray.map(function(item) {
        console.log(item);
    });

  • filter は配列の組み込みオブジェクトであり、元の配列を変更せず、戻り値
    を持ちます。
  • temporaryArray.filter(function(item) {
        console.log(item%2 == 0);
    });

  • some は一致する値があるかどうかを決定します
  • let newArray = temporaryArray.some(function(item) {
        return item > 1;
    });
    console.log(newArray);

  • every は配列内のすべての値があるかどうかを決定します条件を満たします
  • let newArray1 = temporaryArray.every(function(item) {
        return item > 6;
    });
    console.log(newArray1);

    #reduce(function(total, currentValue, currentIndex, array) {}, [])
  • total: 初期値、または計算完了後の戻り値、currentValue を走査したときの現在の要素の値、currentIndex の現在のインデックス値、および配列の現在の配列

    パラメーターが指定されていない場合 - 空の配列 [ ] の場合、累積変数 total のデフォルトは最初の要素の値になります。

    パラメータに空の配列を指定すると、累積変数 total の初期値は空の配列になります
let temporaryObject3 = {};
let newArray2 = objectArray.reduce(function(countArray, currentValue) {
    /* 利用temporaryObject3里存放id来判断原数组里的对象是否相同,若id相同,则继续下一步,不同则将该对象放入新数组中
     * 则countArray为去重后的数组
      * */
    temporaryObject3[currentValue.id] ? '' : temporaryObject3[currentValue.id] = true && countArray.push(currentValue);
    return countArray;
}, []);
console.log(newArray2);


以上がJavaScriptトラバーサルメソッドの紹介(コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はsegmentfault.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。