如何在 JavaScript 对象文字中使用变量作为键？
Aug 28, 2023 am 08:25 AM
在 JavaScript 中，有时我们需要使用变量作为对象键。例如，当从API获取数据并且不确定所有响应数据属性时，我们必须迭代响应对象并存储它的每个属性。
但是，我们在创建对象时不能使用变量作为键，但是创建后，我们可以将变量属性添加到对象中。
语法
用户可以按照以下语法在 JavaScript 对象中使用变量作为键。
object[key] = value;
登录后复制
在上面的语法中，“key”是一个包含某个值的变量。
示例
在下面的示例中，我们创建了包含表属性的对象。此外，我们还创建了“dimensions”变量来存储表的维度。 “key”变量包含“dimensions”作为字符串值。
创建对象后，我们使用“key”变量作为对象属性，使用“dimension”变量的值作为对象属性值。
<html>
<body>
<h2>Using variables as key of JavaScript object</h2>
<div id = "content"> </div>
<script>
let content = document.getElementById("content");
let object = {
"table_id": 1,
"table_name": "table1",
"table_price": 100
};
let dimesions = "100 x 100";
let key = "dimensions";
object[key] = dimesions;
for (let key in object) {
content.innerHTML += key + " : " + object[key] + "<br>";
}
</script>
</body>
</html>
登录后复制
在输出中，用户可以观察到表格尺寸存储为“dimensions”对象的值。
示例
在下面的示例中，我们创建了一个空对象。之后，我们使用 for 循环进行了 10 次迭代。我们在每次迭代中使用“I”作为键，使用 i*i 作为属性值。
通过这种方式，我们将数字的平方存储为值，并将数字本身存储为键。
<html>
<body>
<h2>Using variables as key of JavaScript object</h2>
<div id="content"> </div>
<script>
let content = document.getElementById("content");
let object = {};
for (let i = 0; i < 10; i++) {
object[i] = i * i;
}
content.innerHTML = "The object is: " + JSON.stringify(object) + "<br>";
for (let i = 0; i < 10; i++) {
content.innerHTML += "The square of " + i + " is " + object[i] + "<br>";
}
</script>
</body>
</html>
登录后复制
用户在创建 JavaScript 对象时学会了使用变量作为键。当我们使用变量作为键时，它实际上使用变量的值作为键。
以上是如何在 JavaScript 对象文字中使用变量作为键？的详细内容。更多信息请关注PHP中文网其他相关文章！
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
热门文章
R.E.P.O.能量晶体解释及其做什么（黄色晶体）
2 周前
By 尊渡假赌尊渡假赌尊渡假赌
仓库：如何复兴队友
4 周前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险：如何获得巨型种子
3 周前
By 尊渡假赌尊渡假赌尊渡假赌
击败分裂小说需要多长时间？
3 周前
By DDD
R.E.P.O.保存文件位置：在哪里以及如何保护它？
3 周前
By DDD
热门文章
R.E.P.O.能量晶体解释及其做什么（黄色晶体）
2 周前
By 尊渡假赌尊渡假赌尊渡假赌
仓库：如何复兴队友
4 周前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险：如何获得巨型种子
3 周前
By 尊渡假赌尊渡假赌尊渡假赌
击败分裂小说需要多长时间？
3 周前
By DDD
R.E.P.O.保存文件位置：在哪里以及如何保护它？
3 周前
By DDD
热门文章标签
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3汉化版
中文版，非常好用
禅工作室 13.0.1
功能强大的PHP集成开发环境
Dreamweaver CS6
视觉化网页开发工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
