如何在 JavaScript 中创建动态值和对象?
动态值是我们分配给动态变量的值。动态变量是一种通过硬编码在代码中没有特定名称的变量,其地址在代码运行时确定。名称“动态”指的是能够操作和更改的值。
这里我们将看到如何在 JavaScript 中创建动态值(也是对象值的一部分)并更改动态变量名称未来无需访问该组。它指的是我们声明一个变量,然后我们在对象中使用相同的变量作为键之一,将来如果需要更改变量的名称,我们可以在不访问对象的情况下更改它。
要完成上面的任务,我们只需使用方括号 [ ] 在对象中分配变量名称,如下所示 -
语法
以下是创建动态值和对象的语法 -
const key = 'KeyName'; const obj = { [key] : 'value'};
这里key和value是用于创建对象的键值对,“obj”和keyName > 是键的值。
算法
第 1 步 - 定义使用的键创建对象。
第 2 步 - 创建对象并使用上面定义的键。
-
第 3 步 - 对上面创建的对象应用 JSON.stringify() 以显示该对象。
示例1
我们可以使用下面的HTML程序来查看动态变量的声明。
<!DOCTYPE html> <html> <body> <h2> JavaScript Dynamic values </h2> <div id = "result"> </div> <script> const key1 = "Haircolour"; const key2 = "Eyecolour"; const person = { f_name : "Rohan", l_name :"Joshi", [key1] : "Black", [key2] : "Brown" }; // Converting the object value to show its value in html str = JSON.stringify(person); document.getElementById("result").innerHTML = str; // To print value of object in console console.log(person); </script> </body> </html>
因此,在上面的代码中,我们可以看到我们在对象中声明了两个键 f_name 和 l_name ,而没有使用大括号[],并且我们对 key1 和 key2 变量使用大括号,因为这两个是动态值。
在输出中,我们可以看到 key1 变量的名称是 Eyecolour,key2 变量的值是 Haircolour。
示例 2
这里是另一个代码将更多地阐明如何在不访问对象的情况下更改动态变量的名称。这里我们只是在代码中交换两个动态变量的名称。
<!DOCTYPE html> <html> <body> <h2> JavaScript Dynamic values </h2> <div id = "result"> </div> <script> const key1 = "Haircolour"; const key2 = "Eyecolour"; const person = { f_name : "Rohan", l_name :"Joshi", [key1] : "Black", [key2] : "Brown" }; // Converting the object value to show its value in html str = JSON.stringify(person); document.getElementById("result").innerHTML = str; // To print value of object in console console.log(person); </script> </body> </html>
在输出中,我们可以看到两个变量 key1 和 key2 的值保持不变,但它们的名称在不访问对象的情况下发生了更改,因此这就是我们在 JavaScript 中创建动态值和对象的方式。
以上是如何在 JavaScript 中创建动态值和对象?的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

本文讨论了在浏览器中优化JavaScript性能的策略,重点是减少执行时间并最大程度地减少对页面负载速度的影响。

本文讨论了使用浏览器开发人员工具的有效JavaScript调试,专注于设置断点,使用控制台和分析性能。

本文说明了如何使用源地图通过将其映射回原始代码来调试JAVASCRIPT。它讨论了启用源地图,设置断点以及使用Chrome DevTools和WebPack之类的工具。

本文探讨了Java收藏框架的有效使用。 它强调根据数据结构,性能需求和线程安全选择适当的收集(列表,设置,地图,队列)。 通过高效优化收集用法

掌握了入门级TypeScript教程后,您应该能够在支持TypeScript的IDE中编写自己的代码,并将其编译成JavaScript。本教程将深入探讨TypeScript中各种数据类型。 JavaScript拥有七种数据类型:Null、Undefined、Boolean、Number、String、Symbol(ES6引入)和Object。TypeScript在此基础上定义了更多类型,本教程将详细介绍所有这些类型。 Null数据类型 与JavaScript一样,TypeScript中的null

本教程将介绍如何使用 Chart.js 创建饼图、环形图和气泡图。此前,我们已学习了 Chart.js 的四种图表类型:折线图和条形图(教程二),以及雷达图和极地区域图(教程三)。 创建饼图和环形图 饼图和环形图非常适合展示某个整体被划分为不同部分的比例。例如,可以使用饼图展示野生动物园中雄狮、雌狮和幼狮的百分比,或不同候选人在选举中获得的投票百分比。 饼图仅适用于比较单个参数或数据集。需要注意的是,饼图无法绘制值为零的实体,因为饼图中扇形的角度取决于数据点的数值大小。这意味着任何占比为零的实体
