首页 > 其他分享 >ES6-展开运算符

ES6-展开运算符

时间:2023-01-10 13:35:15浏览次数:55  
标签:ES6 console log ... 运算符 数组 const 展开

一。数组展开运算符

1.怎么用:

注:扩展运算符,可以将一个数组转为用逗号分隔的参数序列;...[1,2,3]-----1,2,3

        console.log(Math.max(...[1, 2, 3, 4]));//相当于以下[1,2,3,4]->1,2,3,4
        console.log(Math.max(1, 2, 3, 4));

二。区分展开运算符和剩余参数

        const fn = (...args) => {//剩余参数
            console.log(args);// [1, 2, 3, 4]剩余参数
            console.log(...args);//1 2 3 4 展开运算符
        }
        fn(1,2,3,4);

三。应用

1.复制数组,新数组是全新的,和原来数组地址不同;

        const arr = [1, 2, 3, 4];
        const arr1 = [...arr];
        console.log(arr1);//[1,2,3,4]
        console.log(arr1 === arr);//false

2.合并数组

        const arr = [1, 2, 3, 4];
        const arr1 = [5, 6];
        const arr2 = [7, 8];
        const arr3 = [...arr, ...arr1, ...arr2];
        console.log(arr3);//[1, 2, 3, 4, 5, 6, 7, 8]

3.字符串转为数组:字符串可以像数组一样展开

        console.log(...'abcd');//a b c d  'abcd'->a,b,c,d
        console.log([...'abcd']);//['a', 'b', 'c', 'd']

4.类数组arguments和nodelist转为数组:[...arguments]即可;因为类数组没有数组的一些方法,转为数组后这样会方便操作;

 

 二。对象展开运算符

 

标签:ES6,console,log,...,运算符,数组,const,展开
From: https://www.cnblogs.com/zhoushangquan/p/17039837.html

相关文章

  • ES6-剩余参数
    一.怎么用constfn=(x,y,...args)=>{//定义剩余参数要加...使用时不用加...不一定叫args,满足标识符命名即可;console.log(args);//永远是......
  • ES6-函数参数的默认值
    一.看看怎么用constfn=(x,y=1)=>{returnx*y;//2}fn(2);//x=2,y没有实参使用默认值y=1;二.默认值生效条件:该形参===......
  • 如何使点击ElementUI collapse 上的组件时不响应折叠/展开
    背景element-ui上的折叠组件(collapse)有的时候我们需要为组件进行不同的布局来达到我们项目的需要,比如我想要在折叠面板标题的右侧添加一个“审核”的按钮,当这个折叠面板处......
  • ES6-对象字面量的增强
    一.属性、方法的简洁表示法键名和变量/常量名一样的时候,可以只写一个;我们在对象解构赋值时,等号左边也可以这样;方法可以省略冒号和function关键字    constse......
  • ES6之 Generator及它的使用场景
    一、介绍Generator函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同回顾下上文提到的解决异步的手段:回调函数promise那么,上文我们提到promsie已经是一......
  • es6和es7的区别
    es6是什么ECMAScript6(简称ES6)是于2015年6月正式发布的JavaScript语言的标准,正式名为ECMAScript2015(ES2015)。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程......
  • ES6-其他数据类型的解构赋值
    一.字符串的解构赋值1.以数组形式解构赋值const[a,,,b,c]='hello';console.log(a,b,c);//hlo2.以对象形式解构赋值//为什么字符串可......
  • 02. 运算符
    一、运算符  运算符也称为操作符,它是完成一系列操作的符号。运算符用于将一个或几个值进行计算而生成一个新的值,对其进行计算的值称为操作数,操作数可以是常量或变量。......
  • [VueJsDev] 基础知识 - ES6循环使用手册
    [VueJsDev]目录列表https://www.cnblogs.com/pengchenggang/p/17037320.htmlES6循环使用手册:::details目录目录ES6循环使用手册Array.1:filter()方法Array.2:......
  • ES6-对象的解构赋值
    一.概念:结构匹配,属性相同的完成属性值赋值,不论属性的书写顺序const{sex:bage:a}={age:18,sex:'男'};console.log(a,b);//18'男'//---------------......