首页 > 编程知识 正文

数组对象转数组,转换数组类型

时间:2023-05-05 15:12:10 阅读:224562 作者:362

在es6提出之后,这个已经变得非常简单了,直接调用Array.from就可以了,如果具备Iterator接口的话,我们还可以用(扩展运算符)

1.Array.from
es6提出的,非常好用,简单来说,只要具备length属性的,就可以转为数组。

2. …(扩展运算符)
必须具备Iterator接口才可以,像函数的参数,获取的dom元素等。

不支持es6的话,可以用下面的

3.Array.prototype.slice.call(obj)
这算是es5解决这个问题,最常用的一种方法了吧,除了写起来麻烦些,还不知道有什么副作用。
(其实把call换成apply也肯定是好使滴,亲测有效,但apply常用于函数的自执行,所以这里常用call应该是跟语意有关系吧)

4.concat
这算是一个非常规的做法吧,没在实战中看谁用过,可以实现需求,但会改动原生的方法,并不好

let obj = {length: 2,0:'a', 1:'b'};obj[Symbol.isConcatSpreadable] = true;//调用concat时,内部会调用它,控制合并后是否展开,数组默认展开,类数组默认不展开[].concat(obj) -->[ 'a', 'b' ]

5.把数组的Symbol.iterator赋给类数组

obj[Symbol.iterator] = Array.prototype[Symbol.iterator];[...obj]

6.Array.apply(null, obj)
看过vue文档的,应该对这个比较眼熟吧,在render函数那部分提到过它,它也需要具有length属性的才可以
(只是想找相应方法的话,看到这就够了)

其实这就有个比较好玩的事了,我们平时用apply都知道第二个参数放数组,当时学的较早没多问问自己,后来用多了也就麻木了,那回头再看一下,传别的行不行呢?当然是可以,其实数组不也是可以看成属性名为索引的特殊对象吗,所以用带有length属性的类数组替换,也是可以的,像这样

function fuc (arg1, arg2){ console.log(arg1, arg2)}fuc.apply(null, {0: 0, 1: 1, 'length': 2});

还有个小问题,在处理只有length属性时,这几种方法会有不同的结果,根据需求,选择方法

Array.prototype.slice.call({'length':2}); -->[ , ]concat方法 -->[ , ]Array.from({'length':2}); -->[undefined, undefined]Array.apply(null,{'length':2}); -->[undefined, undefined]

其实这些东西都是比较灵活的,当有不同需求时,可以把数组上的其他方法用在类数组上试试,例如:
把类数组中的元素,添加到已有的数组中,就可以用Array.prototype.push.apply(arr, obj)

等等~

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。