JavaScript 两个对象数组的更新迭代

0001年1月1日 2 分钟阅读

场景：页面开始会有一个对象数组 objAry，每隔一段时间会从服务器上请求到一个 objAry1 的对象数组
要求：以 price 为基础，相同的 price 的对象，obj1 是最新的，需要替换掉 obj 中对应 price；
如果 sprice 相同，obj1 中对应 number 为 0，则该项目需要去掉；
如果 obj1 中有 obj 不存在的 sprice，则需要插入进去

获取和迭代会非常的频繁，对执行效率有比较高的要求；

开始的源数据；

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


var obj = [
    { "price": 11.00089, "number": 5.0179, "heji": 123.980 },
    { "price": 0.189, "number": 5.01, "heji": 1 },
    { "price": 0.00009, "number": 1, "heji": 10 },
    { "price": 0.00008, "number": 2, "heji": 10 },
    { "price": 0.00009101, "number": 15.01, "heji": 123.980 },
    { "price": 0.00109102, "number": 15.01, "heji": 3.08 }
];
var obj1 = [
    { "price": 11.00089, "number": 1, "heji": 123.980 },
    { "price": 0.189, "number": 0, "heji": 1 },
    { "price": 1.189, "number": 2, "heji": 1 }
];

最终需要的数据

1
2
3
4
5
6
7
8


[
    { price: 11.00089, number: 1, heji: 123.98 },
    { price: 0.00009, number: 1, heji: 10 },
    { price: 0.00008, number: 2, heji: 10 },
    { price: 0.00009101, number: 15.01, heji: 123.98 },
    { price: 0.00109102, number: 15.01, heji: 3.08 },
    { price: 1.189, number: 2, heji: 1 }
]

首先按照要求先整理思路；如下；

思路整理

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65


/*
*
* sourcesData   : 源数据,基础数据；
* updateData    ：需要更新的数据
* key           ：Merge的依据key；比如 price
* deleteFlag    : 如果哪个key为0，则删除；比如number
* */
function mergeDataFn(sourcesData,updateData,key,deleteFlag){
    //判断是否数组类型，非数组退出
    if ({}.toString.call(sourcesData) !== '[object Array]') {
        return 'Type Error';
    }

    //为了不修改原有数据 todo 可以优化
    var tempAry = [];
    for (var i = 0; i < sourcesData.length; i++) {
        tempAry[i] = sourcesData[i];
    }

    //转化为对象，利用对象属性的唯一性；
    var toObj=function (ary) {
        var tempObj = {};
        for (var i = 0; i < ary.length; i++) {
        var curKey = ary[i][key];
        tempObj[curKey] = ary[i];//如果对象数组中，有2个相同price的对象，则后一个对象会覆盖前一个；
        }
        return tempObj;
    };

    //Merage2个转化后的对象
    var MerageObj=function (baseObj,updateObj) {
        for (var currentKey in updateObj){
            //如果number=0；删除
            if(updateObj[currentKey][deleteFlag]==0){
            delete baseObj[currentKey];
            continue;
            }
            //没有key ->添加 ； 有的key ->更新
            baseObj[currentKey]=updateObj[currentKey];
        }
        return baseObj
    };
    var resultObj=MerageObj(toObj(tempAry),toObj(updateData));

    //对象还原成数组
    var resultAry=[];//储存最终的结果
    for (var resultKey in resultObj){
        resultAry.push(resultObj[resultKey])
    }
    return resultAry;
}

var base = [
    { price: '0.0001', number: 11, heji: 123 },
    { price: '0.0001', number: 14, heji: 123 },
    { price: '0.0002', number: 15, heji: 128 }
];
var update1 =[
    { price: '0.0001', number: 7, heji: 777 },
    { price: '0.0003', number: 3, heji: 333 },
    { price: '0.0002', number: 0, heji: 888 }
];
var currentResult=mergeDataFn(base,update1,'price','number');
console.log(currentResult);

然后整理优化代码，优化后的核心代码如下；

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14


//核心代码如下
obj = obj.concat(obj1);
var tempobj = {};
obj.forEach(function (item, index) {
    var skey = item.price;
    tempobj[skey] = item;
});
obj = [];
for (var i in tempobj) {
    if (tempobj[i].number !== 0) {
        obj.push(tempobj[i])
    }
}
console.log(obj);

再把核心代码做对应的封装即可；

首先按照要求先整理思路；如下；

本文目录