ES6--spread扩展运算符【...】

最新推荐文章于 2022-07-01 10:04:03 发布
最新推荐文章于 2022-07-01 10:04:03 发布
阅读量133 收藏
点赞数
分类专栏： 前端 javascript 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Silentli20/article/details/113701156
版权

// 『...』 扩展运算符能将『数组』转换为逗号分隔的『参数序列』(函数调用时使用)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>扩展运算符</title>
</head>
<body>
    <script>
        // 『...』 扩展运算符能将『数组』转换为逗号分隔的『参数序列』
        //声明一个数组 ...
        const tfboys = ['易烊千玺','王源','王俊凯'];
        // => '易烊千玺','王源','王俊凯'

        // 声明一个函数
        function chunwan(){
            console.log(arguments);
        }

        chunwan(...tfboys);// chunwan('易烊千玺','王源','王俊凯')

    </script>
</body>
</html>

应用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>扩展运算符应用</title>
</head>
<body>
    <div></div>
    <div></div>
    <div></div>
    <script>
        //1. 数组的合并 情圣  误杀  唐探
        // const kuaizi = ['王太利','肖央'];
        // const fenghuang = ['曾毅','玲花'];
        // // const zuixuanxiaopingguo = kuaizi.concat(fenghuang);
        // const zuixuanxiaopingguo = [...kuaizi, ...fenghuang];
        // console.log(zuixuanxiaopingguo);

        //2. 数组的克隆
        // const sanzhihua = ['E','G','M'];
        // const sanyecao = [...sanzhihua];//  ['E','G','M']
        // console.log(sanyecao);

        //3. 将伪数组转为真正的数组
        const divs = document.querySelectorAll('div');
        const divArr = [...divs];
        console.log(divArr);// arguments
    </script>
</body>
</html>

wlq*
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
es6的扩展运算符(...)详解
qq_35629054的博客
11-25 264
** 对象中的扩展运算符(…)用于取出参数对象中的所有可遍历属性，拷贝到当前对象之中 ** 下面为大家一一举例说明： 1、对象使用扩展运算符 let obj = {a: 1} let newObj = {...obj} console.log(newObj) // {a: 1} // 等价于 let newObj = Object.assign({}, obj) // 还可以这么用 let obj = {a: 1} let newObj = {...obj, ...{a:4, b: 2}} let ne
js ES6扩展运算符（spread）和剩余运算符（rest）
青蛙king的博客
07-15 3889
一、扩展运算符（...） 1、扩展运算符概述 ①、扩展运算符内部使用for...of循环，可以将一个“可迭代对象”转为用空格分隔的参数序列。 console.log(...'hello')// h e l l o console.log(...[1, 2, 3]);// 1 2 3 console.log(...{0:"a", 1:"b", 2:"c"});// TypeError: Found non-callable @@iterator ②、扩展运算符后面 可以放置表达式。 var x
扩展运算符
依然范特西
07-04 3483
扩展运算符 扩展运算符（spread） 是三个点（...）,它如同 rest 运算，将一个数组转为用逗号分割的参数序列。 console.log(...[1,2,3,4]); // 1 2 3 4 console.log(1,...[2,3,4],5); //1 2 3 4 5 该运算符主要用于函数调用 functio...
ES6---数组的spread扩展运算符
yiyueqinghui的博客
09-15 445
1、扩展运算符 基本用法 扩展运算符（spread）是三个点（…）。它好比 rest 参数的逆运算，功能是把数组或类数组对象展开成一系列用逗号隔开的值。该运算符主要用于函数调用，示例如下： function add(x, y) { return x + y; } const numbers = [4, 38]; add(...numbers) // 42 2、扩展运算符引用 拷贝数组 下面看看ES5和ES6的实现： // ES5 const a1 = [1, 2]; const a2 =
es6 扩展运算符 三个点（...）
热门推荐
现在学习也不晚
11-29 27万+
1  含义扩展运算符（ spread ）是三个点（...）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。console.log(...[1, 2, 3]) // 1 2 3 console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 [...document.querySelectorAll('div')] // [&lt;div&gt;, &...
es6-promise.auto.js
10-31
<!-- Automatically provides/replaces `Promise` if missing or broken. --> [removed][removed] ...-- Minified version of `es6-promise-auto` below. --> [removed][removed] [removed][removed]
es6-promise
04-02
es6-promise.auto.js ,可用于微信小程序开发，小程序里需要
es6-promise.auto.min.js
05-17
es6-promise.auto.min.js
es6-promise.js
09-10
一个轻量级库，提供用于组织异步代码ES6 Promis(subset of rsvp.js) , 在ES5中支持Promise
es6[email protected]
06-18
在 JavaScript 中，所有代码都是单线程的，也就是同步执行的。而 Promise 就为异步编程提供了一种解决方案。
ES6中扩展运算符(spread)和剩余运算符(rest)详解
qq_25123887的博客
06-29 468
在ES6中。 三个点(…) 有2个含义。分别表示 扩展运算符 和 剩余运算符。 1.扩展运算符(spread) 扩展运算符用三个点号表示，功能是把数组或类数组对象展开成一系列用逗号隔开的值 //demo 1 传递数据代替多个字符串的形式 function test(a,b,c){ console.log(a); console.log(b); console.log(c); } var arr = [1, 2.
ES6数组的扩展扩展运算符(spread)三个点(...)
qq_43447509的博客
08-26 410
含义 扩展运算符（spread）是三个点（...）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列 console.log(...[1,2,3]) //1 2 3 该运算符主要用于函数调用 function push(array, array2) { array.push(...array2) } var arr = [1,2,3]; var arr2 = [1,2,3]; push(arr, arr2); console.log(arr); //[1,2,3,1,2,3] 对象中的
ES6 - 扩展运算符（Spread）
Q_do_it的博客
07-08 357
扩展运算符（Spread） 含义：扩展运算符用（…）表示，它会将一个数组转化为用逗号分隔的参数序列。 嗯?这个含义？？？？？？？话不多说，上例子！ 举些栗子 console.log(...[1, 2, 3]) // 输出结果为：1 2 3 console.log(1, ...[2, 3, 4], 5) // 输出结果为：1 2 3 4 5 [...document.querySelectorAll('div')] // 输出结果为：[<div&
ES6 spread 扩展运算符
weixin_55032665的博客
02-24 267
扩展运算符语法 ： 【…】三小点， 接收­参数 作用：使扩展运算符接收，以数组形式接收，可以使用数组的各种API(方法)用来替代 argments 变量 ，其看似一个数组，其原型指向 Object,所有称为类数 组对象 注意：扩展运算符一般排在形参的最后（潜规则），若其前面存在其他形参，则接收时前面形参先接收，余下扩展运算符接收 展开数组 注意：直接展开的数组，并不能直接使用 扩展运用：克隆数组 注意：被克隆的数组，不会跟着原数...
ES6-11中 rest 参数和 spread 扩展运算符：使用方法及相关例子
chenjunxing1992的博客
07-01 191
rest 参数，用于获取函数的实参，用来代替 arguments。扩展运算符（spread）也是三个点（...）进行对比讲解
扩展运算符spread...
wenjiajiayou的博客
07-05 188
将一个数组转为用逗号分隔的参数序列console.log(...[1, 2, 3]) // 1 2 3 console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 [...document.querySelectorAll('div')] // [&lt;div&gt;, &lt;div&gt;, &lt;div&gt;]该运算符主要用于函数调用function ...
详细解释一下...扩展运算符
最新发布
04-07
扩展运算符（英文名：Spread Operator）是ES6（ECMAScript 6）中新增的一种运算符，用于展开数组或对象，使其成为独立的值。在使用扩展运算符时，可以将数组或对象拆分成单个元素，或者将多个元素合并成一个数组或...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值