ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

es6中数组的一些新增扩展?

2022-06-25 09:37:57  阅读:158  来源: 互联网

标签:es6 console log flat 扩展 let 数组 Array


扩展运算符

通过扩展运算符实现的是浅拷贝,修改了引用指向的值,会同步反映到新数组
var arr=[1,2]
 var arr1=[3,4]
 console.log([...arr,...arr1]);// [1, 2, 3, 4]

解构
 const [a,...b]=[1,2,3,4]
    console.log(a);//1
    console.log(b);//[2,3,4]

构造函数新增的方法

数组新增的方法有如下:

  • Array.from()
  • Array.of()

Array.from(arrayLike[, mapFn[, thisArg]])

参数:

arrayLike想要转换成数组的伪数组对象或可迭代对象。

mapFn (可选)   如果指定了该参数,新数组中的每个元素会执行该回调函数。

thisArg (可选) 可选参数,执行回调函数 mapFn 时 this 对象。

返回值:

一个新的浅拷贝的数组实例。

  let arr=Array.from('cads')
    console.log(arr);//['c', 'a', 'd', 's']
 let arr=Array.from([1,2,3],x=>x+4)
    console.log(arr);//[5, 6, 7]
let set=new Set([0,1,2,3])
    console.log(set);//{0, 1, 2, 3}
    console.log(Array.from(set));// [0, 1, 2, 3]
 let map=new Map([[0,1],[2,3]])
    console.log(map);//{0 => 1, 2 => 3}
    console.log(Array.from(map));// [[0,1],[2,3]]

Array.of(element0[, element1[, ...[, elementN]]])

参数:

element0:任意个参数,将按顺序成为返回数组中的元素。

返回值:

新的 Array 实例。

Array.of(3, 11, 8) // [3,11,8]

没有参数的时候,返回一个空数组

当参数只有一个的时候,实际上是指定数组的长度

参数个数不少于 2 个时,Array()才会返回由参数组成的新数组

Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]

实例对象新增的方法

entries( ),keys( ),values( ), copyWithin( ),  fill( ),  flat(),flatMap()

entries(),keys(),values()

keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历


let obj=[{a:3},{b:4}]

for (let index of obj.keys()) {
   console.log(index);//0    1
}
for (let item of obj.values()) {
   console.log(item);//{a:3}  {b:4}
}
for (let [index,item]of obj.entries()) {
   console.log(item);//{a:3}  {b:4}
   console.log(index);//0    1
}

copyWithin( target,[start,[end])

将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组

参数:

target:从该位置开始替换数据。如果为负值,表示倒数。

start(可选):从该位置开始读取数据,默认为 0。如果为负值,表示从末尾开始计算。

end(可选):到该位置前停止读取数据,默认等于数组长度。如果为负值,表示从末尾开始计算。

[1, 2, 3, 4, 5].copyWithin(0, 3) // 将从 3 号位直到数组结束的成员(4 和 5),复制到从 0 号位开始的位置,结果覆盖了原来的 1 和 2
// [4, 5, 3, 4, 5] 

fill(element,[start,[end])

使用给定值,填充一个数组,原数组改变

var a=[1,2,3,4]
let b=a.fill(5)
console.log(b);//[5, 5, 5, 5]
let c=a.fill(6,2)
console.log(c);//[5, 5, 6, 6]
console.log(a);
let d=a.fill(8,1,2)
console.log(d);//[5, 8, 6, 6]

flat(),flatMap()

将数组扁平化处理,返回一个新数组,对原数据没有影响

var a=[1,2,[3,4,[5,6]]]
 console.log(a.flat());//[1, 2, 3, 4, [5,6]]
 console.log(a.flat().flat());//[1, 2, 3, 4, 5, 6]
 console.log(a.flat(2));//[1, 2, 3, 4, 5, 6]

flatMap()方法对原数组的每个成员执行一个函数相当于执行Array.prototype.map(),然后对返回值组成的数组执行flat()方法。该方法返回一个新数组,不改变原数组

// 相当于 [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]

 

标签:es6,console,log,flat,扩展,let,数组,Array
来源: https://www.cnblogs.com/jingxin01/p/16410288.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有