Vue.js多个数组转化为数组对象

最终处理方法写在前面方便复制:

//xx是每个页面的标头第一个名字不一样所以需要动态传,扩展参数是所有的数据数组
function funtab(xx, ...e) {
    let arr = [
        "2021年",
        "2020年",
        "2019年",
        ......
    ];
    arr.unshift(xx);
    let contarr = [...e];
    let contobj = [];
    // 所有数组数据
    contarr.forEach((itemm, i) => {
        let obj = {}
        // 年份=》key值
        arr.forEach((item, index) => {
            obj[item] = itemm[index];
        });
        contobj.push(obj);
    });
    return contobj;
}

背景:

有多个表格需要写死在页面,需要前端自己去wps表格里复制

element表格需要是数据结构是这样的:

 

思路:

第一步:直接复制出来数据后用逗号分割成数组

每个页面都需要用到年份,所以我们直接在工具函数里写死就可以        

最后页面直接复制给表格数据:

 

补充:

因为在抒写代码中开始想用到声明多个变量的方法,所以总结了一下

使用JavaScript动态变量名 

在编程中,动态变量名称在脚本中没有硬编码的特定名称。它们使用来自其他来源的字符串值动态命名。JavaScript 中很少使用动态变量。但在某些情况下,它们很有用。

eval(): eval() 函数计算在参数中表示为字符串的 JavaScript 代码。字符串作为参数传递给 eval()。如果字符串表示表达式,则 eval() 计算表达式。在 eval() 中,我们传递一个字符串,其中声明了变量valuei ,并为每次迭代分配了i的值。eval() 函数执行此操作并使用分配的值创建变量。下面给出的代码实现了使用 eval() 创建动态变量名。

   var k = 'value';
    var i = 0;
    for(i = 1; i < 5; i++) {
        eval('var ' + k + i + '= ' + i + ';');
    }
    console.log("value1=" + value1);
    console.log("value2=" + value2);
    console.log("value3=" + value3);
    console.log("value4=" + value4);
输出
value1=1
value2=2
value3=3
value4=4

 Window 对象: JavaScript 总是定义一个全局对象。当程序创建全局变量时,它们被创建为全局对象的成员。window 对象是浏览器中的全局对象。任何全局变量或函数都可以通过 window 对象访问。在定义了一个全局变量之后,我们可以从 window 对象中访问它的值。下面给出的代码使用窗口对象实现动态变量名称。因此,代码基本上为 i 的每次迭代创建一个动态名称为“valuei”的全局变量,并为其分配一个i的值。稍后,这些变量可以在脚本中的任何地方访问,因为它们成为全局变量。

 var i;
    for(i = 1; i < 5; i++) {
        window['value'+i] = + i;
    }  
    console.log("value1=" + value1);
    console.log("value2=" + value2); 
    console.log("value3=" + value3); 
    console.log("value4=" + value4);
输出
value1=1
value2=2
value3=3
value4=4

如果大家对此比较感兴趣,想了解更多相关知识,可以关注一下前端老实人↓↓↓

猜你喜欢

转载自blog.csdn.net/weixin_52691965/article/details/128531726
今日推荐