reduce 數據處理 最全解析

求和

const sum = [1,2,3,4,5,6].reduce((v,t) =>{
    return v + t
},0)
複製代碼

將字符串首字母大寫

const joined = "this-is-an-example"; //This Is An Example
joined.split('-');
joined.map(word=>{
    const [head,...others] = word
    return head.toUpperCase() + others.reduce((x,y) => x+y,"")
})
joined.reduce((s,word) => {
    retrun s + " " + word 
})
複製代碼

篩選

const students = [
    {id : 1 ,name : "zs" ,score :99,class: 2},
    {id : 2 ,name : "ls" ,score :89,class: 2},
    {id : 3 ,name : "ww" ,score :39,class: 2},
    {id : 4 ,name : "cl" ,score :69,class: 1},
    {id : 5 ,name : "qq" ,score :70,class: 2},
    {id : 6 ,name : "sb" ,score :28,class: 1}
]
複製代碼

取值

//從列表取出name
//select name from students
const selected = students.reduce(student => {
    return {name:student.name}
});
console.log(selected);

複製代碼

篩選

//篩選全部及格的人
//select name from users where scroe > 60
const selected = students.reduce((list ,student) =>{
    if(student.score > 60){
        list = [...list,student]
    }
    return list;

},[])
console.log(selected);

//通用性封裝 好比年齡，下降耦合性 高階函數
const selsectLargr60 = (list,student)=>{
    if(student.score > 60){
        list = [...list,student]
    }
    return list;
}
const selected = students.reduce(selsectLargr60,[])

//高階函數
const filter = (prediction) =>{
    return (list,student) => {
        if(prediction(student)){
            list = [...list,student]
        }
        return list;
    }
}

const selsectLargr60 = filter(student => student.score > 60)
const selected = students.reduce(selsectLargr60,[])
console.log(selected);

複製代碼

排序

//按照分數排序
//插入排序
//select * from students oeder by score desc
const sorted = students.reduce((list , student) =>{
    let i=0;
    for(; i<list.length ; i++){
        if(list[i].score < student.score){
            break;
        }
    }
    return [...list.slice(0,i),student,...list.slice(i,list.length)]
},[])
console.log(sorted);

//高階

const sortOrder = (conmparator) =>{
    return (list , student) =>{
        let i=0;
        for(; i<list.length ; i++){
            if(conmparator(list[i].score,student.score)){
                break;
            }
        }
        return [...list.slice(0,i),student,...list.slice(i,list.length)]
    }
}
const sorted = students.reduce(sortOrder((list , student) => list.score < student.score),[])
console.log(sorted);

複製代碼

分組

//用map,reduce完成一些sql的操做
//按照班級分組,求最大分數
//select max(score) from students group by class
//目標group的結構
//{ zs: { key: 'zs', values: [ [Object] ] },
// ls: { key: 'ls', values: [ [Object] ] },
// ww: { key: 'ww', values: [ [Object] ] },
// cl: { key: 'cl', values: [ [Object] ] },
// qq: { key: 'qq', values: [ [Object] ] },
// sb: { key: 'sb', values: [ [Object] ] } }


const grouped = students.reduce((groups , student) =>{
    if(!groups[student.class]){
        groups[student.class] = {key:student.class,values : []}
    }
    groups[student.class].values.push(student);
    return groups
},{})

console.log(grouped);

//高階
const groupOrder = (groupName) =>{
    return (groups , student) =>{
        if(!groups[student[groupName]]){
            groups[student[groupName]] = {key:student[groupName],values : []}
        }
        groups[student[groupName]].values.push(student);
        return groups 
    }
}
const grouped = students.reduce(groupOrder('class'),{})
console.log(grouped);

const arrGroups = Object.values(grouped);
const final = arrGroups.map(group =>{
    return {
        class:group.key,
        max:group.values.reduce((a,b) =>{
            return b.score > a ? b.score : a
        },0)
    }
})
複製代碼

filter

const grouped = students.find(student=> student.id === 5)
複製代碼

總結

本質上全部數據都是map/reduce ,因此咱們能夠使用完成大量操做,而高階函數讓咱們最大化的複用這個過程