当前位置: 首页 > news >正文

JavaScript------内建对象

一、解构赋值

1、数组的解构

1.1、解构赋值

const arr = ["孙悟空", "猪八戒", "沙和尚"];let a, b, c;[a, b, c] = arr;  // 等同于 [a, b, c] = ["孙悟空", "猪八戒", "沙和尚"]

1.2、声明同时解构

let [d, e, f, g] = ["唐僧", "白骨精", "蜘蛛精", "玉兔精"];let [d, e, f, g] = ["唐僧", "白骨精", "蜘蛛精"];   // g是undefined

注意:括号、中括号前写分号,不会报错。或者每行代码都写上分号

1.3、解构时没有对应的值,就用默认值,而不是undefined

let [d, e, f, g] = [1, 2, 3]   // g=undefinedlet [d, e, f = 77, g = 10] = [1, 2, 3]  // [1, 2, 3, 10] 覆盖f的默认值,g用默认值

1.4、...设置剩余元素的值

let [d, e] = [1, 2, 3, 4, 5]   // [1, 2]let [d, e, ...f] = [1, 2, 3, 4, 5]   //  [1, 2, 3, 4, 5] 

1.5、对以数组为返回值的函数进行解构

function fn(){return ["二郎神", "猪八戒"]
}let [name1, name2] = fn()  // [name1, name2] = ["二郎神", "猪八戒"]

1.6、快速交换两个变量的值

let a1 = 10;
let a2 = 20;
[a1, a2] = [a2, a1];   // 等号左边是变量,等号右边是值const arr2 = ["孙悟空", "猪八戒"];
[arr2[0], arr2[1]] = [arr2[1], arr2[0]];

1.7、根据需求解构数组

const arr3 = [["孙悟空", 18, "男"], ["猪八戒" ,28, "男"]]let [[name, age, gender], obj] = arr3console.log(obj)  // ["猪八戒" ,28, "男"]
console.log(name, age, gender)  // 孙悟空 18 男

2、对象的解构

2.1、解构赋值

注意加括号!

const obj = { name: "孙悟空", age: 18, gender: "男" };let name, age, gender;({ name, age, gender } = obj);   // 加括号

2.2、声明同时解构

const obj = { name: "孙悟空", age: 18, gender: "男" }let { name, age, gender } = obj   // 等同于 let { name:name, age:age, gender:gender } = obj

2.3、当变量名与对象内属性名称不一致时

const obj = { name: "孙悟空", age: 18, gender: "男" }let {name:a, age:b, gender:c} = objconsole.log(a, b, c)

2.4、解构时没有对应的值,就用默认值,而不是undefined

const obj = { name: "孙悟空", age: 18, gender: "男" }let {name:a, age:b, gender:c, address:d="花果山"} = objconsole.log(a, b, c, d)

二、对象的序列化(JSON)

1、概念

JS中的对象使用时都是存在于计算机的内存中的(0101形式)。序列化指将对象转换为一个可以存储的格式。在JS中对象的序列化通常是将一个对象转换为字符串(JSON字符串)

2、序列化的作用

对象转换为字符串后,可以将字符串在不同的语言之间进行传递。甚至人可以直接对字符串进行读写操作,使得JS对象可以不同的语言之间传递。

  • 作为数据交换的格式
  • 用来编写配置文字

3、如何进行序列化

在JS中有一个工具类 JSON (JavaScript Object Notation) JS对象表示法,可以直接使用。

JS对象序列化后会转换为一个字符串,这个字符串我们称其为JSON字符串。

4、JSON类的使用方法

4.1、JSON.stringify()

将一个对象转换为JSON字符串

const obj = {name: "孙悟空",age: 18,
}const str = JSON.stringify(obj)console.log(obj) // {"name":"孙悟空","age":18}
console.log(str) // {"name":"孙悟空","age":18}
二者打印的东西看起来一样,但是上面的字体是灰色代表一个对象,下面的字体是黑色代表JSON字符串

4.2、JSON.parse()

将一个JSON格式的字符串转换为JS对象

const obj = {name: "孙悟空",age: 18,
}const str = JSON.stringify(obj)const obj2 = JSON.parse(str) 这里obj2和obj不是同一个对象,而是obj深拷贝

4.3、手动的编写JSON字符串

在很多程序的配置文件就是使用JSON编写的

const obj = {name: "孙悟空",age: 18,
}const str2 = '{"name":"孙悟空","age":18}'

5、编写JSON的注意事项

5.1、JSON字符串有两种类型:

                            JSON对象 {}

                            JSON数组 []

const str3 = "{}"
const str4 = '[]'

5.2.、JSON字符串的属性名必须使用双引号引起来

因为一些语言中字符串只能用双引号表示,为了避免转换时的麻烦,所以一定要用双引号

5.3、JSON中可以使用的属性值(元素)

也就是所有语言都共有的数据类型就可以写,JavaScript单独有的就不可以写

                            - 数字(Number)

                            - 字符串(String) 必须使用双引号

                            - 布尔值(Boolean)

                            - 空值(Null)

                            - 对象(Object {})

                            - 数组(Array [])

const str4 = '["hello", true, []]'

5.4、JSON的格式和JS对象的格式基本上一致的

注意:JSON字符串如果属性是最后一个,则不要再加逗号

6、JSON进行深复制

const obj = {name: "孙悟空",age: 18,
}const obj2 = JSON.parse(JSON.stringify(obj)) 

相关文章:

JavaScript------内建对象

一、解构赋值 1、数组的解构 1.1、解构赋值 const arr ["孙悟空", "猪八戒", "沙和尚"];let a, b, c;[a, b, c] arr; // 等同于 [a, b, c] ["孙悟空", "猪八戒", "沙和尚"] 1.2、声明同时解构 let [d, e…...

React + Redux 处理异步请求

redux 处理异步请求 方式一:在 componentDidmount 中直接进⾏请求,在将数据同步到 redux 创建 Store 仓库 import {createStore } from redux;const defaultState = {banners: [] }const reducer =...

揭秘涨薪50%经验:从功能测试到自动化测试,我是如何蜕变的?

本人在今年互联网大环境如此严峻的情况下,作为一个刚毕业不到一年的初级测试,赶在“金三银四”依然拿到了一些面试机会,并且成功拿下4家公司的offer,其中不乏互联网大厂,而且最高总包给到了接近double(无炫…...

【论文速递】MMM2020 - 电子科技大学提出一种新颖的局部变换模块提升小样本分割泛化性能

【论文速递】MMM2020 - 电子科技大学提出一种新颖的局部变换模块提升小样本分割泛化性能 【论文原文】:A New Local Transformation Module for Few-shot Segmentation 【作者信息】:Yuwei Yang, Fanman Meng, Hongliang Li, Qingbo Wu,Xiaolong Xu an…...

补充前端面试题(二)

#$set数据变化视图不更新问题, 当在项目中直接设置数组的某一项的值,或者直接设置对象的某个属性值,这个时候,你会发现页面并没有更新。这是因为 Object.defineProperty()限制,监听不到变化。解决方式:this.$set(你要改…...

JavaScript原型、原型链、原型方法

文章目录原型和原型链prototype、 __ proto __ 、constructor原型链原型方法instanceOfhasOwnPropertyObject.create()、new Object()总结原型和原型链 prototype、 __ proto __ 、constructor 首先我们看下面一段代码 // 构造函数Personfunction Person(name, age) {this.na…...

linux篇【14】:网络https协议

目录 一.HTTPS介绍 1.HTTPS 定义 2.HTTP与HTTPS (1)端口不同,是两套服务 (2)HTTP效率更高,HTTPS更安全 3.加密,解密,密钥 概念 4.为什么要加密? 5.常见的加密方式…...

1.9实验9:配置虚链路

1.4.4实验9:配置虚链路 实验目的(1) 实现OSPF 虚链路的配置 (2) 描述虚链路的作用 实验拓扑配置虚链路实验拓扑如图1-19所示。[1] 图1-19 配置虚链路 实验步骤...

三次握手-升级详解-注意问题

TCP建立连接的过程就是三次握手(Three-way Handshake),在建立连接的过程实际上就是客户端和服务端之间总共发送三个数据包。进行三次握手主要是就是为了确认双方都能接收到数据包和发送数据包,而客户端和服务端都会指定自己的初始…...

软件架构知识3-系统复杂度-高可用性、可扩展性、低成本、安全、规模

高可用性 系统无中断地执行其功能的能力,代表系统的可用性程度,是进行系统设计时的准则之一。 高可用的“冗余”解决方案,单纯从形式上来看,和之前讲的高性能是一样的,都是通过增加更多机 器来达到目的,但…...

SpringCloud学习笔记 - 自定义及解耦降级处理方法 - Sentinel

1. SentinelRecourse配置回顾 通过之前的学习,我们知道SentinelRecourse配置的资源定位可以通过两种方式实现:一种是URL,另一种是资源名称。这两种限流方式都要求资源ID唯一 RestController public class RateLimitController {GetMapping(…...

Redis之搭建一主多从

搭建redis一主多从的过程 1.在相应位置创建一个文件夹存放redis配置文件 mkdir myredis2.复制redis配置文件到此文件夹中 cp /opt/redis/redis/bin/redis.conf /opt/myredis/redis.conf3.新建三个配置文件 touch redis6379.conf touch redis6380.conf touch redis6381.conf4…...

Transformer机制学习笔记

学习自https://www.bilibili.com/video/BV1J441137V6 RNN,CNN网络的缺点 难以平行化处理,比如我们要算b4b^4b4,我们需要一次将a1a^1a1~a4a^4a4依次进行放入网络中进行计算。 于是有人提出用CNN代替RNN 三角形表示输入,b1b^1b1的…...

1、第一个CUDA代码:hello gpu

目录第一个CUDA代码&#xff1a;hello gpu一、__global__ void GPUFunction()二、gpu<<<1,1>>>();三、线程块、线程、网格知识四、核函数中的printf();五、cudaDeviceSynchronize();第一个CUDA代码&#xff1a;hello gpu #include <stdio.h>void cpu(…...

UG二次开发装配篇 添加/拖动/删除组件方法的实现

我们在UG装配的过程中&#xff0c;经常会遇到需要调整组件目录位置&#xff0c;在软件设计过程中可以通过在目录树里面拖动组件来完成。 那么&#xff0c;如果要用程序实现组件的移动/拖动&#xff0c;我们要怎么做呢&#xff1f; 本节就完成了添加/拖动/删除组件方法的实现&…...

【ros bag 包的设计原理、制作、用法汇总】

ros bag 包的设计原理 序列化和反序列化 首先知道Bag包就是为了录制消息,而消息的保存和读取就涉及到一个广义上的问题序列化和反序列化,它基本上无处不在,只是大部分人没有注意到,举个简单的例子,程序运行的时候,是直接操作的内存,也就是一个结构体或者一个对象,但内…...

Linux网络:聚合链路技术

目录 一、聚合链路技术 1、bonding作用 2、Bonding聚合链路工作模式 3、Bonding实现 一、聚合链路技术 1、bonding作用 将多块网卡绑定同一IP地址对外提供服务&#xff0c;可以实现高可用或者负载均衡。直接给两块网卡设置同一IP地址是不可以的。通过 bonding&#xff0c…...

2023年数据安全的下一步是什么?

IT 预算和收入增长领域是每个年度开始时的首要考虑因素&#xff0c;在当前的世界经济状况下更是如此。 IT 部门和数据团队正在寻找确定优先级、维护和构建安全措施的最佳方法&#xff0c;同时又具有成本效益。 这是一个棘手的平衡点&#xff0c;但却是一个重要的平衡点&#…...

在浏览器输入URL后发生了什么?

在浏览器输入URL并获取响应的过程&#xff0c;其实就是浏览器和该url对应的服务器的网络通信过程。从封装的角度来讲&#xff0c;浏览器和web服务器执行以下动作&#xff1a;&#xff08;简单流程&#xff09;1、浏览器先分析超链接中的URL:分析域名是否规范2、浏览器向DNS请求…...

Dubbo学习

0.start 容器container启动&#xff08;spring&#xff09;&#xff0c;初始化我们的服务提供者&#xff08;Provider&#xff09;1.register 把业务层的方法&#xff0c;注册到注册中心&#xff08;Register&#xff09;2.subscribe 消费者&#xff08;Consumer&#xff09;订…...

测试微信模版消息推送

进入“开发接口管理”--“公众平台测试账号”&#xff0c;无需申请公众账号、可在测试账号中体验并测试微信公众平台所有高级接口。 获取access_token: 自定义模版消息&#xff1a; 关注测试号&#xff1a;扫二维码关注测试号。 发送模版消息&#xff1a; import requests da…...

【位运算】消失的两个数字(hard)

消失的两个数字&#xff08;hard&#xff09; 题⽬描述&#xff1a;解法&#xff08;位运算&#xff09;&#xff1a;Java 算法代码&#xff1a;更简便代码 题⽬链接&#xff1a;⾯试题 17.19. 消失的两个数字 题⽬描述&#xff1a; 给定⼀个数组&#xff0c;包含从 1 到 N 所有…...

基于服务器使用 apt 安装、配置 Nginx

&#x1f9fe; 一、查看可安装的 Nginx 版本 首先&#xff0c;你可以运行以下命令查看可用版本&#xff1a; apt-cache madison nginx-core输出示例&#xff1a; nginx-core | 1.18.0-6ubuntu14.6 | http://archive.ubuntu.com/ubuntu focal-updates/main amd64 Packages ng…...

React Native在HarmonyOS 5.0阅读类应用开发中的实践

一、技术选型背景 随着HarmonyOS 5.0对Web兼容层的增强&#xff0c;React Native作为跨平台框架可通过重新编译ArkTS组件实现85%以上的代码复用率。阅读类应用具有UI复杂度低、数据流清晰的特点。 二、核心实现方案 1. 环境配置 &#xff08;1&#xff09;使用React Native…...

Module Federation 和 Native Federation 的比较

前言 Module Federation 是 Webpack 5 引入的微前端架构方案&#xff0c;允许不同独立构建的应用在运行时动态共享模块。 Native Federation 是 Angular 官方基于 Module Federation 理念实现的专为 Angular 优化的微前端方案。 概念解析 Module Federation (模块联邦) Modul…...

WEB3全栈开发——面试专业技能点P2智能合约开发(Solidity)

一、Solidity合约开发 下面是 Solidity 合约开发 的概念、代码示例及讲解&#xff0c;适合用作学习或写简历项目背景说明。 &#x1f9e0; 一、概念简介&#xff1a;Solidity 合约开发 Solidity 是一种专门为 以太坊&#xff08;Ethereum&#xff09;平台编写智能合约的高级编…...

【RockeMQ】第2节|RocketMQ快速实战以及核⼼概念详解(二)

升级Dledger高可用集群 一、主从架构的不足与Dledger的定位 主从架构缺陷 数据备份依赖Slave节点&#xff0c;但无自动故障转移能力&#xff0c;Master宕机后需人工切换&#xff0c;期间消息可能无法读取。Slave仅存储数据&#xff0c;无法主动升级为Master响应请求&#xff…...

Web中间件--tomcat学习

Web中间件–tomcat Java虚拟机详解 什么是JAVA虚拟机 Java虚拟机是一个抽象的计算机&#xff0c;它可以执行Java字节码。Java虚拟机是Java平台的一部分&#xff0c;Java平台由Java语言、Java API和Java虚拟机组成。Java虚拟机的主要作用是将Java字节码转换为机器代码&#x…...

人工智能--安全大模型训练计划:基于Fine-tuning + LLM Agent

安全大模型训练计划&#xff1a;基于Fine-tuning LLM Agent 1. 构建高质量安全数据集 目标&#xff1a;为安全大模型创建高质量、去偏、符合伦理的训练数据集&#xff0c;涵盖安全相关任务&#xff08;如有害内容检测、隐私保护、道德推理等&#xff09;。 1.1 数据收集 描…...

MySQL:分区的基本使用

目录 一、什么是分区二、有什么作用三、分类四、创建分区五、删除分区 一、什么是分区 MySQL 分区&#xff08;Partitioning&#xff09;是一种将单张表的数据逻辑上拆分成多个物理部分的技术。这些物理部分&#xff08;分区&#xff09;可以独立存储、管理和优化&#xff0c;…...