js动态创建对象和属性 | 添加未知属性

经常会在项目中遇到：将前端传入的一些参数属性作为下一个页面的table表表头展现，值作为table的body值。拼接json的记录：我们想要将"身高，体重，胸围，腰围，臀围"作为表头，然后赋值一些默认数据。

我前端用的avue+element-ui。简单代码如下：

let tempStr = "身高，体重，胸围，腰围，臀围"; //前端输入内容，不一定要用逗号隔开
let varArr = new Array();//存分割后的结果  结果作为新对象的属性名称
let varJson = new Object();//临时json变量
let varJson2 = new Object();//临时存放属性值
let ArrJson=new Array();//存放table表头	
let varArr2 = new Array();//临时数据填充容行
let varJson3 = new Object();//最终结果json
if(tempStr.indexOf("，") !=-1){
   varArr = tempStr.split("，");
}
for(let key in varArr) {//遍历  封装

    key=parseInt(key);
    // namePinyin = vPinyin.chineseToPinYin(varArr[key]);  这个是将汉字转拼音的插件。现在用数字代替了
	let namePinyin = key;
    varJson.port=namePinyin; //项目前端用的avue，这所以我这边需要这两个属性
    varJson.label=varArr[key];
	varJson2[namePinyin]="";//值默认为空   这里方括号的意思不是代表数组，而是赋属性，给对象添加属性
    ArrJson[key]={...varJson}; //将两个属性放进一个数组
}
for(var i =0;i<5;i++){//填充空数据
   varArr2[i]=varJson2;
}
varJson3.headTitle=ArrJson;
varJson3.bodyData=varArr2;
console.log(varJson3);

运行结果如下：

              

使用插件后的结果。这里，主要是方括号能给对象动态添加属性。