资讯专栏INFORMATION COLUMN

类数组转换为数组的方法

JiaXinYi / 3301人阅读

摘要:方法的内部实现使用之后指向了类数组对象一个通用的转换函数是中新增的方法,可以将两类对象转为真正的数组类数组对象和可遍历对象包括新增的数据结构和。

1、Array.prototype.slice.call()
这种方法是借用了数组原型中的slice方法,返回一个数组。slice方法的内部实现:

Array.prototype.slice = function(start,end){

  var result = new Array();  
  start = start || 0;  
  end = end || this.length; //使用call之后this指向了类数组对象
  for(var i = start; i < end; i++){  
       result.push(this[i]);  
  }  
  return result;  

}

一个通用的转换函数:

var toArray = function(s){

try{  
    return Array.prototype.slice.call(s);  
} catch(e){  
        var arr = [];  
        for(var i = 0,len = s.length; i < len; i++){   
             arr[i] = s[i];   
        }  
         return arr;  
} 

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

var arrayLike = {

"0":"a",
"1":"b",
"2":"c",
length:3

};
var arr = Array.from(arrayLike);//["a","b","c"]
//把NodeList对象转换为数组,然后使用数组的forEach方法
var ps = document.querySelectorAll("p");
Array.from(ps).forEach(p){

console.log(p);

});
//转换arguments对象为数组
function foo(){

var args = Array.from(arguments);
//...

}
//只要是部署了Iterator接口的数据结构,Array.from都能将其转换为数组
Array.from("hello"); //["h","e","l","l","o"]

3、扩展运算符(…)
同样是ES6中新增的内容,扩展运算符(…)也可以将某些数据结构转为数组

//arguments对象的转换
function foo(){

var args = [...arguments];

}
//NodeList对象的转换
[...document.querySelectorAll("p")]

扩展运算符实际上调用的是遍历器接口,如果一个对象没有部署此接口就无法完成转换

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/96106.html

相关文章

  • 数组对象转换数组对象简单理解

    摘要:将对象转换为数组对象的限制不知道现在还是否需要考虑这一点之前的版本将实现为对象而非对象,对象不能直接调用方法,因此需要采取其他方式转化。 关于类数组对象 JavaScript中有一些著名的类数组对象,它们看起来很像数组: 拥有length属性 元素按序保存在对象中,可以通过索引访问 但实际和数组又不是一回事: 没有数组的很多方法 也会有数组没有的方法 (e.g. NodeLis...

    wayneli 评论0 收藏0
  • JavaScript数组

    摘要:与稀疏数组对立的为密集数组,密集数组的索引会被持续的创建,并且其元素的数量等于其长度。创建一个长度为的数组,并初始化了个元素使用构造函数创建数组对象的时候,关键字是可以省略的。另外使用和删除元素是影响数组的长度的。 说明:本文只总结了JavaScript数组在web端的行为,不包括NodeJs端的行为。本文不涉及类型化数组(TypedArray)的讨论、总结。 一、什么是数组 数组的定...

    HtmlCssJs 评论0 收藏0
  • 第17部分_反射机制

    摘要:如果此对象表示非静态上下文中声明的内部类,则形参类型作为第一个参数包括显示封闭的实例。参数字段名返回此类中指定字段的对象抛出如果找不到带有指定名称的字段。 一、类的加载 1. 概述 当程序要使用某个类时,如果该类还未被加载到内存中,则系统会通过加载,连接,初始化三步来实现对这个类进行初始化 2. 加载 就是指将class文件读入内存,并为之创建一个Class对象 任何类被使用时系统都...

    trilever 评论0 收藏0
  • 排名前16Java工具

    摘要:在中,工具类定义了一组公共方法,这篇文章将介绍中使用最频繁及最通用的工具类。另外,工具类,根据阿里开发手册,包名如果要使用不能带,工具类命名为 在Java中,工具类定义了一组公共方法,这篇文章将介绍Java中使用最频繁及最通用的Java工具类。以下工具类、方法按使用流行度排名,参考数据来源于Github上随机选取的5万个开源项目源码。 一. org.apache.commons.io....

    android_c 评论0 收藏0
  • 干货:排名前16Java工具

    摘要:在中,工具类定义了一组公共方法,这篇文章将介绍中使用最频繁及最通用的工具类。另外,工具类,根据阿里开发手册,包名如果要使用不能带,工具类命名为。 showImg(https://segmentfault.com/img/remote/1460000015356958); 在Java中,工具类定义了一组公共方法,这篇文章将介绍Java中使用最频繁及最通用的Java工具类。以下工具类、方法...

    nanchen2251 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<