循环的N种写法

protype,json都算进去

先总结一下
伪数组的循环方式有,for,for-of
数组的循环方式有for,forEach,map,filter,find,some,every,reduce,for-of
对象的循环方式有for-in,JSON,for-of
Set的循环有forEach,for-of
Set的循环有forEach,for-of

挑重要的说
map,filter
some,every通过循环里返回对象决定最后的结果是对错
reduce,JSON,for-of

map映射

var arr = [11, 'lala', 'haha11', '123'];
var newArr = arr.map(function(x, y, z) {
   // x代表数组的值可读性应该写成item
   // y代表数组的顺序可读性应该写成index
   // z代表原数组可读性应该写成self
   if(Number(x)) {
	return x*10;
   }
})
console.log(arr); //原数组不会变,想改变原数组可以操作第三个参数
console.log(newArr); //[110, undefined, undefined, 1230]

filter过滤

var arr = [11, 'lala', 'haha11', '123'];
var newArr = arr.filter(function(x, y, z) {
   // x代表数组的值可读性应该写成item
   // y代表数组的顺序可读性应该写成index
   // z代表原数组可读性应该写成self
   if(Number(x)) {
	x++;
	return x * 10;
   }
})
console.log(arr); //原数组不会变,想改变原数组可以操作第三个参数
console.log(newArr); //[110,1230]

some一些判断

var arr = [11, 'lala', 'haha11', '123'];
var flag = arr.some(function(x, y) {
   // x代表数组的值可读性应该写成item
   // y代表数组的顺序可读性应该写成index
   // z代表原数组可读性应该写成self
   if(Number(x)) {
        // 自己判断是不是true或false,决定返回值
	return true;
   }
})
console.log(arr); //原数组不会变
console.log(flag); // true,无返回就默认false

every所有判断

var arr = [11, 'lala', 'haha11', '123'];
var flag = arr.every(function(x, y) {
   // x代表数组的值可读性应该写成item
   // y代表数组的顺序可读性应该写成index
   // z代表原数组可读性应该写成self
   if(Number(x)) {
        // 自己判断是不是true或false,决定返回值
	return true;
   }
})
console.log(arr); //原数组不会变
console.log(flag); // false,无返回就默认false

reduce计算
这个是个非常秀的循环
他会把上一次循环的结果作为下一次循环的参数,最后返回的是最后一次循环的返回

arr.reduce(callback,[initialValue])
callback (执行数组中每个值的函数,包含四个参数)
1、previousValue (上一次调用回调返回的值,或者是提供的初始值(initialValue))
2、currentValue (数组中当前被处理的元素)
3、index (当前元素在数组中的索引)
4、array (调用 reduce 的数组)
initialValue (作为第一次调用 callback 的第一个参数。)

// 不使用第二个参数
var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
    console.log(prev, cur, index);
    return prev + cur;
})
console.log(arr, sum);  // [1, 2, 3, 4] 10

// 使用第二个参数
var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
    console.log(prev, cur, index);
    return prev + cur;
},100)
console.log(arr, sum);  // [1, 2, 3, 4] 110

// 字母去重
var str = "asdkaldaldadladkadkfjrjgj"
var res = str.split("").reduce((x,y)=>{
	x.includes(y) ? "" : x.push(y)
	return x
},[])
console.log(res)

// 字母个数
var str = "asdkaldaldadladkadkfjrjgj"
var res = str.split("").reduce((x,y)=>{
	x[y] ? x[y]++ : x[y]=1
	return x
},{})
console.log(res)

// vue的data数据取值,获取data.aa.name的值
var data = {
   aa:{
      name:"pdt"
   }
}
var str = "data.aa.name"
str.split(".").reduce(function(x,y){
   return x[y]
})

JSON

const user = {
   id: 229,
   name: 'John',
   email: 'john@awesome.com'
};
function replacer(key, value) {
   console.log(typeof value);
   if (key === 'email') {
   return undefined;
   }
   return value;
}
const userStr = JSON.stringify(user, replacer);
console.log(userStr)

for-of

var arr = [11, 'lala', 'haha11', '123'];
const obj = {
   id: 229,
   name: 'John',
   email: 'john@awesome.com'
};
var set = new Set([11, 'lala', 'haha11', '123']); //一个集合的意思
var map = new Map([
	['aa', 'aa的值'],
	['bb', ['bb的值1', 'bb的值2']]
]); //一个字典的意思

for(var x of arr) {
    console.log(x)
}
for(var [key, value] of Object.entries(obj)) {
    console.log(key,value)
}
for(var [key, value] of set.entries()) {
    console.log(key,value)
}
for(var [key, value] of map.entries()) {
    console.log(key,value)
}
posted @ 2019-12-14 00:59  一个年轻淫  阅读(553)  评论(0编辑  收藏  举报