JavaScript数组和伪数组

1伪数组和数组

在JavaScript中,除了5种原始数据类型之外,其他所有的都是对象,包括函数(Function)。

2对象与数组的关系

在说区别之前,需要先提到另外一个知识,就是 JavaScript 的原型继承。

所有 JavaScript 的内置构造函数都是继承自 `Object.prototype` 。

在这个前提下,可以理解为使用 `new Array()` 或 `[]` 创建出来的数组对象,都会拥有 `Object.prototype` 的属性值。

var obj = {};// 拥有 Object.prototype 的属性值

var arr = [];

使用数组对象直接创建的数组,由于 Array.prototype 的属性继承自 Object.prototype,

那么,它将同时拥有 Array.prototype 和 Object.prototype 的属性值

可以得到对象和数组的第一个区别:对象没有数组 Array.prototype 的属性值。

3什么是数组

数组具有一个最基本特征:索引,这是对象所没有的,下面来看一段代码:

var obj = {};

var arr = [];

obj[2] = 'a';

arr[2] = 'a';

console.log(obj[2]); // => a

console.log(arr[2]); // => a

console.log(obj.length); // => undefined

console.log(arr.length); // => 3

3.1 索引

obj[2]输出'a',是因为对象就是普通的键值对存取数据

而arr[2]输出'a' 则不同,数组是通过索引来存取数据,arr[2]之所以输出'a',是因为数组arr索引2的位置已经存储了数据

3.2length属性

obj.length并不具有数组的特性,并且obj没有保存属性length,那么自然就会输出undefined

而对于数组来说,length是数组的一个内置属性,数组会根据索引长度来更改length的值

为什么arr.length输出3,而不是1

3.3添加元素

在给数组添加元素时,并没有按照连续的索引添加,所以导致数组的索引不连续,那么就导致索引长度大于元素个数

4什么是伪数组

1. 拥有 length 属性,其它属性(索引)为非负整数(对象中的索引会被当做字符串来处理,这里你可以当做是个非负整数串来理解)

2. 不具有数组所具有的方法

伪数组,就是像数组一样有 `length` 属性,也有 `0、1、2、3` 等属性的对象,看起来就像数组一样,但不是数组,比如:

var fakeArray = {
  "0": "first",
  "1": "second",
  "2": "third",
  length: 3
};
for (var i = 0; i < fakeArray.length; i++) {
  console.log(fakeArray[i]);
}
Array.prototype.join.call(fakeArray,'+');

5常见的伪数组

1函数内部的 `arguments`

2 DOM 对象列表(比如通过 `document.getElementsByTags` 得到的列表)

3 jQuery 对象(比如 `$("div")` )

伪数组是一个 Object,而真实的数组是一个 Array。

伪数组存在的意义,是可以让普通的对象也能正常使用数组的很多方法,比如:

var arr = Array.prototype.slice.call(arguments);
Array.prototype.forEach.call(arguments, function(v) {
  // 循环arguments对象
});
// push
// some
// every
// filter
// map
// ...

 

以上在借用数组的原型方法的时候都可以通过数组直接量来简化使用:

var obj = {
  0: 'a',
  1: 'b',
  2: 'c',
  length: 3
};
[].push.call(obj, 'd')
console.log([].slice.call(obj))
[].forEach.call(obj, function (num, index) {
  console.log(num)
})

6小结

1对象没有数组 Array.prototype 的属性值,类型是 Object ,而数组类型是 Array

2数组是基于索引的实现, length 会自动更新,而对象是键值对

3使用对象可以创建伪数组,伪数组可以正常使用数组的大部分方法

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值