84-数组高级API-数组遍历

遍历数组

• 1. 利用传统循环来遍历数组

      let arr = [1, 3, 5, 7, 9];
      for (let i = 0; i < arr.length; i++){
          console.log(arr[i]);
      }
  

• 2. 利用 for in 循环来遍历数组

  • 注意点: 在企业开发中, 不推荐使用 for in 循环来遍历数组 参考资料

      let arr = [1, 3, 5, 7, 9];
      for (let key in arr){
          console.log(arr[key]);
      }
  
      // 不推荐使用的原因
      function Person() {
          this.name = "lnj";
          this.age = 34;
          this.score = 99;
      }
      // 注意点: 对象中的属性是无序的
      // for in循环是专门用于遍历对象的, 但是对象的属性是无序的
      // 所以for in循环就是专门用于遍历无序的东西的,所以不推荐使用for in循环来遍历数组
      let p = new Person();
      console.log(p); // age = 34 name = "lnj" score = 99;
  

• 3. 利用ES6推出的 for of 循环来遍历数组(专门用于遍历数组的高级for循环)

      let arr = [1, 3, 5, 7, 9];
      for (let value of arr){
          console.log(value);
      }
  

• 4. 还可以利用Array对象的 forEach 方法来遍历数组

      let arr = [1, 3, 5, 7, 9];
      // forEach方法会自动调用传入的函数
      // 每次调用都会将当前遍历到的元素和当前遍历到的索引和当前被遍历的数组传递给这个函数
      arr.forEach(function (currentValue, currentIndex, currentArray) {
          // console.log(currentValue, currentIndex, currentArray);
          console.log(currentValue);
      });
  

  • forEach方法内部实现原理

      Array.prototype.myForEach = function (fn) {
          // this === [1, 3, 5, 7, 9]
          for (let i =0; i < this.length; i++){
              fn(this[i], i, this);
          }
      }
      arr.myForEach(function (currentValue, currentIndex, currentArray) {
          console.log(currentValue, currentIndex, currentArray);
      });