一,for循环处理大型数据数据较为合适

const numbers = […Array(999999).keys()];
console.log(numbers);

二,map用于对数组中的每个元素执行指定的回调函数,并返回一个新数组。

let arr = [{name:’华为’,price:’8888′},{name:’小米’,price:’66666′},{name:’苹果’,price:’55555′}]
let newArr = arr.map(item =>{//返回一个新数组
return item.name
})
// let newArr = arr.map(item => item.name)  //不用return 
 
console.log(newArr);
// [‘华为’, ‘小米’, ‘苹果’]

修改内容时要展开数组

let arr = [{name:’华为’,price:’8888′},{name:’小米’,price:’66666′},{name:’苹果’,price:’55555′}]
let newArr = arr.map(item =>{
     return {
…item,//展开才能操作
price:item.price + ‘元’,
nunmber:20//添加新元素
}
//let newArr = arr.map(item =>({…item,piece:item.piece + ‘元’,}));//不用return形式时要加一个小括号
});
// {name: ‘华为’, piece: ‘8888元’}
// {name: ‘小米’, piece: ‘66666元’}
// {name: ‘苹果’, piece: ‘55555元’}
 
console.log(newArr);

修改参数名称

let arr = [{name:’华为’,price:’8888′},{name:’小米’,price:’66666′},{name:’苹果’,price:’55555′}]
let newArr = arr.map(({name,price})=>{
return{
company:name,
newprice:price
}
});
 
// {company: ‘华为’, newprice: ‘8888’}
// {company: ‘小米’, newprice: ‘66666’}
// {company: ‘苹果’, newprice: ‘55555’}

应用展示

let arrs = [1,2,3];
let data = arrs.map(async item=>{
let res = await uni.request({
url:”http://jsonplaceholder.typicode.com/posts/”+item
});
return res;
})
// console.log(data);//返回都是promise格式
Promise.all(data).then(res=>{
console.log(res);
})//对于下一步要上一步的返回参数时是不适用的

三,返回一个新数组,包含通过测试的所有元素

//主要是在数组中使用,比如属于动漫的标记type=“cartoon”在壁纸分类中筛选一下就行

let arrs = [{id:1,name:”cpp”},{id:2,name:”Java”},{id:null,name:”小程序”},{name:”mysql”},{id:3,name:”php”}];
let newArrs = arrs.filter(item=>{
return item.id
})
console.log(newArrs);

// {id: 1, name: ‘cpp’}
// {id: 2, name: ‘Java’}
// {id: 3, name: ‘php’}

map与filter联合使用

let arrs = [{id:1,name:”cpp”},{id:2,name:”Java”},{id:null,name:”小程序”},{name:”mysql”},{id:3,name:”php”}];
let newArrs = arrs.filter(item=>{
return item.id
}).map(item=>{
return {
…item,
author:”秋华”
}
})
console.log(newArrs);
// {id: 1, name: ‘cpp’, author: ‘秋华’}
// {id: 2, name: ‘Java’, author: ‘秋华’}
// {id: 3, name: ‘php’, author: ‘秋华’}

四,reduce 常用于计算总和、拼接字符串、扁平化数组等操作

1.求和

 const numbers = [1, 2, 3, 4, 5]; const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); console.log(sum); // 15

2.扁平化嵌套数组

const nestedArray = [[1, 2], [3, 4], [5]]; const flatArray = nestedArray.reduce((accumulator, currentValue) => { return accumulator.concat(currentValue); }, []); console.log(flatArray); // [1, 2, 3, 4, 5]

计算常用到购物车上

let arr = [{name:’华为’,price:8888},{name:’小米’,price:66666},{name:’苹果’,price:55555}]
let newArr = arr.reduce((prev,current)=>{
return prev+current.price
},0)
 
console.log(newArr);//131109

五,every只要数组中的某个元素未通过测试,every 方法就会立即返回 false;如果所有元素都通过测试,则返回 true

//这个可以返回true和false,可以跟按钮绑定在是否选中上使用,比如买东西时卖完了,就无法选中

const users = [ { name: ‘Alice’, age: 25 }, { name: ‘Bob’, age: 30 }, { name: ‘Charlie’, age: 35 } ];
const allAdults = users.every(user => user.age >= 18);
console.log(allAdults); // true,因为所有用户都成年

六,include用于判断一个数组或字符串是否包含指定的元素或字符。它返回一个布尔值,表示该元素或字符是否存在

const fruits = [‘apple’, ‘banana’, ‘cherry’];
const hasBanana = fruits.includes(‘banana’);
console.log(hasBanana);

// true //const hasGrapes = fruits.includes(‘grapes’);
//console.log(hasGrapes); // false

const fruits = [‘apple’, ‘banana’, ‘cherry’];
const fetchSome = [‘apple’,’grapes’]
const hasBanana = fetchSome.every(item=>fruits.includes(item))
console.log(hasBanana);//false


const fruits = [‘apple’, ‘banana’, ‘cherry’];
const fetchSome = [‘apple’,’banana’];
const hasGrapes = fruits.includes(fetchSome);
console.log(hasGrapes); // false

//比较数组差异

咸鱼还是鱼
最后更新于 2024-10-04