map, filter, some, every , find, forEach, for..in, for...of等使用方法说明

let arr = [1, 2, 3, 4, 5];


// map 使用 (处理数组,返回数组)
var res = arr.map( item => { 
    return item * 2;
});
// res: [2, 4, 6, 8, 10]


// filter 使用  (删选符合条件元素,返回数组)
var res = arr.filter( item => {
    return item > 3;
});
// res: [4, 5]


// some 使用  (判断是否有元素符合条件,返回boolean)
var res = arr.some( item => {
    return item > 3;
});
// res: true


// every 使用  (判断每个元素是否符合条件,返回boolean))
var res = arr.every( item => {
    return item > 3;
});
// res: fasle


// find 使用   (找到第一个符合条件元素,返回该元素,否则返回undefined)
var res = arr.find(item => {
    return item > 1
})  
// res: 2


// includes 使用 (查找数组中是否包含该元素,返回boolean)
var res = arr.includes(2)
// res: true


// forEach 使用 (没有返回值,只针对元素调用func, 不能使用break,return终止循环)
var res = [];
arr.forEach(item => {
    res.push(item*2)
})
// res: [2, 4, 6, 8, 10]


// reducer 使用 (常用于累加, 不作累加时可替代forEach)
array.reduce(function(total, currentValue, currentIndex, arr), initialValue);
var sum= arr.reduce(function(total,num){ //第一个参数为叠加总值,需要初始化,第二个参数是当前项
    return total+ num;
  },0);    //后面这个参数零是sum的初始化, 意思是从零开始累加
// sum : 15
// 用法二 筛选
var arr1 = [{id:1,name:2},{id:2,name:2},{id:3,name:2}]
var sum = arr1.reduce((arr,cur)=>{
arr.push(cur.id);
return arr
},[])
// sum [1,2,3]
// 用法三 list转换对象
[{id:1,name:2},{id:2,name:2},{id:3,name:2}].reduce((t,c,i)=>{
    t[i] = c;
    return t;
},{})

// {0: {…}, 1: {…}, 2: {…}}
// 0: {id: 1, name: 2}
// 1: {id: 2, name: 2}
// 2: {id: 3, name: 2}


// for in 使用  (只为循环enumerable(可枚举)对象而设计,不推荐遍历数组,key为键名)
// 注意 : for...in 是遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性
let obj = {name:"Tom",age:17};
for(var key in obj){
    console.log(key)
}
// name age


// for of 使用 (可循环Arrays(数组), Strings(字符串), Maps(映射), Sets(集合)等可迭代的数据结构等。)
// 注意: for...of 不能遍历对象
for(var value of arr){
    console.log(value)
}
// 1 2 3 4 5
let mapData = new Map([['a', 1], ['b', 2], ['c', 3]]);
for(var [key,value] of mapData ){
    console.log(value)
}
// 1 2 3


// indexOf() 使用 (搜索数组或者字符串是否存在搜索元素, 存在返回当前元素索引,不存在返回-1)
// 可传两个参数, 第一个是要搜索的元素, 第二个是开始搜索的位置(详细使用查手册)
arr.indexOf(2) 
// 1


// lastIndexOf()  (用法同indexOf, 不过是逆序搜索)



// Object.keys(),Object.values(),Object.entries() 使用
let obj = {name:"Tom",age:17};

var res = Object.keys(obj)
// res : ["name", "age"]

var res = Object.values(obj)
// res : ["Tom", "17"]

var res = Object.entries(obj)
// res : [["name","Tom"], ["age",17]]


// 补充一点 虽然for...of不能遍历对象, 
// 但是配合Object.keys(),Object.values(),Object.entries() 使用就无敌了


let {keys, values, entries} = Object;
let obj = { a: 1, b: 2, c: 3 };
 
for (let key of keys(obj)) {
  console.log(key); // 'a', 'b', 'c'
}
 
for (let value of values(obj)) {
  console.log(value); // 1, 2, 3
}
 
for (let [key, value] of entries(obj)) {
  console.log([key, value]); // ['a', 1], ['b', 2], ['c', 3]
}

 

补充 : map, filter, some, every , find, forEach 都方法可传两个参数, 第一个参数是值, 第二个参数是索引值, 更详细的使用请查手册

你可能感兴趣的:(JavaScript,前端小知识,快速开发)