用 new Function 提高运行效率

javascript/jquery

浏览数:739

2018-12-19

为了减小列表数据的尺寸,后端把json处理成数组返回(类似于csv)。格式如下:

[
    ['basqty','brandfullname','fullname','gid'],
    [470,'金富士','【今日爆款】#金富士土斯动物饼干香蕉牛奶味50g',43945919],
    [470,'金富士','【今日爆款】#金富士土斯动物饼干香蕉牛奶味50g',43945919],
    ...
]

前端获取到数据后解析,格式如下:

[
    {
        "basqty":470,
        "brandfullname":"金富士",
        "fullname":"【今日爆款】#金富士土斯动物饼干香蕉牛奶味50g",
        "gid":"【今日爆款】#金富士土斯动物饼干香蕉牛奶味50g"
    },
    {
        "basqty":470,
        "brandfullname":"金富士",
        "fullname":"【今日爆款】#金富士土斯动物饼干香蕉牛奶味50g",
        "gid":"【今日爆款】#金富士土斯动物饼干香蕉牛奶味50g"
    },
    ...
]

优化前正常的解析代码:

function array2json(array) {
    var keys = array.shift();
    return array.length ? array.map(function (ary) {
        var row= {};
        keys.forEach(function (key, i) {
            row[key] = ary[i]
        })
        return row
    }) : []
}

运行一个 24000 行,每行 94 个字段的数组,大概需要 400 毫秒
图片描述

优化思路:省去中间 forEach 遍历赋值

function array2json(array) {
    var keys = array.shift();
    return array.length ? array.map(function (ary) {
        //如果能够省去中间 forEach 遍历赋值效率会高很多
        return {
            "basqty":ary[0],
            "brandfullname":ary[1],
            ...
        }
    }) : []
}

用 new Function 来构造中间的 return 对象

function listArrayTolistJson(array) {
    var keys = array.shift();
    return array.length ? array.map(new Function("ary", "return {" + keys.map(function (key, i) { return "'" + key + "':ary[" + i + "]" }).join(',') + "}")) : []
}

运行截图,大概快了 7 倍
图片描述

原文地址: