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

Python:操作 Excel 折叠

💖亲爱的技术爱好者们,热烈欢迎来到 Kant2048 的博客!我是 Thomas Kant,很开心能在CSDN上与你们相遇~💖 本博客的精华专栏: 【自动化测试】 【测试经验】 【人工智能】 【Python】 Python 操作 Excel 系列 读取单元格数据按行写入设置行高和列宽自动调整行高和列宽水平…...

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

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

P3 QT项目----记事本(3.8)

3.8 记事本项目总结 项目源码 1.main.cpp #include "widget.h" #include <QApplication> int main(int argc, char *argv[]) {QApplication a(argc, argv);Widget w;w.show();return a.exec(); } 2.widget.cpp #include "widget.h" #include &q…...

听写流程自动化实践,轻量级教育辅助

随着智能教育工具的发展&#xff0c;越来越多的传统学习方式正在被数字化、自动化所优化。听写作为语文、英语等学科中重要的基础训练形式&#xff0c;也迎来了更高效的解决方案。 这是一款轻量但功能强大的听写辅助工具。它是基于本地词库与可选在线语音引擎构建&#xff0c;…...

九天毕昇深度学习平台 | 如何安装库?

pip install 库名 -i https://pypi.tuna.tsinghua.edu.cn/simple --user 举个例子&#xff1a; 报错 ModuleNotFoundError: No module named torch 那么我需要安装 torch pip install torch -i https://pypi.tuna.tsinghua.edu.cn/simple --user pip install 库名&#x…...

GitFlow 工作模式(详解)

今天再学项目的过程中遇到使用gitflow模式管理代码&#xff0c;因此进行学习并且发布关于gitflow的一些思考 Git与GitFlow模式 我们在写代码的时候通常会进行网上保存&#xff0c;无论是github还是gittee&#xff0c;都是一种基于git去保存代码的形式&#xff0c;这样保存代码…...

vulnyx Blogger writeup

信息收集 arp-scan nmap 获取userFlag 上web看看 一个默认的页面&#xff0c;gobuster扫一下目录 可以看到扫出的目录中得到了一个有价值的目录/wordpress&#xff0c;说明目标所使用的cms是wordpress&#xff0c;访问http://192.168.43.213/wordpress/然后查看源码能看到 这…...

Spring AI Chat Memory 实战指南:Local 与 JDBC 存储集成

一个面向 Java 开发者的 Sring-Ai 示例工程项目&#xff0c;该项目是一个 Spring AI 快速入门的样例工程项目&#xff0c;旨在通过一些小的案例展示 Spring AI 框架的核心功能和使用方法。 项目采用模块化设计&#xff0c;每个模块都专注于特定的功能领域&#xff0c;便于学习和…...

Chrome 浏览器前端与客户端双向通信实战

Chrome 前端&#xff08;即页面 JS / Web UI&#xff09;与客户端&#xff08;C 后端&#xff09;的交互机制&#xff0c;是 Chromium 架构中非常核心的一环。下面我将按常见场景&#xff0c;从通道、流程、技术栈几个角度做一套完整的分析&#xff0c;特别适合你这种在分析和改…...

【把数组变成一棵树】有序数组秒变平衡BST,原来可以这么优雅!

【把数组变成一棵树】有序数组秒变平衡BST,原来可以这么优雅! 🌱 前言:一棵树的浪漫,从数组开始说起 程序员的世界里,数组是最常见的基本结构之一,几乎每种语言、每种算法都少不了它。可你有没有想过,一组看似“线性排列”的有序数组,竟然可以**“长”成一棵平衡的二…...