js的循环遍历

原生的遍历

while循环

语法：while (条件) 语句

While语句包括一个循环条件和一段代码块，只要条件为真，就不断循环执行代码块。

    let a = 0;
    while (a < 100) {
      console.log(a++);
      // 此时输出的值为  0 到 99
    }

do...while

语法1：do { 语句 } while ( 条件 )

循环与while循环类似，唯一的区别就是先运行一次循环体，然后判断循环条件。

  //举例：
    var x = 3;
    var i = 0;
    do {
      console.log(i);			
        //0,1,2
      i++;
    } while
      (i < x);

for循环

语法：

var arr = [11, 22, 33, 44, 55];
    for (var i = 0; i < arr.length; i++) {
      console.log(arr[i]);
        // 11,22,33,44,55,66
    }

for...in

注意：fo…in循环一般用于对象的遍历

   var arr = ['aaa', 'bbb', 'ccc']
    for (let i in arr) {
      // console.log(i);     //0 1 2   这个是索引
      console.log(arr[i]); //aaa bbb ccc   这个遍历的是值
    } 

let obj = [
      { name: 'zs', age: 22 },
      { name: 'ls', age: 23 },
      { name: 'ww', age: 24 },
    ]

    for (let i in obj) {
      console.log(obj[i]);
      // { name: 'zs', age: 22 },
      // { name: 'ls', age: 23 },
      // { name: 'ww', age: 24 },
      document.write(
        `<h1>${obj[i].name}</h1>
        <p>${obj[i].age}</p>`
      )
    }
    // for in  i 主要是取 键名

map()

语法：array.map(function(currentValue, index, arr), thisIndex)

参数说明：

• function(currentValue, index, arr)：必须。为一个函数，数组中的每个元素都会执行这个函数。其中函数参数：

1. currentValue：必须。当前元素的的值。
2. index：可选。当前元素的索引。
3. arr：可选。当前元素属于的数组对象。
4. thisValue：可选。对象作为该执行回调时使用，传递给函数，用作"this"的值。

map方法将数组的所有成员依次传入参数函数，然后把每一次的执行结果组成一个新数组返回。

注意：是返回一个新数组，而不会改变原数组。

var arr = [1, 2, 3];
    let newArray = arr.map(function (item) {
      return item * 2;
    })
    console.log(newArray)  // [1, 4, 9]
    console.log(arr);   // [1,2,3]

forEach

forEach方法与map方法很相似，也是对数组的所有成员依次执行参数函数。但是，forEach方法不返回值，只用来操作数据。也就是说，如果数组遍历的目的是为了得到返回值，那么使用map方法，否则使用forEach方法。forEach的用法与map方法一致，参数是一个函数，该函数同样接受三个参数：当前值、当前位置、整个数组。

 var arr = [5, 6, 7, 8, 9]
    arr.forEach(function (element, index) {
      // console.log(element);   // 5,6,7,8,9
      console.log(index);       //索引 0,1,2,3,4
    });

filter()过滤循环

filter方法用于过滤数组成员，满足条件的成员组成一个新数组返回。它的参数是一个函数，所有数组成员依次执行该函数，返回结果为true的成员组成一个新数组返回。该方法不会改变原数组。

 var arr = [11, 22, 33, 44, 55]
    var newArr = arr.filter(function (elem) {
      return (elem > 30);
    })
    console.log(newArr);
    // 上面代码将大于30的数组成员，作为一个新数组返回。

some()，every()循环遍历

这两个方法类似“断言”（assert），返回一个布尔值，表示判断数组成员是否符合某种条件。

它们接受一个函数作为参数，所有数组成员依次执行该函数。该函数接受三个参数：当前成员、当前位置和整个数组，然后返回一个布尔值。

some方法是只要一个成员的返回值是true，则整个some方法的返回值就是true，否则返回false。

 var arr = [1, 2, 3, 4, 5];
    var newArray = arr.some(function (elem, index, arr) {
      return elem >= 3;
    });
    console.log(newArray);
  // true

而every方法则相反，所有成员的返回值都是true，整个every方法才返回true，否则返回false。两相比较，some()只要有一个是true，便返回true；而every()只要有一个是false，便返回false.

var arr = [1, 2, 3, 4, 5];
    var newArray2 = arr.every(function (elem, index, arr) {
      return elem >= 3;
    });
    console.log(newArray2);

jQuery的遍历

$.each()筛选遍历数组或json对象，dom也可以遍历

   $(function () {
      var anObject = { one: 1, two: 2, three: 3 };//对json数组each
      $.each(anObject, function (name, value) {
        console.log(name + '----' + value);
      });
      var anArray = ['one', 'two', 'three'];
      $.each(anArray, function (n, value) {
        console.log(n);   //索引
        console.log(value); //值
      });
    })

<ul>
      <li>1</li>
      <li>2</li>
      <li>3</li>
</ul>

 $lis = $('li');
    $.each($lis, function (index, value) {
      console.log(index);
      console.log(value);
    })

上面代码的返回值！

inArray()循环能返回参数在数组中对应的坐标。

var anArray = [111, 222, 333, 444, 555];
    $(function () {
      var index = $.inArray(333, anArray);
      console.log(index);     //索引    2
      console.log(anArray[index]);//值    333
    })