当前位置: 首页 > 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;订…...

日语AI面试高效通关秘籍:专业解读与青柚面试智能助攻

在如今就业市场竞争日益激烈的背景下&#xff0c;越来越多的求职者将目光投向了日本及中日双语岗位。但是&#xff0c;一场日语面试往往让许多人感到步履维艰。你是否也曾因为面试官抛出的“刁钻问题”而心生畏惧&#xff1f;面对生疏的日语交流环境&#xff0c;即便提前恶补了…...

使用VSCode开发Django指南

使用VSCode开发Django指南 一、概述 Django 是一个高级 Python 框架&#xff0c;专为快速、安全和可扩展的 Web 开发而设计。Django 包含对 URL 路由、页面模板和数据处理的丰富支持。 本文将创建一个简单的 Django 应用&#xff0c;其中包含三个使用通用基本模板的页面。在此…...

c++ 面试题(1)-----深度优先搜索(DFS)实现

操作系统&#xff1a;ubuntu22.04 IDE:Visual Studio Code 编程语言&#xff1a;C11 题目描述 地上有一个 m 行 n 列的方格&#xff0c;从坐标 [0,0] 起始。一个机器人可以从某一格移动到上下左右四个格子&#xff0c;但不能进入行坐标和列坐标的数位之和大于 k 的格子。 例…...

【SQL学习笔记1】增删改查+多表连接全解析(内附SQL免费在线练习工具)

可以使用Sqliteviz这个网站免费编写sql语句&#xff0c;它能够让用户直接在浏览器内练习SQL的语法&#xff0c;不需要安装任何软件。 链接如下&#xff1a; sqliteviz 注意&#xff1a; 在转写SQL语法时&#xff0c;关键字之间有一个特定的顺序&#xff0c;这个顺序会影响到…...

JUC笔记(上)-复习 涉及死锁 volatile synchronized CAS 原子操作

一、上下文切换 即使单核CPU也可以进行多线程执行代码&#xff0c;CPU会给每个线程分配CPU时间片来实现这个机制。时间片非常短&#xff0c;所以CPU会不断地切换线程执行&#xff0c;从而让我们感觉多个线程是同时执行的。时间片一般是十几毫秒(ms)。通过时间片分配算法执行。…...

tree 树组件大数据卡顿问题优化

问题背景 项目中有用到树组件用来做文件目录&#xff0c;但是由于这个树组件的节点越来越多&#xff0c;导致页面在滚动这个树组件的时候浏览器就很容易卡死。这种问题基本上都是因为dom节点太多&#xff0c;导致的浏览器卡顿&#xff0c;这里很明显就需要用到虚拟列表的技术&…...

在 Spring Boot 中使用 JSP

jsp&#xff1f; 好多年没用了。重新整一下 还费了点时间&#xff0c;记录一下。 项目结构&#xff1a; pom: <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://ww…...

tomcat指定使用的jdk版本

说明 有时候需要对tomcat配置指定的jdk版本号&#xff0c;此时&#xff0c;我们可以通过以下方式进行配置 设置方式 找到tomcat的bin目录中的setclasspath.bat。如果是linux系统则是setclasspath.sh set JAVA_HOMEC:\Program Files\Java\jdk8 set JRE_HOMEC:\Program Files…...

零知开源——STM32F103RBT6驱动 ICM20948 九轴传感器及 vofa + 上位机可视化教程

STM32F1 本教程使用零知标准板&#xff08;STM32F103RBT6&#xff09;通过I2C驱动ICM20948九轴传感器&#xff0c;实现姿态解算&#xff0c;并通过串口将数据实时发送至VOFA上位机进行3D可视化。代码基于开源库修改优化&#xff0c;适合嵌入式及物联网开发者。在基础驱动上新增…...

多元隐函数 偏导公式

我们来推导隐函数 z z ( x , y ) z z(x, y) zz(x,y) 的偏导公式&#xff0c;给定一个隐函数关系&#xff1a; F ( x , y , z ( x , y ) ) 0 F(x, y, z(x, y)) 0 F(x,y,z(x,y))0 &#x1f9e0; 目标&#xff1a; 求 ∂ z ∂ x \frac{\partial z}{\partial x} ∂x∂z​、 …...