如何在给js起变量名时，拼接变量？

2022年1月14日 166次阅读 来源: 团长95

需求

最近在传参时，需要给成吨的变量起名，例如：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
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞