js中的遍历方法

for循环

最常用的就是for循环,大多数情况下都适用。

let newArr = [1,2,3,4,5,6]
for(var i = 0; i < newArr.length; i++){
  console.log(arr[i])
//1,2,3,4,5,6
}
map方法

循环中途是无法停止的,总是会将所有成员遍历完

map()不会对空数组进行检测,并且不会改变原数组

let arr = [1,2,3,4,5]
let arr2 = arr.map((n)=>{
      return n+1
})
console.log(arr2) // [2,3,4,5,6]
console.log(arr) // [1,2,3,4,5]
//不改变原数组的情况下,返回一个新数组

let arrObj = [{
    id: 1,
    name: 'xingxing'
},{
    id:2,
    name: 'xingxing'
},{
    id:3,
    name: 'xingxing'
}]
//map方法接受一个函数作为参数。该函数调用时,map方法向它传入三个参数:当前成员、当前位置和数组本身。
arrObj.map((item,index,arr)=>{
    console.log(arr)
    console.log(index) 
    console.log(item)
    console.log(item.name) 
    })
//输出结果见下图
foreach

forEach的使用方法和map使用方法差不多,只是forEach方法不返回值,只用来操作数据。

和map()一样循环中途是无法停止的,总是会将所有成员遍历完

let arrObj = [{
    id: 1,
    name: 'xingxing'
},{
    id:2,
    name: 'xingxing'
},{
    id:3,
    name: 'xingxing'
}]
//map方法接受一个函数作为参数。该函数调用时,map方法向它传入三个参数:当前成员、当前位置和数组本身。
arrObj.forEach((item,index,arr)=>{
    console.log(arr)
    console.log(index) 
    console.log(item)
    console.log(item.name) 
    })
//结果同map()

注:以下写法是错的!

let arr = [1,2,3,4,5]
let arr2 = arr.forEach((n)=>{
      return n+1
})
console.log(arr2) // undefine  注意forEach方法不返回值 所以这里是undefine,此写法是错的。
console.log(arr) // [1,2,3,4,5]
for in 针对 对象

可以方便的获取对象的键值。

let obj = {name: 'LiXingxing', sex: 'female', height: '170'}
for(let key in obj){
  console.log(obj[key])
//LiXingxing 
//female 
//170
}
filter过滤

用于过滤数组成员

let arrObj = [{
    id: 1,
    name: 'xingxing1'
},{
    id:2,
    name: 'xingxing2'
},{
    id:3,
    name: 'xingxing3'
}]
let arr2 = arrObj.filter((item,index,arr)=>{
    return (item.name === 'xingxing1')
})
console.log(arr2)  // [{id:1,name:'xingxing1}]
// ES5 中 Array 类中的 filter 方法使用目的是移除所有的 ”false“ 类型元素 (false, null, undefined, 0, NaN or an empty string):

let arr = [1, 2, 3, undefined, null, 0, ""];
let arrNew = arr.filter(Boolean);
console.log(arrNew)  //  [1, 2, 3]
Object.keys遍历对象的属性

ES5 引入了Object.keys方法,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的键名。

var data={a:1,b:2,c:9,d:4,e:5};
    console.log(Object.keys(data));
    Object.keys(data).map((key,item)=>{
        console.log(key,data[key]);
});

猜你喜欢

转载自blog.csdn.net/galaxyJING/article/details/129100608