2

常见的伪数组对象

伪数组对象本质:必须有length属性。
1、DOM操作返回的NodeList集合。下面的nodeList就是一个伪数组对象。
var nodeList = document.querySelectorAll('li');
2、函数内部的arguments对象。

clipboard.png

clipboard.png


将伪数据对象转换为真正数据的两种方式

方法一:扩展运算符。
使用扩展运算符的前提是:使用者必须是已经部署了Iterator接口。例如,字符串,Set结构是都具有Iterator接口的。(扩展运算符背后调用的是遍历器接口)
从下图可以看出扩展运算符真的把伪数组对象转换成了真正的数组
clipboard.png

方法二:Array.from()
可以将类数组对象和可遍历对象都转换为真正的数组,任何有length属性的对象,都可以通过Array.from()方法转为数组。
下图含有es6和es5的转换数组的方法。
clipboard.png
注意:
Array.from()还有一个用途:
将字符串转为数组,然后返回字符串的长度。因为它能正确的处理各种Unicode字符,可以避免JavaScript将大于uFFFF的Unicode字符算作两个字符的bug。


Array.of()

用途:将一组值转换为数组。
优点:弥补了Array()的不足。
例子:
从下面例子可以看出:
Array()如果只有一个参数的时候,这个参数实际上是指定数组的长度。和多参的时候表现不一致。
Array.of()总是返回参数值组成的数组。
clipboard.png


copyWithin()

用途:将指定位置的成员复制到其他位置(会覆盖所有的成员),并返回当前数组。
Array.prototype.copyWithin(a,b,c);其中参数a是必选的。参数b,c是可选的,可以为负数。

clipboard.png

find()和findIndex()

find():找出第一个符合条件的成员。
findIndex():找出第一个符合条件成员的位置。
优点:这两个方法都可以发现NaN。
find,findIndex实例
clipboard.png

有关NaN的实例

clipboard.png


fill()

作用:用来初始化空数组比较方便。他会把数组中已有的元素会被全部抹去。
fill(a,b,c)
a:填充的数据。
b:指定填充的起始位置。
c:指定填充的结束位置。

clipboard.png


es6新增遍历数组的方法

entries():对键值对的遍历。
keys():对键名的遍历。
values():对键值的遍历。
这三个方法都能返回一个遍历器对象。可以用for...of循环遍历。
keys的用法:
clipboard.png

entries的用法:
clipboard.png

values的用法:
clipboard.png


includes()

用途:表示某个数组是否包含给定的值。
[].includes(a)
a:测试数据。
b:起始位置,可以是负数。
优点:弥补了indexOf的两个缺点,(1)不够语义化.(2)indexof内部必须使用严格运算符(===)(3)indexOf不能识别NaN,但是include可以。
关于NaN的查找
clipboard.png

查看某个元素是否存在
clipboard.png

注意:
很多数组的方法,对空位的处理规则都不一样,所以最好避免空位的出现。


幸福璐
70 声望12 粉丝

余生漫长,莫要慌张。


下一篇 »
es6---对象

引用和评论

0 条评论