【ES6】数组的拓展

  • 一、Array.from()方法
  • 二、Array.of()方法
  • 三、数组的copyWithin()方法
  • 四、数组的find()和findIndex()方法
  • 五、数组的fill()方法
  • 六、数组的entries()、keys()、values()方法
    • 查看更多ES6教学文章:
    • 参考文献

引言:ES6增加了对数组的接口。

一、Array.from()方法

Array.from方法用于将两类对象转为真正的数组:类似数组的对象和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。

//将类似数组的对象转化为数组
let arraylike = {'0' : 'a','1' : 'b','2' : 'c',length : 3
}
let arr=Array.from(arraylike); // ['a','b','c']//将字符串转化为数组
Array.from('hello'); // ['h','e','l','l','o']//将set解构转化为数组
let nameSet = new Set(['a','b']);
Array.from(nameSet); // ['a','b']

二、Array.of()方法

Array.of方法用于将一组值转化为数组。这个方法的主要目的是弥补构造函数Array()的不足。因为参数的个数会导致Array()函数行为有差异。

Array(3); // [, , ,]
Array.of(3); // [3]Array(3,4,5); // [3,4,5]
Array.of(3,4,5); // [3,4,5]

三、数组的copyWithin()方法

copyWithin(target,start,end)方法用于在当前数组内部将指定位置的成员复制到其他位置。
它接受三个参数:
target:从该位置开始替换数据
start:从该位置开始读取数据,默认为0。如果负数,表示倒数第几个。
end:到该位置停止读取数据,默认等于数组长度。如果负数,表示倒数第几个。

[1,2,3,4,5].copyWithin(0,3,4); // [4,2,3,4,5][1,2,3,4,5].copyWithin(0,-2,-1); // [4,2,3,4,5]

四、数组的find()和findIndex()方法

find()方法用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行回调函数,知道找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,返回undefined。
        findIndex()方法和find差不多,但是返回的是数组成员的位置。

[1,2,-5,10].find((n) => n<0 ) //-5
[1,2,-5,10].findIndex((n) => n<0 ) //2

五、数组的fill()方法

fill()方法用于使用给定的值填充数组。

['a','b','c'].fill(7); // [7,7,7]new Array(3).fill(7); // [7,7,7]['a','b','c'].fill(7,1,2); // ['a',7,'c']

六、数组的entries()、keys()、values()方法

keys()方法对键名进行遍历。
        valuess()方法对键值进行遍历。
        entries()方法对键值对进行遍历。

for (let index of ['a','b'].keys()){console.log(index);
}
//0
//1for(let elem of ['a','b'].values()){console.log(elem);
}
//'a'
//'b'for(let [index,elem] of ['a','b'].entries()){console.log(index,elem);
}
// 0 'a'
// 1 'b'

查看更多ES6教学文章:

1. 【ES6】let与const 详解
2. 【ES6】变量的解构赋值
3. 【ES6】字符串的拓展
4. 【ES6】正则表达式的拓展
5. 【ES6】数值的拓展
6. 【ES6】数组的拓展
7. 【ES6】函数的拓展
8. 【ES6】对象的拓展
9. 【ES6】JS第7种数据类型:Symbol
10. 【ES6】Proxy对象
11. 【ES6】JS的Set和Map数据结构
12. 【ES6】Generator函数详解
13. 【ES6】Promise对象详解
14. 【ES6】异步操作和async函数
15. 【ES6】JS类的用法class
16. 【ES6】Module模块详解
17. 【ES6】ES6编程规范 编程风格

参考文献

阮一峰 《ES6标准入门(第2版)》

【ES6】数组的拓展相关推荐

  1. 《ES6标准入门》49~68Page 数值的拓展 数组的拓展

    1.数值拓展 ES6提供的二进制和八进制表示法分别是二进制: 0B111110111(0b111110111) 八进制: 0O767(0o767) ES6提供了新的Number.isFinite()和 ...

  2. es6+的javascript拓展内容

    一.let,const 1.因为块级的作用域,这样打印01234,循环外打印i会报错 for (let i = 0; i < 5; i++) {setTimeout(console.log(i) ...

  3. 阮一峰老师的JavaScript标准参考教程:函数和ES6函数的拓展

    函数 1. 概述 函数的声明 JavaScript 有三种声明函数的方法. (1)function 命令 function命令声明的代码区块,就是一个函数.function命令后面是函数名,函数名后面 ...

  4. ES5和ES6数组遍历方法详解

    ES5和ES6数组遍历方法详解 在ES5中常用的10种数组遍历方法: 1.原始的for循环语句 2.Array.prototype.forEach数组对象内置方法 3.Array.prototype. ...

  5. 【JavaScript】ES6 数组的扩展

    ES5 数组基础 ES5 数组常用方法 ES5 数组方法 arr.forEach() arr.forEach(callback[, thisObj]) 简单地遍历数组 callback:回调函数,没有 ...

  6. 【ES6】es6数组中对象去重,数组对象去重方法总结---filter()与reduce()实践

    es6数组中对象去重 方法一: filter()与findIndex()给数组去重 1. filter()用法 2. findIndex()用法 3. 去重实战 方法二:reduce()去重 1. r ...

  7. ES6 数组 some, every用法

    ES6 数组提供了some和every方法 some表示只有一个满足条件就返回true,every则表示只有全部满足条件才会返回true.简单例子如下: ​ <html><head& ...

  8. ES6数组方法find()、findIndex()的总结

    本文主要讲解ES6数组方法find()与findIndex(),关于JS的更多数组方法,可参考以下: ①JavaScript 内置对象之-Array ②ES5新增数组方法(例:map().indexO ...

  9. ES6 数组的includes和find、findindex

    ES6 数组的includes和find.findindex ES6 数组的includes和find.findindex ES5的indexOf ES6中includes() includes()函 ...

最新文章

  1. linux设备:初始化
  2. iOS 中导航控制器全屏向右滑动返回上一界面
  3. 开源分布式数据库RadonDB的核心技术与实现
  4. 改进合作 Git 工作流:自动提取、合并提交
  5. 【JavaSE05】Java中方法与重载、递归-思维导图
  6. How is SAP CDS metadata retrieved from AG3 backend
  7. MATLAB字符串和ASCII码的转换
  8. 【ASP.NET】基础补习之验证控件
  9. C++_结构体的定义和使用_结构体数组---C++语言工作笔记025
  10. ggplot2作图详解:标尺(scale)设置
  11. 玩转SSRS第五篇---客户端报表
  12. C++ unordered_map初始化
  13. ad09只在一定范围内查找相似对象_AD16中filter查找相似对象list inspector四大编辑指令使用方法...
  14. java 线程 设计模式_Java多线程设计模式(四)
  15. 英语写作翻译-形容词(一)
  16. 细说php作者高洛峰免费收徒
  17. java上传文件需要的依赖_java – 执行文件上载休息Web服务时缺少方法依赖性
  18. 一网打尽win10 Google Chrome浏览器打开后默认 桔梗 页面
  19. networkx网络拓扑节点图和树,python
  20. React+Redux技术栈核心要点解析(中篇)

热门文章

  1. 状态码302.。。。
  2. Object or Function-JS 中的鸡与蛋问题
  3. nature | 基于深度学习方法的虚拟组织染色
  4. CentOS 7(64位)系统中安装AutoDockTools(MGLTools)
  5. 终于把 7 年前的 Docker Hub 账号恢复了
  6. MS:中山大学丁涛/吴忠道-肠道菌群调控血吸虫病传播媒介光滑双脐螺适生性的新机制...
  7. Bio-protocol第一届生物实验短视频大赛集锦(三)——软件使用篇
  8. QIIME 2教程. 14数据评估和质控q2-quality-control(2020.11)
  9. 要不要读博,以及读博后如何顺利毕业并找到理想工作?五个最接地气的忠告...
  10. 3000多种细菌大迁徙,就发生在你买菜接过钞票的一瞬间