JS 类数组转数组的几种方法(四种)

总结

  1. for 循环
  2. [].slice.call() (calll方法:[].map.call())
  3. ES6语法:Array.from()
  4. ES6语法:展开运算符

原生 js 获取 DOM 元素集合是一个类数组对象,所以不能直接利用数组对象(比如:sort、forEach),需要转换为数组后,才可以使用

下述方法使用 arguments 当伪数组

function fn() {
    var res = toArr(arguments);
    console.log(res);
}
fn("A", 3, 5); // 返回 [ 'A', 3, 5 ]

1.for 循环

function toArr(cArr) {
    var arr = [];
    for (var i = 0; i < cArr.length; i++) {
        arr.push(cArr[i]);
    }
    return arr;
}

2.[].slice.call() call() 方法

function toArr(cArr) {
    return [].slice.call(cArr);
}
  • arr.slice(start, end) :提取索引 start 复制到索引 end 的部分(不包括 end
  • Array.prototype.slice.call(arguments, 0),就是把 arguments 当做当前对象,要调用 argumentsslice 方法,slice(0) 获取所有项(不包含索引)
  • [] 是一个数组对象,会去原型链上找 slice 这个方法,所以可以简写成 [].slice.call()

call() 方法可以搭配的比较广,这里再举个例子:可以用 map 方法,返回遍历的 item 即可

function toArr(cArr) {
    return [].map.call(cArr, (item) => item);
}

3.ES6语法:Array.from()

只要有 length 属性的对象,都可以用此方法转换成数组

function toArr(cArr) {
    return Array.from(cArr);
}

4.ES6语法:展开运算符

function toArr(cArr) {
    return [...cArr];
}
  • 6
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值