1.最传统方法 for循环
var arr = ["first","second","third","fourth",3,5,8];
for(var i = 0; i < arr.length;i++){
console.log(arr[i]);
}
//输出:
first
second
third
fourth
3
5
8
for… in
var arr = ["first","second",'third' ,"fourth",3,5,8];
for(var i in arr){
console.log(arr[i] +'/' + i);
}
//输出结果为:
first/0
second/1
third/2
fourth/3
3/4
5/5
8/6
for…of
var arr = ["first","second",'third' ,"fourth",3,5,8];
for(var item of arr){
console.log(item);
}
//输出结果:
first
second
third
fourth
3
5
8
虽然for… in 、 for… of 都能够变历数组,但是两者还是有很大区别的,先说结论:
两者的主要区别在于他们的迭代方式
推荐在循环对象属性的时候,使用for in,在遍历数组的时候推荐使用for of
for…in 循环出来的是key, for…of循环出来的是value
for…in 是ES5 标准,for …of 是ES6标准,兼容性可能存在些问题,请注意使用
for…of 不能遍历普通的对象,需要和Object.keys() 搭配使用
var arr = ["first","second",'third' ,"fourth",3,5,8];
//给数组添加新属性
arr.name = 'zhangsan';
for(var item of arr){
console.log(item);
}
//输出:
first
second
third
fourth
3
5
8
console.log('--------------分隔符----------------');
for(var item in arr){
console.log(arr[item] + '/' + item);
}
//输出:
first/0
second/1
third/2
fourth/3
3/4
5/5
8/6
zhangsan/name
从上述代码可知:for...in 循环除了遍历数组元素外,还会遍历自定义属性,for...of只可以循环可迭代的可迭代属性,不可迭代属性在循环中被忽略了
2.foreach方法:被传递给foreach的函数会在数组的每个元素上执行一次,元素作为参数传递给该函数
var arr = ["first","second","third","fourth",3,5,8];
//element 表示arr的单元项,index 表示arr单元项对应的索引值
arr.forEach(function(element,index){
console.log(element + '/' + index);
})
//输出结果:
first/0
second/1
third/2
fourth/3
3/4
5/5
8/6
注意:未赋值的值是不会在foreach循环迭代的,但是手动赋值为undefined的元素是会被列出的
var arr1 = ["first","second", ,"fourth",3,5,8];
arr1.forEach(function(element,index){
console.log(element + '/' + index);
})
//输出结果
first/0
second/1
fourth/3
3/4
5/5
8/6
3.map 遍历数组,并通过callback对数组元素进行操作,并将所有操作结果放入数组中并返回该数组 //map()返回一个新数组,原数组不会改变。
var arr = ["first","second",'third' ,"fourth"];
var arr2 = arr.map(function(item){
return item.toUpperCase();
})
console.log(arr2);
//输出:
[FIRST,SECOND,THIRD, FOURTH]
4.filter( )返回一个包含所有在回调函数上返回为true的元素新数组,回调函数在此担任的是过滤器的角色,当元素符和条件,过滤器就返回true,而filter则会返回所有符合过滤条件的元素
var arr = ["first","second",'third' ,"fourth",3,5,8];
var arr3 = arr.filter(function(item){
if(typeof item == 'number'){
return item;
}
})
console.log(arr3);
//输出结果:
[3,5,8]
5. every() 当数组中的每一个元素在callback上被返回true时就返回true(注意:要求每一个单元项都返回true时才为true)
every()与filter()的区别是:后者会返回所有符合过滤条件的元素;前者会判断是不是数组中的所有元素都符合条件,并且返回的是布尔值
var arr = ["first","second",'third' ,"fourth",3,5,8];
var bol = arr.every(function(element){
if(typeof element == 'string'){
return element;
}
})
console.log(bol); //false
6.some()只要数组中有一项在callback上就返回true
every()与some()的区别是:前者要求所有元素都符合条件才返回true,后者要求只要有符合条件的就返回true
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
7.split() 根据特定字符把字符串分割成数组,不会改变原字符串
let str = '2020/09/07:40'
let tt = str.split('/') //["2020", "19", "16:40"]
8.slice(index1,index2) 创建一个新数组,不会改变原数组,index1开始位置,index2结束位置,如果就一个参数就从开始位置到最后
let arr1 = [1,2,3,4,5,6,7,8]
let arr2 = arr1.slice(1,3) //[2,3]
9.splice(index,num,item) index坐标位置,num要删除的数量,item添加的值 //会改变原数组
let arr1 = [1,2,3,4,5,6,7,8]
let arr2 = arr1.splice(1,3,'item') // [1,'item',5,6,7,8]
原文:https://blog.csdn.net/qq_36846234/article/details/78909559