美文网首页
JavaScript数组遍历常用方法(简写)

JavaScript数组遍历常用方法(简写)

作者: 晓晓_1931 | 来源:发表于2022-11-08 16:27 被阅读0次

数组遍历

           var arr = ['a', 'b', 'c', 'd'];
           console.log(arr);                      //直接打印内容  (4) ["a", "b", "c", "d"]
          --------------------------------- for 循环 ------------------------------------------
           // for 循环 
           for (var i = 0; i < arr.length; i++) {
               console.log(i + ":" + arr[i]);     //0:a 1:b 2:c 3:d
           }
          --------------------------------- while循环 --------------------------------------
           //while循环
           var i = arr.length;
           while (i--) {
               console.log(i + ":" + arr[i]);     //倒叙 3:d 2:c 1:b 0:a
           }
          ---------------------------------- for…of ----------------------------------------
           //for…of
           //输出内容
           for (let item of arr) {
               console.log(item);                 //获取值 a b c d
           }
            
           // 输出数组索引
           for (let index of arr.keys()) {
               console.log(index);                // 0 1 2 3
           }
           
           // 输出内容和索引 
           for (let [index, item] of arr.entries()) {
               console.log(index + ':' + item);   // 0:a 1:b 2:c 3:d
           }

          -------------------------------- for…in ----------------------------------------
           //for…in
           //遍历普通数组
           for (let index in arr) {
               console.log(index + ":" + arr[index]); //0:a 1:b 2:c 3:d
           }
           //遍历对象
           let obj = {
               name: 'zhangsan',
               age: '18',
               weight: '70kg'
           }

           for (var key in obj) {
               console.log(key + ":" + obj[key]); // name:zhangsan age:18 weight:70kg 
           }

          ---------------------------------- forEach函数 ----------------------------------
           //forEach函数
           arr.forEach(function(item, index, array) {
               console.log(array);
               console.log(index + ":" + item);   //0:a 1:b 2:c 3:d
           })

          --------------------------------- map函数 ---------------------------------------
           //map函数(返回一个新数组)
           //遍历普通数组
           let newArr = arr.map(function(item, index) {
               console.log(index + ":" + item);   //0:a 1:b 2:c 3:d
           })

           //遍历对象数组
           var user = [
                         {name:'zs',age:'18'}, 
                         {name:'ls',age:'19'}, 
                         {name:'ww',age:'20'} 
                       ];
           user.map(function(item, index) {
               console.log(index + "." + item.name + ":" + item.age); 
               // 0.zs:18   1.ls:19   2.ww:20
           })

          -------------------------------- filter函数 ---------------------------------------
           //filter函数
           var newfarr = arr.filter(function(item, index) {
               console.log(index + ":" + item);   //0:a 1:b 2:c 3:d
               return item == 'a';
           })
           console.log(newfarr);                  //["a"]

          ----------------------------------- every函数 -------------------------------------    
           //every函数(所有都满足条件才为true)
           var arr = [5, 6, 7, 8]
           var result = arr.every(function(item, index) {
               console.log(index + ":" + item);   //0:5 1:6 2:7 3:8
               return item > 4
           })
           console.log(result);                    //true

          --------------------------------- some函数 -------------------------------------
           //some函数(只要有一个满足条件就为true)
           var arr = [1, 2, 3, 4]
           var r = arr.some(function(item, index) {
               console.log(index + ":" + item);    //0:1 1:2 2:3 3:4
               return item > 3 
           })
           console.log(r);                         //true

          --------------------------------- find函数 ------------------------------------
          //find函数(返回符合条件的第一个元素,如果没有符合条件的元素则返回 undefined)
         let arr = ['a', 'b', 'c', 'd'];
         var num = arr.find(function(item, index) {
                console.log(index + ":" + item); //0:a 1:b
                return item === 'b'; 
         })
         console.log(num);            //b

         --------------------------------- findIndex函数 ------------------------------------
          //findIndex函数 (返回符合条件的第一个元素的索引,如果没有符合条件的元素则返回 -1)
          let arr = ['a', 'b', 'c', 'd'];   
          let num = arr.findIndex(function (item,index) {
            console.log(index + ":" + item);  //0:a 1:b 2:c
            return item === 'c';
          }) 
          console.log(num);                   //2
1.png

相关文章

网友评论

      本文标题:JavaScript数组遍历常用方法(简写)

      本文链接:https://www.haomeiwen.com/subject/btlntdtx.html