1.forEach ()
forEach 和 map 的作用类似，都是循环数组去做一些事情，区别在于 map 会返回一个新数组，而 forEach 不会返回
// forEach
var arr = [
{ id: 1, age: 18 },
{ id: 2, age: 24 },
{ id: 3, age: 26 },
{ id: 4, age: 19 },
]
var newArr = arr.forEach( item => {
item.age++
return item
})
console.log(arr,newArr);
// [……]， undefined
// map
var arr = [
{ id: 1, age: 18 },
{ id: 2, age: 24 },
{ id: 3, age: 26 },
{ id: 4, age: 19 },
]
var newArr = arr.map( item => {
item.age++
return item
})
console.log(arr,newArr);
// [……]， [……]
//判断数组中的值是否都相等
let arr = ['1','1','1','1'] , b = 0;
aaa.forEach(item => {
if (item !== aaa[0]) {
b++
}
})
if (b === 0) {
console.log("完全相同");
} else {
console.log("不完全相同");
}
2.map()
const dataList= [
{
value: 1,
name: '蓝天'
},{
value: 2,
name: '白云'
},{
value: 3,
name: '花'
},{
value: 4,
name: '草'
}
]
// 只获取dataList里面的value,
const valueList= dataList.map(item=>{
return item.value
})
console.log(valueList)
// [1,2,3,4]
// 获取value加上name的合并字符串
const nameList= dataList.map(item => {
return item.value+ item.name
})
console.log(nameList)
// ["1蓝天", "2白云", "3花", "4草"]
//替换数组对象的键名
let result = dataList.map(item => ({
id: item.value,
title: item.name
}));
3.find()
find返回数组中第一个满足条件的元素（如果有的话）， 如果没有，则返回undefined。
需要注意的是 find 只会返回第一个符合条件的那一个对象，filter 则是返回所有符合的项组成的新数组
var arr = [
{ id: 1, age: 18 },
{ id: 2, age: 24 },
{ id: 3, age: 20 },
{ id: 4, age: 26 },
{ id: 5, age: 20 },
{ id: 6, age: 19 },
]
var obj = arr.find(item => item.age == 20);
console.log(obj);
// {id: 3, age: 20}
4.filter()
filter过滤, 和map一样，也会返回新数组
需要注意的是 filter 是返回所有符合的项组成的新数组，而find 只会返回第一个符合条件的那一个对象
//获取满足某个条件的一项，构成新数组
var arr = [
{ id: 1, age: 18 },
{ id: 2, age: 24 },
{ id: 3, age: 20 },
{ id: 4, age: 26 },
{ id: 5, age: 20 },
{ id: 6, age: 19 },
]
var obj = arr.filter(item => item.age == 19);
console.log(obj);
// [{id: 6, age: 19}]
//筛选出两个数组不同的元素，构成新数组
let list= [];
list = this.array1.filter(item=> array2.indexOf(item) === -1);
//筛选出两个数组相同的元素，构成新数组
let list= [];
list = this.array1.filter(item=> array2.indexOf(item) !== -1);
5.Array.from()
可以用于把有length属性的对象生成一个新数组，所以可以用他来新建数组，也可以结合Set来做数组的去重。
var arr = [1, 2, 3, 3, 4, 1, 5];
var newArr = Array.from(new Set(arr));
console.log(newArr)
// [1, 2, 3, 4, 5]
6.sort 排序 reverse 数组倒序
var arr = [1, 3, 5, 4, 1, 2, 3, 6, 7]
//从小到大
arr.sort((a,b) => a-b);
console.log(arr) //[1, 1, 2, 3, 3, 4, 5, 6, 7]
//从大到小
arr.sort((a,b) => b-a);
console.log(arr) //[7, 6, 5, 4, 3, 3, 2, 1, 1]
//倒序
var arr = [1, 3, 5, 4, 1, 2, 3, 6, 7]
arr.reverse();
console.log(arr) //[7, 6, 3, 2, 1, 4, 5, 3, 1]
7.reduce（复制可用，对象数组去重，保留后面的元素）
收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。对空数组是不会执行回调函数
// 举例数据：
arr = [
{date:2022-01-01,price:100},
{date:2022-01-01,price:200},
{date:2022-01-02,price:100},
]
// 方法：
unique(arr, name) {
let hash={}
return arr.reduce(function (acc, cru,index) {
if (!hash[cru[name]]) {
hash[cru[name]]={index:acc.length}
acc.push(cru)
}else{
acc.splice(hash[cru[name]]['index'],1,cru)
}
return acc;
}, []);
}
对象数组求和：
let sumprice = array.reduce(function (total, currentValue, currentIndex, arr) {
return total + currentValue.price;
}, 0);
//console.log(sumprice )
8.includes
从已有的菜单列表和后台返回已选中的id列表，筛选选中id对应的数据，组成新数组，勾选回显
var idList= ['1', '3', '5']
var dataList= [{id:'1',name:'qqq'},{id:'2',name:'www'},{id:'3',name:'eee'},{id:'4',name:'rrr'},{id:'5',name:'ttt'}]
var arr = []
dataList.forEach((item, index) => {
if (idList.includes(item.id)) { //筛选没选的 (!idList.includes(item.id))
console.log(item.id);
arr.push(item);
}
});
console.log(arr);
// [{id: "1", name: "qqq"},{id: "3", name: "eee"},{id: "5", name: "ttt"}]
9.some 和 every
some：只要有一个是真，那就返回真
every：跟some是相反，some是只要有一个就行，every是要所有为真才返回真
// 三个参数：遍历项 索引 数组本身
// 配合箭头函数，只要有一个为true，就返回true，一个都true都没有，就返回false
const someArr = [false, true, false, true, false]
const someArr2 = someArr.some((bol, index, arr) => bol)
console.log(someArr2)
//true
// 三个参数：遍历项 索引 数组本身
// 配合箭头函数，需要所有为true，才返回true，否则返回false
const everyArr = [false, true, false, true, false]
const everyArr2 = everyArr.every((bol, index, arr) => bol)
console.log(everyArr2)
//false
最后的最后：这里可以有偿帮你直接解决bug，微芯号18062748486，请备注“Bug 解决”
网友评论