真数组,伪数组区别,辨认与转换

<>在平时做东西的时候经常会碰到关于数组转换这的一些大大小小的问题,所以将他写成一篇博文。

<>数组有两种分类:真数组,伪数组 而伪数组又分为系统自带的伪数组例:document.querySelectorAll('li')

和自定义的伪数组例:var obj = {0:'1',1:'2',length:2},那么怎末区分它们并且相互转换呢,下面就一一分析。

<>伪数组定义:
1、伪数组是一个对象

2、这个对象必须要有length属性
3、如果这个对象的length不为0,那么必须要有按照下标存储的数据

一:数组及类型的的辨认:

1.是不是数组

var ar = [1,2,3,4];
var obj = {0:'1',1:'2',length:2};
function ISarray(selector){
       if(typeof selector==='object'&&'length' in selector&&selector!==window){//判断是不是数组
          console.log('是数组');
          }else{
           console.log('不是数组');
             }
         }
ISarray(ar);//是
ISarray(obj);//是

2.是真数组还是伪数组

var arr = [1,2,3,4];
var obj = {0:'1',1:'2',length:2};
//方法一:
function ISarray(selector){
     if(typeof selector==='object'&&'length' in selector&&selector!==window){//判断是不是数组
     if(({}).toString.apply(selector)==='[object Array]'){
             console.log('是真数组');
           }else{
             console.log('是伪数组');
           }
           }else{
             	console.log('不是数组');
             }
         }
    ISarray(arr);//是真数组
    ISarray(obj);//是伪数组
//方法二:
利用Array.isArray()这个方法
console.log(Array.isArray(arr));//true
console.log(Array.isArray(obj));//false

二: 伪数组转换为真数组

1.方法一:不提倡

var obj = {0:'1',1:'2',length:2};//自定义的伪数组
var arr = [];//真数组
[].push.apply(arr,obj);
console.log(arr);
输出结果为:
 ["1", "2"]
 

此方法是利用了[].push.apply(arr,obj);这种方法既可以将系统自带的伪数组又将自定义的伪数组转换为真数组arr,但是这种方法只兼容IE8以上的浏览器,至于IE8及以下的只能将系统自带的伪数组转换为真数组,自定义的伪数组就不行了,因此为了解决这一问题就出现了下面的方法

2 方法二:提倡

var obj = {0:'1',1:'2',length:2};//自定义的伪数组
var arr = [];//真数组
var arr = [].slice.call(obj);
console.log(arr)
输出结果为 ["1", "2"]

此方法使用了 [].slice.call(obj),也会将系统自带的伪数组和自定义的伪数组转换为真数组,它是利用了数组的slice在不传参的情况下,它会将数组中的值放到一个新的数组中原样返回,故用了[].slice以此返回一个空的新数组再调用call方法把obj的每一个元素放入这个新数组中去,这样就形成一个新的真数组了。

三:真数组转换为伪数组

var ar = [1,2,3,4];
var obj = {};
[].push.apply(obj,ar);
console.log(obj);
{0: 1, 1: 2, 2: 3, 3: 4, length: 4}

四:伪数组转伪数组

自定义的伪数组转化为伪数组先将他转化为真数组再将它转化为伪数组,按此方法就不会有兼容性问题了

//自定义的伪数组
var obj = {0:'1',1:'2',length:2};
//先将自定义伪数组转换为真数组
var arr = [].slice.call(obj);
//再将真数组转换为伪数组
var c= {};
[].push.apply(c,arr);
console.log(c);
{0: "1", 1: "2", length: 2}

以上就是我的理解了。。。。

猜你喜欢

转载自blog.csdn.net/du111_/article/details/83343607
今日推荐