【转】javascript Object使用Array的方法
原文: http://www.cnblogs.com/idche/archive/2012/03/17/2403894.html
Array.prototype.push
push向数组尾部添加一项并更新length ,返回数组长度。
如果Object使用push会怎样?
看下面代码, obj好像数组一样工作了。length会自动更新。
var push = Array.prototype.push;
var obj = {};
push.call(obj, "hello"); // 返回值 1
// obj {"0":"hello", length:0}
push.call(obj, "world"); // 返回值 2
// obj {"0":"hello", "1":"world",length:2}
Array.prototype.length Array.prototype.splice
把length和splice 给Object
看下面代码:obj这货居然变成数组了?其实不然这可能是调试工具的一些输出检查问题。
我们用 instanceof 测试 obj instanceof Array //false
var obj = {
length:0,
splice:Array.prototype.splice
};
console.log( obj ); // 打印:[]
继续看下面的代码:
obj.push(0)//返回obj.length 1
obj.push(1)//返回obj.length 2
obj.splice(0, 1);//删除第一项 返回删除项[0]
obj.length // 1 splice删除一项的时候同样更新 length属性
这样obj的表现几乎和array一样了。不出意外slice,pop,shift,unshift什么的都可以正常工作在object中。
不过如果直接设置length,在数组中会删除大于length的下表的项, 但里的obj并不不会更新。
应用在哪?
jQuery对象表现像一个array,其实他是一个对象。这种对象如何new出来呢?
实际jQuery把Array的方法借给Object,从而达到这个jQuery对象的效果,jQuery对象内部也直接使用push等Array的方法。
看看jQuery的部分源码 (注意加粗)

// Start with an empty selector
selector: "", // The current version of jQuery being used
jquery: "1.7.1", // The default length of a jQuery object is 0
length: 0,
...... // For internal use only.
// Behaves like an Array's method, not like a jQuery method.
push: push,
sort: [].sort,
splice: [].splice

如果你要把Object玩成Array,那么可能潜在的问题length属性不会和“数组”项总和对应起来。
所以直接使用length设置长度不会得到支持。
看下面jquery代码,虽然length更新了,jquery的对象并没更新。(当然这并不是jquery的问题)
var jq = $('div') //假设我们在页面获取了40个div
jq.length // 40
jq.length = 0;
jq// ? jq中仍然存放了40个dom对象 length属性不会和“数组”项总和对应起来。
Object使用array的方法还能正常工作,实在有些意想不到,可能实际应用远不止这些。
【转】javascript Object使用Array的方法的更多相关文章
- javascript中数组Array的方法
一.常用方法(push,pop,unshift,shift,join)push pop栈方法,后进先出var a =[1,2,3];console.log(a.push(40)); //4 返回数组的 ...
- javascript Object与Array用法
引用类型:引用类型是一种数据结构,用于将数据和功能组织在一起.引用类型的值是引用类型的一个实例. 一.Object ECMAScript中的对象其实就是一组数据和功能的结合. Object类型其实是所 ...
- JavaScript中的Array对象方法调用
方法concat for 循环与for in 循环 <html> <head> <script type="text/javascript"> ...
- JavaScript中toStirng()与Object.prototype.toString.call()方法浅谈
toStirng()与Object.prototype.toString.call()方法浅谈 一.toString()是一个怎样的方法?它是能将某一个值转化为字符串的方法.然而它是如何将一个值从一种 ...
- JavaScript引用类型之Array数组的toString()和valueof()方法的区别
一.转换方法 1.在JavaScript中几乎所有对象都具有toLocaleString().toString和valueof()方法,因为,所有的对象都继承自Object,而前面所说的方法都是Obj ...
- JavaScript中的Array.prototype.slice.call()方法学习
JavaScript中的Array.prototype.slice.call(arguments)能将有length属性的对象转换为数组(特别注意: 这个对象一定要有length属性). 但有一个例外 ...
- 实现一个函数clone,使JavaScript中的5种主要的数据类型(包括Number、String、Object、Array、Boolean)进行值复制
实现一个函数clone,可以对JavaScript中的5种主要的数据类型(包括Number.String.Object.Array.Boolean)进行值复制. 1 /** 对象克隆 2 * 支持基本 ...
- JavaScript -Array.form方法
Array.from方法可以把一个类数组或者课遍历对象转换为一个正真的数组 语法 Array.from(arrayLike[, mapFn[, thisArg]]) 参数 arrayLike 想要转换 ...
- JavaScript Array数组方法详解
Array类型是ECMAScript中最常用的引用类型.ECMAScript中的数据与其它大多数语言中的数组有着相当大的区别.虽然ECMAScript中的数据与其它语言中的数组一样都是数据的有序列表, ...
随机推荐
- CentOS7 安装 Mysql 服务
我希望所有的软件包都用 rpm.yum 安装,这样卸载.升级.管理方便,可是自带的 yum 仓库里面没有 mysql-server 或者不是最新的,我需要安装MySQL官方的 yum 仓库, http ...
- Sublime Text 2
常用功能: 安装Package Control:https://sublime.wbond.net/ 多行选择.多行编辑鼠标选中多行,按下 Ctrl+Shift+L (Command+Shift+L) ...
- 手机端跳转和pc端跳转
http://jingyan.baidu.com/article/cdddd41c61823e53cb00e198.html 参考网址 浏览:11532 | 更新:2014-04-22 16:51 第 ...
- 2016弱校联盟十一专场10.2——Floyd-Warshall
题目链接:Floyd-Warshall 题意: 给你n个点,m条边,100>m-n>0,现在有q个询问,问你任意两点的最短距离,题目保证每条边都被连接,每条边的距离为1 题解: 首先我们可 ...
- WireShark 抓取Telnet包
用Python的Asyncore.dispatcher写了个小服务器,客户端使用telnet连接上去之后一直显示连接丢失,想抓下包看看 抓包结果如下: 服务器在192.168.1.102:8080 端 ...
- Storm 集群安装配置
本文详细介绍了 Storm 集群的安装配置方法.如果需要在 AWS 上安装 Storm,你应该看一下 storm-deploy 项目.storm-deploy 可以自动完成 E2 上 Storm 集群 ...
- HDU 2102 A计划(DFS)
题目链接 Problem Description 可怜的公主在一次次被魔王掳走一次次被骑士们救回来之后,而今,不幸的她再一次面临生命的考验.魔王已经发出消息说将在T时刻吃掉公主,因为他听信谣言说吃公主 ...
- SourceInsight - 常用设置和快捷键大全
1. 让{ 和 } 不缩进 Options -> Document Options -> Auto Indenting -> Auto Indent Type 选 Simple 2. ...
- Arch安装详解
选择安装方式 CD/USB Arch启动盘安装 使用Arch启动盘比较简单方便,没有额外设置,直接阅读下一步. USB flash installation media 启动盘制作: USB flas ...
- oracle 11g高级 安装图解(摘自网络)
使用的高级安装 启动OUI后出现“选择安装方式”窗口,我们选择:高级安装 步骤3:出现“选择安装类型”窗口,选择我们需要安装的版本.我们在此肯定是选择企业版. 至于产品语言不用选择,它会根据当前系统的 ...