首页 > 其他分享 >ES6之 ...扩展运算符

ES6之 ...扩展运算符

时间:2022-11-18 23:24:46浏览次数:53  
标签:ES6 console log ... 运算符 arguments 数组 const



  <script>
        // 『...』 扩展运算符能将『数组』转换为逗号分隔的『参数序列』
        //声明一个数组 ...
        const tfboys = ['易烊千玺','王源','王俊凯'];
        // => '易烊千玺','王源','王俊凯'

        // 声明一个函数
        function chunwan(){
            console.log(arguments);
            console.log(arguments[0]);
            console.log(arguments[1]);
            console.log(arguments[2]);
        }

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

    </script>

结果:

 (2)应用

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

 

结果:

 

标签:ES6,console,log,...,运算符,arguments,数组,const
From: https://www.cnblogs.com/anjingdian/p/16905221.html

相关文章

  • ES6之rest参数
     (1)//ES6引入rest参数,用于获取函数的实参,用来代替arguments//ES5获取实参的方式functiondate(){console.log(arguments);......
  • ES6之函数参数默认值
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>函数......
  • redis集群创建的时候,一直卡在Waiting for the cluster to join ....上、一直没有反应
    1.问题:搭建Redis集群的过程中,执行到clustercreate:…的时候,发现程序发生阻塞,显示:Waitingfortheclustertojoin的字样,然后就无休无尽的等待…2.解决方法:开放red......
  • PHP 运算符
    PHP7+版本新增整除运算符intdiv(),使用实例:<?phpvar_dump(intdiv(10,3));?>int(3)......
  • PHP并置运算符.
    PHP并置运算符.点连接多个字符串(php中一个空格和多个空格字符串是一样的“—”和“——”)<?php$txt1="Helloworld!";$txt2="Whataniceday!";echo$txt1.$txt......
  • 面试随记(更新中...)
    Java部分:MySQL部分:1、什么是脏读、幻读、不可重复读脏读指的是一个事务(T1),读取到了第二个事务(T2)未提交的数据不可重复读指的是一个事务(T1),读取完数据之后处理其他......
  • uniapp 某些view下的文字超过两行变成...的操作
    最近在搞微信小程序但是某些标题太长了所以需要用到某些csstext-overflow:-o-ellipsis-lastline;overflow:hidden;//溢出内容隐藏text-overflow:ellipsis;//文本......
  • 53:双分支选择结构_三元运算符的使用详解
    ###双分支选择结构双分支结构的语法格式如下:if 条件表达式:   语句1/语句块1else:   语句2/语句块2【操作】输入一个数字,小于10,则打印该数字;大于10,......
  • Python基础之运算符
    一、算数运算符混合运算优先级顺序:()⾼于**⾼于*///%⾼于+-二、赋值运算符单个变量赋值num=1print(num)多个变量赋值num1,float1,str1=10,0.5,'hellowo......
  • JavaScript_语法_一元运算符与JavaScript_语法_算数&比较运算符
    JavaScript_语法_一元运算符运算符:1.一元运算符:只有一个运算数的运算符++、--、+(正号)、-(负号)......