在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、function内部的arguments对象就是一个类数组对象,它用arguments[2]来代表传入的第3个参数。

2、DOM方法document.getElementsByTagName(),返回的也是一个类数组对象

3、jQuery中的应用: 我们知道可以通过 $('#id')[0]来从jQuery对象获取原生的dom对象,但是jQuery中是如何实现的呢,$('#id')获取的jQuery对象到底是一个对象还是一个数组呢,答案是:一个类数组对象

我们看一下jQuery的源代码:

jQuery = window.jQuery = window.$ = function( selector, context ) {
        return new jQuery.fn.init( selector, context );
    },
jQuery.fn = jQuery.prototype = {
    init: function( selector, context ) {
        selector = selector || document;

        // Handle $(DOMElement)
        if ( selector.nodeType ) {
          this[0] = selector;
          this.length = 1;
          this.context = selector;
          return this;
         }

    ...

红色字部分,构造了一个类数组对象,this指向的是通过jQuery('#id')构造的jQuery对象,而selector就是原生的dom对象,在此,把dom对象存在jQuery对象的0属性里了(属性名就叫0)。

JavaScript中的类数组对象的更多相关文章

  1. 浅谈JavaScript和DOM中的类数组对象

    JavaScript是一门弱类型语言,它的数据类型分为两大类:简单数据类型(5种:Undefined.Null.Boolean.Number.String)和复杂数据类型(1种:Object).Obj ...

  2. javascript 中的类数组和数组

    什么是类数组呢? 我们先来看一段代码: function fn() { console.dir(arguments); } fn(1,2,3,4,5,6,7,8,9,10); 这段代码的执行后,在 c ...

  3. java基础64 JavaScript中的Arrays数组对象和prototype原型属性(网页知识)

    1.Arrays数组对象的创建方式 方式一: var 变量名=new Array(); //创建一个长度为0的数组. 方式二: var 变量名=new Array(长度); //创建一个指定长度的数组 ...

  4. javaScript中定义类或对象的五种方式

    第一种方式: 工厂方法 能创建并返回特定类型的对象的工厂函数(factory function). function createCar(sColor){ var oTempCar = new Obj ...

  5. js中的类数组对象---NodeList

    动态 NodeList 这是文档对象模型(DOM,Document Object Model)中的一个大坑. NodeList 对象(以及 HTML DOM 中的 HTMLCollection对象)是 ...

  6. 简述JavaScript对象、数组对象与类数组对象

    问题引出 在上图给出的文档中,用JavaScript获取那个a标签,要用什么办法呢?相信第一反应一定是使用document.getElementsByTagName('a')[0]来获取.同样的,在使 ...

  7. JS中集合对象(Array、Map、Set)及类数组对象的使用与对比

    原文地址 在使用js编程的时候,常常会用到集合对象,集合对象其实是一种泛型,在js中没有明确的规定其内元素的类型,但在强类型语言譬如Java中泛型强制要求指定类型. ES6引入了iterable类型, ...

  8. 如何在JavaScript中手动创建类数组对象

    前言 关于什么是js的类数组对象这里不再赘述.可以参考这个链接,还有这里. js中类数组对象很多,概念简单的讲就是看上去像数组,又不是数组,可以使用数字下标方式访问又没有数组方法. 例: argume ...

  9. javascript 类数组对象

    原文:https://segmentfault.com/a/1190000000415572 定义: 拥有length属性,其他属性(索引)为非负整数(对象中的所有会被当做字符串来处理,这里你可以当做 ...

随机推荐

  1. php的反射

    我们可以在PHP运行时,通过PHP的反射动态的获取类的方法.属性.参数等详细信息.   用途:插件的设计,文档的自动生成,扩充PHP语言. <?php class Person { const ...

  2. Python Socket 编程详细介绍(转)

    Python 提供了两个基本的 socket 模块: Socket 它提供了标准的BSD Socket API. SocketServer 它提供了服务器重心,可以简化网络服务器的开发. 下面讲解下 ...

  3. linux下xampp(apache)中配置域名访问,以及遇到的问题

    xampp中apache使用域名访问 一.首先找到/opt/lampp/etc/httpd.conf: # Virtual hosts Include etc/extra/httpd-vhosts.c ...

  4. python生成验证码,文字转换为图片-乾颐堂

    在58或者赶集等一些网站上经常看到手机号是图片格式,或者一些网站的验证码.这些都是动态生成的,今天我们来看一下如何用python把文字生成图片.其实今天主要借助pygame的图像渲染模块,这样比较简单 ...

  5. 使用JConsole监控HBase内存状态

    使用JConsole或者VisualVM等工具监控HBase状态时,需要修改HBase的配置文件,以解决随机端口问题. 文件名:hbase-env.sh export HBASE_JMX_BASE=& ...

  6. spring 注解 注入属性 和 注解完成bean定义

    1. 使用 @Autowired 和 @Resource 注解来注入属性 2. 使用 @Component.@Repository.@Service.@Controller 注解,就将该类定义为一个B ...

  7. 通过程序修改注册表键值来达到修改IE配置参数的目的

    通过程序修改注册表键值来达到修改IE配置参数的目的 使用IE访问应用程序或网页时经常需要设置一些选项(工具-Internet 选项),比如为了避免缓存网页,把工具-Internet选项-常规选项卡-I ...

  8. pyspider示例代码四:搜索引擎爬取

    搜索引擎爬取 #!/usr/bin/env python # -*- encoding: utf- -*- # Created on -- :: # Project: __git_lab_fix fr ...

  9. 2018.08.19 洛谷P1402 酒店之王(最大流)

    传送门 最大流入门题,把人拆点即可. 代码: #include<bits/stdc++.h> #define N 505 using namespace std; inline int r ...

  10. js,java,jstl多分隔符分割字符串

    1.js多分隔符 分割字符串 var username = “zhao,li;wang.liu”: var arr = str.split(/;|:|,|,|./);  括号里面可以写多分割符号,中英 ...