js-ES6学习笔记-数组的扩展
1、Array.from
方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。
实际应用中,常见的类似数组的对象是DOM操作返回的NodeList集合,以及函数内部的arguments
对象。Array.from
都可以将它们转为真正的数组。
2、Array.from
还可以接受第二个参数,作用类似于数组的map
方法,用来对每个元素进行处理,将处理后的值放入返回的数组。
Array.from(arrayLike, x => x * x);
// 等同于
Array.from(arrayLike).map(x => x * x); Array.from([1, 2, 3], (x) => x * x)
// [1, 4, 9]
如果map
函数里面用到了this
关键字,还可以传入Array.from
的第三个参数,用来绑定this
。
3、Array.of
方法用于将一组值,转换为数组。这个方法的主要目的,是弥补数组构造函数Array()
的不足,只有当参数个数不少于2个时,Array()
才会返回由参数组成的新数组。参数个数只有一个时,实际上是指定数组的长度。
Array.of
基本上可以用来替代Array()
或new Array()。
4、数组实例的copyWithin
方法,在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组。也就是说,使用这个方法,会修改当前数组。
5、数组实例的find
方法,用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true
的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined
。
数组实例的findIndex
方法的用法与find
方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
。
另外,这两个方法都可以发现NaN
,弥补了数组的IndexOf
方法的不足。
[NaN].indexOf(NaN)
// -1 [NaN].findIndex(y => Object.is(NaN, y))
//
上面代码中,indexOf
方法无法识别数组的NaN
成员,但是findIndex
方法可以借助Object.is
方法做到。
6、fill
方法使用给定值,填充一个数组。
7、ES6提供三个新的方法——entries()
,keys()
和values()
——用于遍历数组。keys()
是对键名的遍历、values()
是对键值的遍历,entries()
是对键值对的遍历。
8、Array.prototype.includes
方法返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes
方法类似。该方法属于ES7,但Babel转码器已经支持。
js-ES6学习笔记-数组的扩展的更多相关文章
- JS&ES6学习笔记(持续更新)
ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...
- ES6-11学习笔记--数组的扩展
类数组 / 伪数组 Array.from() Array.of() copyWithin() fill() includes() 类数组.伪数组例子: let divs = document.ge ...
- ES6学习笔记(二)——字符串扩展
相信很多人也和我一样,不喜欢这样循规蹈矩的逐条去学习语法,很枯燥乏味.主要是这样学完一遍之后,没过一段时间就忘到九霄云外了.不如实际用到的时候研究它记得牢靠,所以我就整理成笔记,加深记忆的同时便于复习 ...
- ES6 学习6 数组的扩展
本章学习要点: 扩展运算符 Array.from() Array.of() 数组实例的 copyWithin() 数组实例的 find() 和 findIndex() 数组实例的 fill() 数组实 ...
- Es6学习笔记(7)----数组的扩展
参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ 数组的扩展 1.扩展运算符:可以将数组转化成逗号隔离的单个参数...[1,2,3] //控制台运 ...
- ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能
前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...
- js再学习笔记
#js再学习笔记 ##基本 1.js严格区分大小写 2.js末尾的分号可加,也可不加 3.六种数据类型(使用typeof来检验数据的类型) `typeof` - undefined: `var ...
- es6学习笔记-class之一概念
前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ...
- ES6学习笔记<五> Module的操作——import、export、as
import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...
随机推荐
- JAVA常见安全问题复现
地址来源于乌云知识库,作者z_zz_zzz 0x01 任意文件下载 web.xml的配置: <servlet> <description></description> ...
- WebDriver高级应用实例(5)
5.1对象库(UI Map) 目的:能够使用配置文件存储被测试页面上的元素的定位方式和定位表达式,做到定位数据和程序的分离.方便不具备编码能力的测试人员进行修改和配置. 被测网页的网址: http:/ ...
- [原创]Chorme密码读取工具\Firefox密码读取工具
工具: getBrowserPWD编译: VC作者: K8哥哥博客: http://qqhack8.blog.163.com发布: 2017/11/24 16:16:17 简介: 有时为了方便我们会让 ...
- 【原创】Dependency Walker
https://zh.wikipedia.org/wiki/Dependency_Walker For situations where the system says it can’t find s ...
- MethodImplOptions.Synchronized的一点讨论
Review代码发现有一个方法加了[MethodImpl(MethodImplOptions.Synchronized)] 属性,这个属性的目的,从名字上就可以看出,是要对所有线程进行同步执行. 对方 ...
- Webflux快速入门
SpringWebflux是SpringFramework5.0添加的新功能,WebFlux本身追随当下最火的Reactive Programming而诞生的框架,那么本篇就来简述一下这个框架到底是做 ...
- Android下用Sqlite数据库存储数据
第一步: 写个类 ,继承 SQLiteOpenHelper public class MyDatabaseOpenHelper extends SQLiteOpenHelper { } 第二步: ...
- Servlet 分页保存查询条件
第一种情况:一个页面走一个JSP页面和Servlet 解决办法: /** 把用户这一次选择的所有条件保存Map集合中,再把 map存到Session会话中,点击分页时进入将Servlet中再将Sess ...
- JavaScript基础(一)概述
JavaScript 概述 JS作用 验证表单(以前的网速慢) 页面特效(PC端的网页效果) 移动端(移动web和app) 异步和服务器交互(AJAX) 服务端开发(nodejs) 语言类型 js是一 ...
- linux下开启、关闭、重启mysql服务
linux下开启.关闭.重启mysql服务命令 一. 启动1.使用 service 启动:service mysql start2.使用 mysqld 脚本启动:/etc/inint.d/mysql ...