JavaScript中点号运算符与方括号运算符

news2024/12/24 21:16:39

这篇文章将介绍如何在对象中获取数据、修改数据。在JavaScript中,点号运算符和方括号运算符都可以用于访问对象的属性。
我们还是使用上节课的代码来演示

const ITshareArray = {
firstname: “张三”,
secondname: “二愣子”,
age: 2033-1997,
job: “程序员”,
friends: [“李四”, “王五”, “牛二”],
};
● 首先,我们可以使用点好运算符来获取这个对象中的姓名

console.log(ITshareArray.firstname);

● 我们也可以用方括号运算符来获取对象中的数据

console.log(ITshareArray['firstname']);

在这里插入图片描述

但是方括号运算符相比较于点号运算符来说,方括号中不仅仅可以放这个字符串,也可以放表达式!
例如:

const nameKey = "name";
console.log(ITshareArray["first" + nameKey]);
console.log(ITshareArray["second" + nameKey]);

在这里插入图片描述

● 在举一个更好的例子,如果我们创建了一个数组,然后我们需要用户想了解数组的哪些数据,然后我通过用户输入的数据来或者对应的数据,例如

const interestedIn = prompt('你想了解一下我哪些的数据,可以是firstname、secondname、age、job、friends');
console.log(ITshareArray.interestedIn);

在这里插入图片描述

如果使用点好号运算符,就报错,但是用括号运算符就可以正常!

const interestedIn = prompt('你想了解一下我哪些的数据,可以是firstname、secondname、age、job、friends');
console.log(ITshareArray[interestedIn]);

在这里插入图片描述
在这里插入图片描述

● 但是如果我们输入是的对象中不存在的key的话,就会undefined的
在这里插入图片描述
在这里插入图片描述

● 但是我们之前说过undefined这个参数是false,所以我们就可以if条件去进行判断

const interestedIn = prompt(
  "你想了解一下我哪些的数据,可以是firstname、secondname、age、job、friends"
);

if (ITshareArray[interestedIn]) {
  console.log(ITshareArray[interestedIn]);
} else {
  console.log("你输入的有误,请刷新页面重新输入");
}

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

向对象中添加数据

除此之外,我们还可以通过点号运算符和括号运算符来向对象中添加数据

ITshareArray.localtion = 'china';
ITshareArray['QQ_Number'] = 10012010010;
console.log(ITshareArray);

在这里插入图片描述

挑战

张三有3个朋友,我最好的朋友是李四
输出上面这句话,但是数据含有的数据要从对象中拿到

console.log(
  `${ITshareArray.firstname}${ITshareArray["friends"].length}个朋友,我最好的朋友是${ITshareArray["friends"][0]}`
);

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/985321.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

自动化运维——ansible (五十二) (01)

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 目录 一、概述 1.1 为什么要用自动化运维软件 1.2 自动化运维 1.3 自动化运维要注意的方面 1.4 自动化运维主要关注的方面 1.5 常见的开源自动化运维软件 1.6 自动化运维软件…

Debian11安装MySQL8.0,链接Navicat

图文小白教程 1 下载安装MySQL1.1 从MySQL官网下载安装文件1.2 安装MySQL1.3 登录MySQL 2 配置Navicat远程访问2.1 修改配置2.2 Navicat 连接 end: 卸载 MySQL 记录于2023年9月,Debian11 、 MySQL 8.0.34 1 下载安装MySQL 1.1 从MySQL官网下载安装文件 打开 MySQ…

Unity 之 利用数组来管理资源

文章目录 在Unity中,资源数组(Resource Arrays)不是Unity的标准概念。然而,您可能在特定上下文中使用数组来管理资源或游戏对象。我将解释如何在Unity中使用数组来管理资源。 资源管理: 在Unity中,资源通常…

9.7 C高级day2 作业

#!/bin/bash mkdir ~/dir mkdir ~/dir/dir1 mkdir ~/dir/dir2 cp ./* ~/dir/dir1 -r cp ./*.sh ~/dir/dir2 cd ~/dir tar -cJf dir2.tar.xz dir2 mv dir2.tar.xz dir1 cd tar -xJf dir/dir1/dir2.tar.xz -C dir/dir1 tree ~/dir

阿里云2核2G云服务器租用价格表_一年费用_1个月和1小时收费

阿里云2核2G服务器多少钱一年?108元一年,折合9元一个月,配置为2核CPU、2G内存、3M带宽、50GB高效云盘的轻量应用服务器,如果是云服务器ECS,2核2G配置可以选择ECS通用算力型u1实例、突发性能实例t6和t5实例、密集计算型…

接口响应成功未有预期结果排查

最近开发中遇到一个问题,有一个新增接口,请求该接口时响应200但查询相关数据未有预期的数据,且日志中没有任何报错或警告;一般来说响应200认为是成功,但是结果却不符合事实;此时无外乎几种情况:…

DQN算法概述及基于Pytorch的DQN迷宫实战代码

一. DQN算法概述 1.1 算法定义 Q-Learing是在一个表格中存储动作对应的奖励值,即状态-价值函数Q(s,a),这种算法存在很大的局限性。在现实中很多情况下,强化学习任务所面临的状态空间是连续的,存在无穷多个状态,这种情…

D361周赛复盘:模拟分割整数⭐+变为整除的最小次数⭐

文章目录 2843.统计对称整数的数目(模拟,分割整数为两部分)思路1.整数换成字符串版本2.直接用整数的版本 2844.生成特殊数字的最小操作(模拟,x能被Num整除的条件)思路完整版 2843.统计对称整数的数目(模拟,…

4.矩阵的几何意义、变基与迹

文章目录 变基操作与矩阵矩阵的迹几何意义矩阵迹的几条性质 欢迎访问个人网络日志🌹🌹知行空间🌹🌹 变基操作与矩阵 我们知道空间中一点的坐标可以表示以原点为起点以该点为终点的向量。 以二维平面为例,如下图 选取…

D1. Too Many Segments (easy version)

题目:样例1: 输入 7 2 11 11 9 11 7 8 8 9 7 8 9 11 7 9输出 3 1 4 7 样例2: 输入 5 1 29 30 30 30 29 29 28 30 30 30输出 3 1 2 4 样例3: 输入 6 1 2 3 3 3 2 3 2 2 2 3 2 3输出 4 1 3 5 6 思路: 这里数据范围是…

React 全栈体系(四)

第二章 React面向组件编程 六、组件的生命周期 1. 效果 需求:定义组件实现以下功能&#xff1a; 让指定的文本做显示 / 隐藏的渐变动画从完全可见&#xff0c;到彻底消失&#xff0c;耗时2S点击“不活了”按钮从界面中卸载组件 <!DOCTYPE html> <html lang"e…

AlexNet 06

一、发展 1989年&#xff0c;Yann LeCun提出了一种用反向传导进行更新的卷积神经网络&#xff0c;称为LeNet。 1998年&#xff0c;Yann LeCun提出了一种用反向传导进行更新的卷积神经网络&#xff0c;称为LeNet-5 AlexNet&#xff0c;VGG&#xff0c;GoogleNet&#xff0c;R…

863. 二叉树中所有距离为 K 的结点

863. 二叉树中所有距离为 K 的结点 C代码&#xff1a;dfs /*** struct TreeNode {* int val;* struct TreeNode *left;* struct TreeNode *right;* };*/typedef struct {int key;struct TreeNode* node;UT_hash_handle hh; } HashTable;HashTable* head; int* ans…

半导体厂务液体泄漏问题的挑战与解决方案

在半导体制造领域&#xff0c;液体泄漏是一项极具挑战性的问题。半导体工厂内有着大量的化学品、工艺液体和废水系统&#xff0c;这些液体在制造过程中扮演着至关重要的角色。然而&#xff0c;液体泄漏可能会导致严重的生产中断、环境污染和安全风险。本文将探讨半导体厂务中的…

Java 多线程系列Ⅴ(常见锁策略+CAS+synchronized原理)

常见锁策略 一、乐观锁 & 悲观锁二、重量级锁 & 轻量级锁三、自旋锁 & 挂起等待锁四、互斥锁 & 读写锁五、可重入锁 & 不可重入锁六、公平锁 & 非公平锁七、CAS1、CAS特点2、CAS的应用3、CAS 实现自旋锁4、CAS的ABA问题 八、synchronized 原理1、synch…

讯飞开放平台--星火认知大模型--开发技术文档--js实例代码详解

阿丹&#xff1a; 之前调用写过调用百度的文心一言写网站&#xff0c;讯飞的星火认知模型开放了&#xff0c;这次尝试一下使用流式来进行用户的交互。 官网&#xff1a; 平台简介 | 讯飞开放平台文档中心 星火认知大模型Web文档 | 讯飞开放平台文档中心 简介&#xff1a; 本…

恒驰QA | 我们到底是做什么的?和恒大恒驰有什么关系?

5个关键问题解答&#xff0c;带您走进恒驰信息 Q&#xff1a;恒驰信息和恒大恒驰是什么关系&#xff1f; A&#xff1a;答案是没有关系。 这是我们被问到比较频繁的问题&#xff0c;只能说纯属同名啦&#xff01;恒驰信息成立于2005年&#xff0c;比恒大恒驰创立早上14年之久。…

【视觉SLAM入门】7.2. 从卡尔曼滤波到扩展卡尔曼滤波,引入、代码、原理、实战,C++实现以及全部源码

"觇其平生&#xff0c;岂能容物&#xff1f;" 0. 简单认识1. 公式对比解读2. 应用举例3. 解决方案(公式---代码对应)3.1 初始化3.2 EKF3.2.1 预测---状态方程3.2.2 系统协方差矩阵3.2.3 预测---系统协方差矩阵3.2.4 设置测量矩阵3.2.5 更新---状态变量&#xff0c;卡…

搞懂三极管

三极管的电流放大作用应该算是模拟电路里面的一个难点内容&#xff0c;我想用这几个动画简单的解释下为什么小电流Ib能控制大电流Ic的大小&#xff0c;以及放大电路的原理。 我这里的三极管也叫双极型晶体管,模电的放大电路和数电的简单逻辑电路里面都会用到。有集电极c、基极b…

docker-compose 升级

此方法针对Linux版本生效&#xff0c;请测试有效&#xff1b;记录以方面日后能使用到&#xff1b; ## 安装docker 使用常用命名安装即可, 以下命令安装若提示找不到安装包&#xff0c;直接update 即可。 yum install docker OR apt install docker OR apt install do…