遍历数组

张利勇发布于2019-08-26 10:11 / 2388人阅读

摘要：方法方法还可以添加新属性方法和两者的主要区别在于他们的迭代方式推荐在循环对象属性的时候使用在遍历数组的时候使用循环出来的是循环出来的是是标准，是标准，兼容性可能存在些问题，请注意使用不能遍历普通的对象，需要和搭配使用方法方法

方法1 -- for

</>复制代码 
var arr = [1,2,3,4,5,6,7,8,9]
for(var i = 0; i
方法2 -- for...in
</>复制代码 
var arr = [1,2,3,4,5,6,7,8,9]
for(var i in arr){
    console.log(arr[i])
    conosle.loh(arr[i] + "/" + i) // 还可以添加新属性
}
方法3 -- for...of
</>复制代码 
var arr = [1,2,3,4,5,6,7,8,9]
for(var i of arr){
    console.log(i)
}
for...in 和 for...of 两者的主要区别在于他们的迭代方式
推荐
在循环对象属性的时候使用for in
在遍历数组的时候使用for of
for...in 循环出来的是key, for...of循环出来的是value
for...in 是ES5 标准，for...of 是ES6标准，兼容性可能存在些问题，请注意使用
for...of 不能遍历普通的对象，需要和Object.keys() 搭配使用
方法4 -- forEach
</>复制代码 
/* forEach方法：被传递给forEach的函数会在数组的每个元素上执行一次，元素作为参数传递给该函数 */
var arr = [1,2,3,4,5,6,7,8,9]
arr.forEach(function(element,index){
    console.log(element)
    console.log(element + "/" + index)
})
【！注意！】未赋值的值是不会在forEach循环迭代的，但是手动赋值为undefined的元素是会被列出的
</>复制代码 
var arr = [1,,3,undefined,5,6,7,8,9]
arr.forEach(function(element,index){
    console.log(element + "/" + index)
})
方法5 -- map
map 遍历数组，并通过callback对数组元素进行操作，并将所有操作结果放入数组中并返回该数组
</>复制代码 
var arr = [1,2,3,4,5,6,7,8,9]
var arr2 = arr.map(function(item){
    console.log(item )
 })
方法6 -- filter
filter()返回一个包含所有在回调函数上返回为true的元素新数组，回调函数在此担任的是过滤器的角色，当元素符和条件，过滤器就返回true,而filter则会返回所有符合过滤条件的元素
</>复制代码 
var arr = ["aaa","bbb","ccc",1,2,3]
var arr2 = arr.filter(function(item){
    if(typeof item == "number"){
        return item;
    }
})
console.log(arr2);
方法7 -- every
every() 当数组中的每一个元素在callback上被返回true时就返回true(注意：要求每一个单元项都返回true时才为true)
</>复制代码 
var arr = ["aaa","bbb","ccc",1,2,3]
var bol = arr.every(function(element){
    if(typeof element == "string"){
        return element;
    }
})
console.log(bol); //false
every()与filter()的区别是：后者会返回所有符合过滤条件的元素；前者会判断是不是数组中的所有元素都符合条件，并且返回的是布尔值
方法8 -- some
some()只要数组中有一项在callback上就返回true
</>复制代码 
var arr = ["aaa","bbb","ccc",1,2,3]
var arr = ["first","second","third" ,"fourth",3,5,8];
var bol = arr.some(function(element){
    if(typeof element == "string"){
        return element;
    }
})
console.log(bol); //true
every()与some()的区别是：前者要求所有元素都符合条件才返回true,后者要求只要有符合条件的就返回true

云服务器 GPU云服务器数组遍历遍历数组遍历筛选数组遍历二维数组

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105753.html

php数组原理遍历原理揭秘

摘要：数组原理遍历原理揭秘数组原理遍历原理揭秘可见，数组其实已经改变了，但是遍历出来的并没有增加的哪一项。此时，我们也可以输出一下当前指针位置数组原理遍历原理揭秘数组原理遍历原理揭秘数组指针停留在了位置上。 php中的中的数组跟js里面数组是不大一样的。php中数组的下标可以整数也可以是字符串，而且数组中元素的顺序不是由下标决定的，而是由添加元素的顺序。数组基础 $arr1 = array(...

wanghui 2019-06-27 15:35 评论0 收藏0
JavaScript：遍历

摘要：中可以实现遍历的数据类型主要是对象，其中包括普通对象与数组。遍历器是一种接口，为各种不同的数据结构提供统一的访问机制。实例五遍历器对象实例五是的遍历过程，通过手动调用其对象的方法实现信息获取。为每个数组元素执行函数。前言将依据自身痛点学习，计划对原生JavaScript写一个系统，本文为第一篇，感兴趣的同学可以关注个人公众号：ZeroToOneMe，或者github博客，将持续...

ThinkSNS 2019-08-23 17:51 评论0 收藏0
JS 数组循环遍历方法的对比

摘要：循环方法方法不改变原数组方法会给原数组中的每个元素都按顺序调用一次函数。筛选出过滤出数组中符合条件的项组成新数组代码方法方法为数组中的每个元素执行一次函数，直到它找到一个使返回表示可转换为布尔值的值的元素。 showImg(https://segmentfault.com/img/bV2QTD?w=1600&h=500); 前言 JavaScript 发展至今已经发展出多种数组的循环遍...

BlackFlagBin 2019-08-26 11:31 评论0 收藏0
Array的迭代器

摘要：如上图所示，本文主要阐述了的四种迭代器，，和的功能和区别动态数组每次遍历开始时都会重新计算一次数组的长度稀疏数组不会跳过无效数组动态数组与一样，会遍历到新增加的元素稀疏数组也不会跳过无效数组特点可以遍历字符串可以遍历类数组对象对象可 showImg(https://segmentfault.com/img/bV4PxL?w=3134&h=932); 如上图所示，本文主要阐述了Array...

Turbo 2019-08-22 15:04 评论0 收藏0
Js之浅拷贝深拷贝与对象数组的遍历

摘要：判断是深拷贝对象还是数组如果要拷贝的对象的属性依然是个复合类型，递归运用递归，当要拷贝的对象或者数组的属性依然是个对象或者数组时，递归调用。遍历对象聊完了深拷贝和浅拷贝，接下来说一下遍历。在js这门语言中，数据存放在堆中，而数据的引用的存放在栈中。浅拷贝我们说的浅拷贝，指的是，引用地址的拷贝，栈中两块不同的引用地址都指向了堆中同样一块区域。所以，我们通过一个地址修改了堆中的数据，...

liangzai_cool 2019-08-22 14:59 评论0 收藏0
jS:关于对象遍历和数组遍历的那些事

摘要：如图遍历数组遍历数组元素并以某种方式处理每个元素是一个常见的操作。如图不过，里的功能比较强大，可以遍历而且返回值是的则被省略掉总结遍历对象，遍历出来的是键名，而不是键值，参数必须是对象。可能是由于职业的关系，下班之后完全不想Open PC，但很多知识点有必要自己做个小小总结。本人之前对原生Array和Object完全没概念。遍历对象的方法： Object.keys(Object)...

qingshanli1988 2019-08-20 18:16 评论0 收藏0