对象和数组的遍历方法

290 阅读2分钟

obj遍历:

for in,

for (var nextKey in nextSource) {   
    // Avoid bugs when hasOwnProperty is shadowed    
    if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) {       
    to[nextKey] = nextSource[nextKey];    
}}

Object.keys().forEach 

Object.keys(filters).forEach(key => {  
    Vue.filter(key, filters[key]);
});

const raw = {
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
};

const allowed = ['item1', 'item3'];
//1
const filtered = Object.keys(raw)
  .filter(key => allowed.includes(key))
  .reduce((obj, key) => {
    obj[key] = raw[key];
    return obj;
  }, {});
//2
Object.keys(raw)
  .filter(key => !allowed.includes(key))
  .forEach(key => delete raw[key]);

console.log(raw);
console.log(filtered);

arr遍历:

forEach(value,index)、对本身操作

map(value, index)、修改的结果return给一个新数组

return categories.map(item => {  
    return {    
        label: item.category,    
        value: item.id,    
        children: parseChildCategory(item)  
    };
});

filter:过滤原来数组,如果返回true这一项放到新数组中

[1,2,3,4].filter((item)=>{
   return item>3
})
//[4]
return this.pageOperate.filter(item => item.resource === operationName).length ? true : false;

for循环、 

for in、for of 

for (let fruit in fruits){
  console.log(fruit);//属性名
}
//唯一一个可以遍历原型上的属性
//判断是否是原型上的属性hasOwnProperty()
for (let fruit of fruits){
  console.log(fruit);//属性值
}

find

var arr = [1,2,3,4];
var result = arr.find(function(item,index){
    return item.toString().indexOf('5')>-1
})
// result:undefined(注意异常处理)
 var result2 = arr.find(function(item,index){
    return item.toString().indexOf('2')>-1
})
//result2:2

some&every

var arr = [1,2,3,4,5];
var someArr =  arr.some(function(item){
    return item>3
});
//someArr : true
var everyArr = arr.every(function(item){
    return item<0
});
//everyArr:false

reduce

(1)计算数组中每个元素出现的次数
	let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];

	let nameNum = names.reduce((pre,cur)=>{
	  if(cur in pre){
	    pre[cur]++
	  }else{
	    pre[cur] = 1 
	  }
	  return pre
	},{})
	console.log(nameNum); //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}
(2)数组去重
	let arr = [1,2,3,4,4,1]
	let newArr = arr.reduce((pre,cur)=>{
	    if(!pre.includes(cur)){
	      return pre.concat(cur)
	    }else{
	      return pre
	    }
	},[])
	console.log(newArr);// [1, 2, 3, 4]
(3)将二维数组转化为一维

	let arr = [[0, 1], [2, 3], [4, 5]]
	let newArr = arr.reduce((pre,cur)=>{
	    return pre.concat(cur)
	},[])
	console.log(newArr); // [0, 1, 2, 3, 4, 5]
(4)将多维数组转化为一维
	let arr = [[0, 1], [2, 3], [4,[5,6,7]]]
	const newArr = function(arr){
	   return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
	}
	console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]
(5)、对象里的属性求和

	var result = [
	    {
	        subject: 'math',
	        score: 10
	    },
	    {
	        subject: 'chinese',
	        score: 20
	    },
	    {
	        subject: 'english',
	        score: 30
	    }
	];

	var sum = result.reduce(function(prev, cur) {
	    return cur.score + prev;
	}, 0);
	console.log(sum) //60