1_ES6中拓展运算符的使用
一,拓展运算符(...)
拓展运算符(...):它会以参数序列的形式输出,更白话讲,比如数组,它可以把数组里面的东西一个一个的输出出来,例如
1 let arr1 =["你","好","V","U","E",1,2]
2 console.log(...arr1,"--------arr1拓展结果")

二,拓展运算符的使用场景
场景一:合并
拓展运算符是可以把两个数组进行合并,例如:
//数组的合并
1 let arr1 = [0, 1, 2]; //数组1
2 let arr2 = [3, 4, 5, 6]; //数组2
3 let result = [...arr1, ...arr2]; //合并结果
4 console.log(result,"拓展运算符的合并数组结果"); //输出

场景二:数组分割
数组分割:例如下面的例子中,
1 // 数组的分割
2 let [arr1,...arr2] = [1,2,3,4,5,6]
3 console.log("arr1的结果",arr1); //arr1 输出结果是1
4 console.log("arr2的结果",arr2); //arr2 输出结果是一个数组[2,3,4,5,6]
5 console.log("...arr2拓展运算符的结果",...arr2); //...arr2 拓展运算符 输出结果是 2,3,4,5,6

场景三:拷贝
数组拷贝:深拷贝 浅拷贝我这两个还没搞明白,但这里的拷贝,我就单纯的理解为 把一个数组的值 复制 给 另外一个数组 例如:
1 let arr1 = [1,2,3]
2 let arr2 = [...arr1]
3 console.log("arr1的结果是:",arr1); //arr1的输出结果是[1,2,3]
4 console.log("arr2的结果是:",arr2); //arr2的输出结果是[1,2,3]
5 console.log("arr1与arr2是否一样:",arr1===arr2); //输出false

也许有人会有疑问,为什么arr1===arr2为false呢,这个我还得研究研究,我问一个大哥,大哥说是地址不一样了,我得去好好理解下这个地址是什么意思
场景四:对象的使用
拓展运算符也可以针对对象使用,例如:
// 对象
let {x,y,...z} = {x:1,y:2,a:3,b:4} //let{x,y,...z} 这个的意思是解构 如果不太熟悉的话可以去了解了解
console.log("x是什么:",x); //输出1
console.log("y是什么:",y); //输出2
console.log("z是什么:",z); //输出{a:3,b:4}
console.log("...z拓展运算符是什么:",...z); //输出不出来 控制台打印不出来 应该是不可以这样写

对于拓展运算符我也只暂且了解这么些啦,有补充的可以给我留言,前端的小伙伴们,我们一起加油!
1_ES6中拓展运算符的使用的更多相关文章
- 关于java中自增,自减,和拓展运算符的小讨论
java中运算符很多,但是能深入讨论的不算太多.这里我仅仅以++,*=为例做讨论. 例:++ i=0; i=i++ + ++i;//i=1 i=++i+i++;//i=2 i=i++ -++i;//i ...
- es6函数的rest参数和拓展运算符(...)的解析
es6的新特性对函数的功能新增加了rest参数和...的拓展运算符.这是两个什么东西呢? 先来看一个问题:如何获取一个函数除了定义的参数之外的其他参数?传统的做法是借助函数的arguments关键字来 ...
- 通过四个例子理解JavaScript拓展运算符
原文地址:JavaScript & The spread operator 拓展运算符看起来像什么? 三个点,... 它能做什么? 拓展运算符允许一个表达式在某个地方展开成为多个元素.变量或参 ...
- python中的运算符及表达式及常用内置函数
知识内容: 1.运算符与表达式 2.for\while初步了解 3.常用内置函数 一.运算符与表达式 python与其他语言一样支持大多数算数运算符.关系运算符.逻辑运算符以及位运算符,并且有和大多数 ...
- es6入门6--数组拓展运算符,Array.from()基本用法
本文只是作为ES6入门第九章学习笔记,在整理知识点的同时,会加入部分个人思考与解答,若想知道更详细的介绍,还请阅读阮一峰大神的ES6入门 一.拓展运算符 ES6中新增了拓展运算(...)三个点,它的作 ...
- (转)JavaScript中的运算符优先级
JavaScript中的运算符优先级是一套规则.该规则在计算表达式时控制运算符执行的顺序.具有较高优先级的运算符先于较低优先级的运算符执行.例如,乘法的执行先于加法. 下表按从最高到最低的优先级列出J ...
- JavaScript中“typeof”运算符与“instanceof”运算符的差异
在JavaScript中,运算符“typeof”和“instanceof”都可以用来判断数据的类型,那么这两个运算符有什么不同之处呢? 差异一:使用方式不同. 最明显的差异就是这两个运算符的使用方式了 ...
- C++中的运算符重载注意事项
1.C++中的运算符重载的方式有三种: a.类成员函数重载 b.友元函数重载 c.普通函数重载 注意: a.我们主要使用的方式主要是用:类成员函数和友元函数来实现运算符的重载. b.其实用普通函数理论 ...
- JavaScript中的运算符种类及其规则介绍
JavaScript中的运算符有很多,主要分为算术运算符,等同全同运算符,比较运算符,字符串运算符,逻辑运算符,赋值运算符等.这些运算符都有一些属于自己的运算规则,下面就为大家介绍一下JavaScri ...
随机推荐
- LcdToos如何实现PX01自动调Flicker及VCOM烧录
准备工作: LcdTools+PX01点亮需调Flicker的屏:F118 Flicker探头,用于自动Flicker校准测量,F118连接PX01上电后,探头屏会提示零点校准,此时需盖住探头窗口再按 ...
- Charles基本功能
Windows: 运行安装应用程序以在程序菜单中安装 Charles. Mac OS X: 通过双击解压缩下载文件,然后将 Charles 应用程序复制到 Applications 目录中. Linu ...
- WPF 鼠标移动到图片变大,移开还原,单击触发事件效果
<Grid> <Canvas x:Name="LayoutRoot"> <Image Cursor=" ...
- vulnhub靶场之THALES: 1
准备: 攻击机:虚拟机kali.本机win10. 靶机:THALES: 1,网段地址我这里设置的桥接,所以与本机电脑在同一网段,下载地址:https://download.vulnhub.com/th ...
- java代码整洁之道
package Day01;import org.junit.Test;import java.text.NumberFormat;import java.util.Scanner;public cl ...
- 【Azure 环境】把OpenSSL生产的自签名证书导入到Azure Key Vault Certificate中报错
问题描述 通过本地生成的自签名证书导入到Azure Key Vault Certificate报错. 错误信息 the specified PEM X.509 certificate content ...
- VUE学习2
目录分析 public目录 index.html是起始的html文件 # 这是关键 <div id="app"></div> src目录 main.js是V ...
- Linux系统部署Jenkins
搭建Jenkins,准备搞一个定时任务来自动部署服务.做个记录. 问题写在前头:①建议使用最新版的Jenkins版本,jdk版本要跟Jenkins版本对应(有要求):②最好使用war包部署Jenkin ...
- 手记系列之三 ----- 关于使用Nginx的一些使用方法和经验
前言 本篇文章主要介绍的关于本人在使用Nginx的一些使用方法和经验~ Nginx介绍 介绍 Nginx("engine x")是一款是由俄罗斯的程序设计师Igor Sysoev所 ...
- mysql如何备份
mysqldump -h主机 -u用户名 -p密码 库名 表名 >xxx.sql