头图

前端-reduce

1.返回指定键值对
function getkeys(obj={},keys=[]){

return Object.keys(obj).reduce((t,v)=>(keys.includes(v)&& (t[v] = obj[v]),t),{})

}
==>
function getkeys(obj={},keys=[]){

 return Object.keys(obj).reduce((t,v)=>{
    if(keys.includes(v)){
        t[v]=obj[v]
 }
    return t;
},{})

}
const target = {a:1,b:2,c:3};
const keyword = ["a","b"];
console.log(getkeys(target,keyword)); //{a:1,b:2}

2.累加累乘
function Accu(...vals){

return vals.reduce((t,v)=>t + v,0)

}
function Mccu(...vals){

return vals.reduce((t,v)=>t * v,1)

}

const a = Accu(1,2,3,4,5); //15
const b = Mccu(1,2,3,4,5); //120

3.权重求和
const scores = [

{score:90,name:"语文",weight:0.5},
{score:95,name:"数学",weight:0.3}

];
const result = scores.reduce((t,v)=>{

return t + v.score * v.weight

},0);
console.log(result); //90.5

4.数组扁平化
function flat(arr = []){

return arr.reduce((t,v)=>t.connat(Array.isArray(v)?flat(v):v),[])

};
const arr = [0,1,[2,3],4,[5,[6,7]]];
console.log(flat(arr)); //[0,1,2,3,4,5,6,7]

5.数组成员个数统计
function count(arr=[]){

return arr.reduce((t,v)=>(t[v]=(t[v]||0)+1,t),{})

};
const arr = [0,1,1,2,2,2];
console.log(count(arr)); //{0:1,1:2,2:3}

6.记录元素出现的位置
function position(arr=[],val){

return arr.reduce((t,v,i)=>(v===val && t.push(i),t),[])

}

const arr = [2,1,5,4,2,1,6,6,7,2];
console.log(position(arr,2)); //0

7.去重
let arr = [

{id:1,name:"绝技"}
{id:2,name:"绝技1"}
{id:1,name:"绝技"}

]
function unique(uniqueArr,arr){

let obj = {};
return uniqueArr.reduce((t,v)=>(!obj[v[key]] &&             (obj[v[key]] = true && t.push(v)),t),[]);

},
console.log(unique(arr),id);

8.过滤数组
const arr1 = [1,2,3,4,5,6];
const arr2 = [2,3,5];
function diff(arr=[],oarr=[]){

return arr.reduce((t,v)=>(!oarr.includes(v) &&             t.push(v),t),[])

}

==>

function diff(arr=[],oarr=[]){

return arr.reduce((t,v)=>{
    if(!oarr.includes(v)){
        t.push(v)    
    }
    return t;
},[])

}
console.log(diff(arr1,arr2)); //[1,4,6]

0 声望
0 粉丝
0 条评论
推荐阅读
从零搭建 Node.js 企业级 Web 服务器(零):静态服务
过去 5 年,我前后在菜鸟网络和蚂蚁金服做开发工作,一方面支撑业务团队开发各类业务系统,另一方面在自己的技术团队做基础技术建设。期间借着 Node.js 的锋芒做了不少 Web 系统,有的至今生气蓬勃、有的早已夭折...

乌柏木141阅读 11.9k评论 10

从零搭建 Node.js 企业级 Web 服务器(十五):总结与展望
总结截止到本章 “从零搭建 Node.js 企业级 Web 服务器” 主题共计 16 章内容就更新完毕了,回顾第零章曾写道:搭建一个 Node.js 企业级 Web 服务器并非难事,只是必须做好几个关键事项这几件必须做好的关键事项就...

乌柏木60阅读 6k评论 16

再也不学AJAX了!(二)使用AJAX ① XMLHttpRequest
「再也不学 AJAX 了」是一个以 AJAX 为主题的系列文章,希望读者通过阅读本系列文章,能够对 AJAX 技术有更加深入的认识和理解,从此能够再也不用专门学习 AJAX。本篇文章为该系列的第二篇,最近更新于 2023 年 1...

libinfs39阅读 6.2k评论 12

封面图
从零搭建 Node.js 企业级 Web 服务器(一):接口与分层
分层规范从本章起,正式进入企业级 Web 服务器核心内容。通常,一块完整的业务逻辑是由视图层、控制层、服务层、模型层共同定义与实现的,如下图:从上至下,抽象层次逐渐加深。从下至上,业务细节逐渐清晰。视图...

乌柏木39阅读 7.1k评论 6

CSS 绘制一只思否猫
欢迎关注我的公众号:前端侦探练习 CSS 有一个比较有趣的方式,就是发挥想象,绘制各式各样的图案,比如来绘制一只思否猫?思否猫,SegmentFault 思否的吉祥物,是一只独一无二、特立独行、热爱自由的(>^ω^&lt...

XboxYan42阅读 2.8k评论 14

封面图
还在用 JS 做节流吗?CSS 也可以防止按钮重复点击
举个例子:一个保存按钮,为了避免重复提交或者服务器考虑,往往需要对点击行为做一定的限制,比如只允许每300ms提交一次,这时候我想大部分同学都会到网上直接拷贝一段throttle函数,或者直接引用lodash工具库

XboxYan34阅读 2.2k评论 2

封面图
从零搭建 Node.js 企业级 Web 服务器(二):校验
校验就是对输入条件的约束,避免无效的输入引起异常。Web 系统的用户输入主要为编辑与提交各类表单,一方面校验要做在编辑表单字段与提交的时候,另一方面接收表单的接口也要做足校验行为,通过前后端共同控制输...

乌柏木32阅读 6.1k评论 9

0 声望
0 粉丝
宣传栏