美文网首页
ES6-扩展运算符(...)的使用

ES6-扩展运算符(...)的使用

作者: element_web | 来源:发表于2018-04-19 09:52 被阅读0次

1,含义

展开运算符(...)是将一个数组转为类函数参数序列;

console.log(...[1,2,3])  //1 2 3
function add(x,y){
    return x+y;
}
let arr=[5,8]
add(...arr);  // 13

2,替代 apply 方法

扩展运算符与apply一样是展开数组,可将数组转为函数的参数

function add(x,y,z){
  console.log(x+y+z)
};
var arr = [6,7,8];
//ES5写法  :       
add.apply(null,arr); //21
//ES6写法  :       
add(...arr);  //21

3,常用情景

可以合并数组

var arr1 = [1,2];
var arr2 = [3,4,5];
var arr3 = [7,,8];
[...arr1,..arr2,...arr3] //[1,2,3,4,5,7,8]

二维数组降维

var arr = [1,2,[3,4,5]];
var newArr = [].concat(...arr); //[1,2,3,4,5]

多维数组扁平化

var arr = [1,[2,[3,[4,5]]]];
function newArr = (arr)=>{
  let  hasArr = (item)=>{
  return Array.isArray(item)
}
  while(arr.some(hasArr)){
    arr = [].concat(...arr)
  }
  return arr;
}
newArr(arr);  //[1,2,3,4,5]

字符串转数组

[...'string']; //["s", "t", "r", "i", "n", "g"]

解构赋值

const [a,...b] = [1,2,3,4]
//a = 1
//b = [2,3,4]

相关文章

  • ES6-扩展运算符(...)的使用

    1,含义 展开运算符(...)是将一个数组转为类函数参数序列; 2,替代 apply 方法 扩展运算符与apply...

  • ES6学习笔记之扩展运算符

    扩展运算符是三个点(...),它将一个数组转为用逗号分隔的参数序列 使用扩展运算符求数组最大元素 使用扩展运算符将...

  • 【基础知识】扩展运算符...

    变量解构使用案例 数组扩展运算符 重点:对象也可以使用...哦ES6之扩展运算符-对象

  • es6新增的数组方法

    扩展运算符 1.扩展运算符的使用方法 2.扩展运算符的应用(1)复制数组 (2)合并数组 (3)与解构赋值结合 (...

  • [转载]扩展运算符...

    原文:JavaScript 扩展运算符 扩展运算符格式 扩展运算符格式很简单,就是三个点(...) 扩展运算符作用...

  • ES6-扩展运算符、set、对象方法扩展

    数组合并 数组克隆 将伪数组转化为真正的数组 set set添加 add删除 delete清空 clear 数组...

  • "..."扩展运算符的使用

    对象的扩展运算符(...)用于取出参数对象的所有可遍历属性,拷贝到当前对象之中 使用扩展运算符可以简洁代码,非常实...

  • es6之扩展运算符 三个点(...)

    es6之扩展运算符 三个点(...)对象的扩展运算符数组的扩展运算符总结es6之扩展运算符 三个点(…)对象的扩展...

  • 扩展运算符

    一直对扩展运算符的使用云里雾里,趁着空闲,是时候拨开云雾见光明了~ 数组的扩展运算符 应用 复制数组,注:数组元素...

  • ES6-剩余参数 and 扩展运算符

    1.ES6的剩余参数可以帮助很简单的将剩余参数组合为一个数组 剩余参数应用场景 2.ES6 扩展运算符是一个与剩余...

网友评论

      本文标题:ES6-扩展运算符(...)的使用

      本文链接:https://www.haomeiwen.com/subject/azbikftx.html