javascript:类数组 -- 对象

在javascript中,对象与数组都是这门语言的原生规范中的基本数据类型,处于并列的位置。

类数组:本质是一个对象,只是这个 对象  的属性有点特殊,模拟出数组的一些特性。

一般来说,如果我们有一个对象obj和一个数组a:

obj["attr1"];    //取obj对象的attr1属性

a[1];              //取数组a中的第二个元素

但是,有些时候,也会将一个对象“伪装”成一个数组来用,我们把这种对象称为“类数组对象”,再此我们可以給它下一个定义,请看如下的代码:

var a= {};

var i = 0;

for(i=0; i<10 ; i++){

  a[i] = i*i;

}

a.length = i;

var total = 0;

for(var j=0; j< a.length; j++){

  total += a[j];

}

上述代码中的a就是一个类数组对象,因此,我们可以在这里给类数组对象下一个定义:

任何一个具有length属性以及对应的非负整数属性的对象作为一种数组。

但是,类数组对象毕竟本质上是一个Object,而不是真正的Array,那么二者的区别在哪里呢?

1、一个是对象,一个是数组

2、数组的length属性,当新的元素添加到列表中的时候,其值会自动更新。类数组对象的不会。

3、设置数组的length属性可以扩展或截断数组。

4、数组也是Array的实例可以调用Array的方法,比如push,pop等等。

实例1:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>类数组</title>
 6     </head>
 7     <body>
 8         <div></div>
 9         <div></div>
10         <div></div>
11         <div></div>
12         <script type="text/javascript">
13             //当我们通过标签选择器获取<div>,并在控制台打印时,返回的值便是一个典型的类数组。
14             var divs = document.getElementsByTagName("div");
15             console.log(divs)
16             //定义一个数组
17             var arr = ["jack","mack","sunny"];
18             //定义一个类数组对象
19             var obj = {
20                 0 : "jack",
21                 1 : "mack",
22                 2 : "sunny",
23                 length : 3,
24                 push : Array.prototype.push,
25                 splice : Array.prototype.splice
26             }
27
28             arr.push("张三")
29             obj.push("张三")
30             console.log(arr)
31             console.log(obj)
32             //循环遍历
33             for(var i = 0;i < arr.length;i++){
34                 console.log(arr[i])
35             }
36             for(var j = 0;j < obj.length;j++){
37                 console.log(obj[j])
38             }
39         </script>
40     </body>
41 </html>

程序运行结果如下:

1. 当第15行运行 打印的结果可以看到,完全与我们常见的数组一样 -- [div,div,div,div],并且也有length属性

2.定义数组 arr 运行结果如下

3. 当我们将第25行(splice : Array.prototype.splice)注释掉,我们可以看到,打印结果是花括号 { },与我们常见的对象表现形式一样,

类数组说到底还是一个对象,只是这个对象的属性有点特殊,模拟出数组的一些特性。

当我们将第23,24行注释掉,我们原先用在数组中的方法(例如:push,length),在这个类数组中是用不了的,最后只会报错,但是当我们在这个对象中追加(写入)它push,length属性,我们在数组中用的方法在这个对象中也能实现。(当然push实在原型里添加,有不理解的可以参考我的javascript:原型与原型链,可以更好的理解。)

结合上下数组arr与类数组obj的执行结果可以看到,并没有什么区别,都能push“张三”进去。

4.当我们遍历 arr 与 obj 最后的执行结果是一样的,这便是所谓的 -- 类数组(假数组)。

原文地址:https://www.cnblogs.com/xuxiaoyu/p/10148090.html

时间: 2024-11-10 15:03:28

javascript:类数组 -- 对象的相关文章

[Javascript]类数组对象为什么不能用for in进行遍历

上来说重点,再废话 类数组对象不能使用for(var key in  elements)进行遍历,这是因为类数组的最后一个哈希的键值对是length:n   n代表数组长度 在Javascript中,我们在DOM树上面获取页面的元素, 例如使用var emls=getElementsByTagName () var emls=querySelectedAll() 获得的elements包含多个dom元素,在学习的过程中,我没有使用for(var i=0;i<elements.length;i++

javascript 类数组对象

原文:https://segmentfault.com/a/1190000000415572 定义: 拥有length属性,其他属性(索引)为非负整数(对象中的所有会被当做字符串来处理,这里你可以当做是个非负整数串来理解) 不具有数组所具有的方法 类数组示例: var a = {'1':'gg','2':'love','4':'meimei',length:5}; Array.prototype.join.call(a,'+');//'+gg+love++meimei' 非类数组示例: var

JavaScript中的类数组对象

在javascript中,对象与数组都是这门语言的原生规范中的基本数据类型,处于并列的位置. 一般来说,如果我们有一个对象obj和一个数组a: obj["attr1"];    //取obj对象的attr1属性 a[1];   //取数组a中的第二个元素 但是,有些时候,也会将一个对象“伪装”成一个数组来用,我们把这种对象称为“类数组对象”,再此我们可以給它下一个定义,请看如下的代码: var a= {}; var i = 0; for(i=0; i<10 ; i++){ a[i

Javascript 类数组(Array-like)对象

Javascript中的类数组对象(Array-like object)指的是一些看起来像数组但又不是数组的对象.Javascript中的arguments变量.document.getElementsByTagName()返回值就是典型的类数组对象. 类数组特性 类数组对象具有一个length属性且length的值为非负整数. 类数组对象不具有数组对象的方法.例如:push. pop等方法. 类数组对象可以像数组一样遍历,但不支持数组对象的方法. function test1() { for(

Effective JavaScript Item 51 在类数组对象上重用数组方法

Array.prototype对象上的标准方法被设计为也可以在其它对象上重用 - 即使不是继承自Array的对象.因此,在JavaScript中存折一些类数组对象(Array-like Objects). 一个典型的例子是函数的arguments对象,在Item 22中对它进行过介绍.该对象并不继承自Array.prototype,所以我们不能直接调用arguments.forEach来对其中的元素进行遍历.但是,我们可以通过首先得到forEach方法的对象,然后调用call方法(可以参考Ite

JavaScript 浅析数组对象与类数组对象

数组(Array对象) 数组的操作 创建数组方法 添加与修改数组元素 删除数组元素 使用数组元素 遍历数组元素 多维数组 数组相关的函数 concat() join() pop() push() shift() unshift() reverse() sort() slice() splice() 类数组对象 定义 举例 对比数组 转换 间接 直接 数组(Array对象) 数组就是一组数据. 在JavaScript中没有数组这种数据类型.数组时对象创建的. 键(下标): 用于区分数组中不同数值的

[Effective JavaScript 笔记]第58条:区分数组对象和类数组对象

示例 设想有两个不同类的API.第一个是位向量:有序的位集合 var bits=new BitVector(); bits.enable(4); bits.enable([1,3,8,17]); bits.bitAt(4);//1 bits.bitAt(8);//1 bits.bitAt(9);//0 enable方法被重载了,可以传入一个索引或索引的数组.第二个类的API是字符串集合:无序的字符串集合 var set=new StringSet(); set.add('Hamlet'); se

08.18 javascript 06 数组 数组的概念 创建数组 读取数组中的元素 稀疏数组 添加和删除数组的元素 数组遍历 多维数组 数组的方法 类数组对象 作为数组的字符串

# 数组 ### 数组的概念 * 数组是值的有序集合 * 数组中的每个值 称之为 元素 * 每个元素可以是任意数据类型的值 * 每个元素都有索引(下标) * 元素的索引从0开始,按照顺序递增. 元素最大的索引 2^32-2 ### 创建数组 * 直接量 `[]` * 构造函方式  `new Array()` ### 读写数组中的元素 * 数组名[索引] ### 稀疏数组 * js数组的索引是连续的 * 没有连续的给元素赋值 , 没有赋值的元素会自动赋值 undefined ### 添加和删除 数

[Effective JavaScript 笔记]第51条:在类数组对象上复用通用的数组方法

前面有几条都讲过关于Array.prototype的标准方法.这些标准方法被设计成其他对象可复用的方法,即使这些对象并没有继承Array. arguments对象 在22条中提到的函数arguments对象.它是一个类数组对象,并不是一个标准的数组,所以无法使用数组原型中的方法,因此无法使用arguments.forEach这样的形式来遍历每一个参数.这里我们必须使用call方法来对使用forEach方法. function highlight(){ [].forEach.call(argume