【JavaScript】-------- JavaScript 5种实用的循环数组数据的方法

野性酷女 2022-01-10 14:41 231阅读 0赞

> 1.这篇文章将会向大家简要的介绍JavaScript里关于数组的最重要的5个方法，这5个方法是每个想要高效的进行JavaScript编程的程序员必须知道的。 (转载处:[http://www.webhek.com/post/5-array-methods-all-javascript-beginners-should-know.html][http_www.webhek.com_post_5-array-methods-all-javascript-beginners-should-know.html])

> 第一种方法:
> 
> ## Array.forEach() ##
> 
> `.forEach()` 方法能够方便的让你 **遍历数组里的每个元素**，你可以在回调函数里对每个元素进行操作。`.forEach()`方法没有返回值，你不需要在回调函数里写`return`，这是无意义的。
> 
>     var animals = ['dog', 'cat', 'mouse'];
>     
>     animals.forEach(function(item){
>         console.log(item);
>     });
>     
>     //输出  dog cat mouse
> 
>  
> 
>     var animals = [  {name:"liyoubing",age:"12"},
>             {name:"hanshifan",age:"11"}];
>     
>             animals.forEach(function(item){
>                 console.log(item);
>             });
>     
>     //item 输出    {name:"liyoubing",age:"12"}   {name:"hanshifan",age:"11"}
> 
>

> 第二种方法：
> 
> ## Array.map() ##
> 
> `.map()` 方法能够遍历整个数组，然后 **返回一个新数组**，这个新数组里的元素是经过了指定的回调函数处理过的。
> 
> （如果你想修改数组里的每个元素，然后将修改后的数组存入新的数组，那使用 .map() 方法最方便。）
> 
>     var numbers = [2, 4, 6, 8];
>     
>     var doubleNums = numbers.map(function(element) {
>         return element * 2;
>     });
>     
>     console.log('doubleNums: ', doubleNums)
>     //输出   [4,8,12,16];
> 
>     var numbers = [ {name:"liyoubing",age:"12"},
>             {name:"hanshifan",age:"11"}];
>     
>     var doubleNums = numbers.map(function(element) {
>         return element.age * 2;
>     });
>     
>     // 输出  [24,22]
> 
>

> 第三种方法:
> 
> ## Array.filter() ##
> 
> `.filter()` 方法能够 **过滤掉数组中的某些元素**，你可以在回调函数里设定条件，不符合条件的元素都会排除在外。
> 
>     var scores = [3, 12, 5, 23, 19, 7];
>     
>     var topScores = scores.filter(function(item){
>         if (item > 10){
>             return true;
>         } else {
>             return false;
>         }
>     });
>     
>     console.log('topScores: ', topScores);
>     
>     //输出  [12,23,19]
> 
>

> 第四种：
> 
> ## Array.indexOf() ##
> 
> `indexOf()` 能够告诉你 **某个元素在数组中的位置**，它返回的是索引值，如果数组里有重复的元素，它会返回第一个元素的位置。
> 
>     var a = [2, 9, 9, 18];
>     
>     var i = a.indexOf(9);
>     
>     console.log('i: ', i);
>     
>     
>     /*
>     if (a.indexOf(7) === -1) {
>       // 数组中没有这个元素
>     }*/
> 
>  
> 
>

> 第五种方法:
> 
> ## Array.every() ##
> 
> `.every()` 方法的作用是用指定的回调函数去检查数组中的每个元素，如果对于每个元素，这个回调函数都返回true，则`.every()`返回true。否则，`.every()` 返回false。
> 
> (如果你想知道数组中的所有元素都是否符合某种条件，使用 .every() 最方便。)
> 
>     var ages = [23, 19, 32, 44];
>     
>     var olderThan18 = ages.every(function(element) {
>         return element > 18;
>     });
>     
>     console.log('olderThan18: ', olderThan18);
>     
>     //输出结果 true  判断数组都复合大于18的条件？ 如果都符合返回 true  否则: false
> 
>

[http_www.webhek.com_post_5-array-methods-all-javascript-beginners-should-know.html]: http://www.webhek.com/post/5-array-methods-all-javascript-beginners-should-know.html