JavaScript常用操作
程序员文章站
2022-06-16 11:34:17
两个对象数组 根据相同的id进行合并var arr2 = [{ id: 1, name: '小明' }, { id: 2, name: '卢本伟' }, { id: 3, name: 'PDD' }, { id: 4, name: '大司马' }]var arr1 = [{ id: 1, car: '奔驰' }, { id: 2, car: '宝马' }, { id: 3, car: '劳斯' }, { id: 5, car: '大众' }]const combined = arr2.reduce...
两个对象数组 根据相同的id进行合并
var arr2 = [{ id: 1, name: '小明' }, { id: 2, name: '卢本伟' }, { id: 3, name: 'PDD' }, { id: 4, name: '大司马' }]
var arr1 = [{ id: 1, car: '奔驰' }, { id: 2, car: '宝马' }, { id: 3, car: '劳斯' }, { id: 5, car: '大众' }]
const combined = arr2.reduce((acc, cur) => {
const target = acc.find(e => e.id === cur.id);
if (target) {
Object.assign(target, cur);
} else {
acc.push(cur);
}
return acc;
}, arr1);
console.log(combined)
找出数组中id为4的对象
var arr2 = [{ id: 1, name: '小明' }, { id: 2, name: '卢本伟' }, { id: 3, name: 'PDD' }, { id: 4, name: '大司马' }]
const res = arr2.find(item=>item.id===4)
统计所有商品价格
var arr2 = [{ id: 1, name: '小明',price:11 }, { id: 2, name: '卢本伟',price:78 }, { id: 3, name: 'PDD',price:15 }, { id: 4, name: '大司马',price: 23 }]
const totalAmount = arr2.reduce((sum,item)=>sum+=item.price,0)
console.log('totalAmount',totalAmount)
过滤数组中符合条件的对象 例如过滤价格大于15的商品
var arr2 = [{ id: 1, name: '小明',price:11 }, { id: 2, name: '卢本伟',price:78 }, { id: 3, name: 'PDD',price:15 }, { id: 4, name: '大司马',price: 23 }]
const newArr = arr2.filter(item=>item.price>15)
console.log('newArr',newArr)
对数组的对象属性处理返回新数组 例如价格保留两位小数
var arr2 = [{ id: 1, name: '小明',price:11 }, { id: 2, name: '卢本伟',price:78 }, { id: 3, name: 'PDD',price:15 }, { id: 4, name: '大司马',price: 23 }]
const newArr = arr2.map(item=>{
Number(item.price).toFixed(2)
return item
})
console.log('newArr',newArr)
同时发出多个异步,等待上一个异步回来下一个异步才执行
const arr = [1, 2, 3]
arr.reduce((p, x) => {
return p.then(() => {
return new Promise(r => {
setTimeout(() => r(console.log(x)), 1000)
})
})
}, Promise.resolve())
// promise.all()
// promise.race()
防抖函数 debounce
/*
* fn [function] 需要防抖的函数
* delay [number] 毫秒,防抖期限值
*/
function debounce(fn,delay){
let timer = null //借助闭包
return function() {
if(timer){
//进入该分支语句,说明当前正在一个计时过程中,
//并且又触发了相同事件。所以要取消当前的计时,重新开始计时
clearTimeout(timer)
// 保存此处的 this arguments,因为setTimeout是全局的
// 所以需要需改this指向 如果不修改把定时器的function换成箭头函数
var context = this;
var args = arguments;
timer = setTimeout(function(){
fn.apply(context,args)
},delay)
}else{
timer = setTimeout(fn,delay) // 进入该分支说明当前并没有在计时,那么就开始一个计时
}
}
}
节流throttle
function throttle(fn, delay) {
let timer = null
return function () {
if (!timer) {
//休息时间 暂不接客
return false
}
// 保存此处的 this arguments,因为setTimeout是全局的
// 所以需要需改this指向 如果不修改把定时器的function换成箭头函数
var context = this;
var args = arguments;
// 工作时间,执行函数并且在间隔期内把状态位设为无效
timer = setTimeout(function() {
fn.call(context, args);
clearTimeout(timer)
}, delay)
}
}
获取某一个月的第一天和最后一天
// 0是指最后一天
const last = new Date(new Date().getFullYear(),new Date().getMonth() + 1,0).getDate()
const first = new Date(new Date().getFullYear(),new Date().getMonth() + 1,1).getDate()
console.log('最后一天',last)
console.log('第一天',first)
本文地址:https://blog.csdn.net/weixin_40983119/article/details/111143576