如何在给js起变量名时,拼接变量?

需求

最近在传参时,需要给成吨的变量起名,例如:tree_1, tree_2, tree_3,甚至是这种:testList[0].id,testList[0].name,testList[1].id,testList[1].name…

问题

本想着在循环中拼接字符串与变量 i

// 错误示范 错误示范 错误示范 
for(let i = 0;i < 20, i++;){ 
let 'tree_' + i = ’balabala‘;
}

经过尝试,这种方法不可行,原因是:在定义变量时,=号的左边不许使用表达式

解决方法

经查阅与测试,整理到以下3种比较常用的处理方式:

1.通过对象的形式

一个对象可以有多个属性,每个属性都有属性名和属性值。
所以,这种方式的思路是:
把原本要起的变量名当成对象的一个属性名,把原本要给变量赋的值赋给此属性名。

好比:
let 'a' + i = 'balabala'//错误!
let test = { 'a'+i : 'balabala'}//正确!

之后在使用变量a+i时候就可以通过调用test这个对象的 a+i属性来访问变量值。

举个正确例子

//正确方法
var test = { };
    for(var i = 0; i < 20; i++){ 
        test['test_'+i]=‘你想要赋的值’;
    }
console.log(test_0); //输出:ReferenceError: test_0 is not defined
console.log(test['test_0']); //输出:你想要赋的值

2.通过数组的形式

使用数组与使用对象的形式实现原理一致,只是代码稍有区别

//正确示例
var test = [];
    for(var i = 0; i < 3; i++){ 
        test[i]='我是字符串'+i;
    }
console.log(test[0]); //输出:我是字符串0

3.利用window全局变量

这个方法可读性较高,不过只能生成全局变量。

    var name = "test";//在这里拼接想要的变量
    window[name] = "内容";
    console.log(window[name]);  //输出:内容
    console.log(name);  //输出:test

后记

在给对象赋值属性之后,调用该属性的时候有两种写法

let demo = { };
let name = 'wantName';
demo[name] = 'value';//赋值

//第一种写法
console.log(demo.wantName)//输出:value

//第二种写法
console.log(demo[name])//输出:value

//注意:下面这种是错误的,编译不通过
console.log(demo[wantName])
    原文作者:团长95
    原文地址: https://blog.csdn.net/GGGyp/article/details/93629672
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞