Javascript数组中push方法用法分析


Posted in Javascript onOctober 31, 2016

本文实例讲述了Javascript数组中push方法用法。分享给大家供大家参考,具体如下:

看下面代码:

var o = {
  1:'a'
  ,2:'b'
  ,length:2
  ,push:Array.prototype.push
};
o.push('c');

Q:o现在内部的值是什么样子?

我的第一反应是排斥,为什么要研究不合理情况下【解释引擎】的行为?但是这种推论有时候又很吸引人,于是我回来的时候仔细思考了下,发现其实很简单。

对于push这个方法,我条件反射地想到的就是栈,【数据结构的经典栈】中压栈和弹栈操作依据的都是栈顶指针,栈顶指针始终指向栈顶,意味着它会因为压弹栈而自动增减。在javascript中的数组中这个指针就是length。所以在上面的代码中,o.push('c')就是o.2 = 'c'(当然o.2不能直接访问,这只是伪代码),所以代码执行完o中数据如下:

{
  1:'a'
  ,2:'c'
  ,length:3 //push操作=>length+1
  ,push:Array.prototype.push
}

补充说明:

JavaScript中,万物皆对象,而javascript的对象与强类型的对象有一些不同的地方,可以理解成就是一组键值对的集合。其array类型也不例外,它的下标访问就是键访问(不过它的键都是自然数),在上面的例子中赋值给a的对象字面量实际模拟了一个数组(一个下标从1开始的数组)——当然只有部分数组的特性,比如真实的数组在进行键访问的时候,会根据length进行越界检查。

只要知道push的位置依据的是length就可以了,下面种种看似奇怪的现象都好理解:

//1.length不存在,引擎置为0
var o = {
  '1':'a'
  ,'2':'b'
  ,push:Array.prototype.push
};
o.push('c');//c {0:'c',1:'a',2:'b',...}
//2.length为负值,这是个有趣的问题,涉及到原码反码和补码【1】
var o = {
  '1':'a'
  ,'2':'b'
  ,length:-1
  ,push:Array.prototype.push
};
o.push('c');//c {1:'a',2:'b',4294967295:'c',length:4294967296,...}
//3.length为字符或对象
var o = {
  1:'a'
  ,2:'b'
  ,length:'A'
  ,push:Array.prototype.push
};
o.push('c');//c {0:'c',1:'a',2:'b',length:1,...}我还以为js解释器会把A转换成ASCII码来给length赋值呢,终于看到了javascript的自由还是有节操的

计算机中数值都是以补码方式存储的,为了方便运算,-1的补码与4294967295补码一样,根据length的语义,此处是无符号数

[-1]补 = 1111 1111 1111 1111 1111 1111 1111 1111 =  [4294967295]补  = 1111 1111 1111 1111 1111 1111 1111 1111

所以这样我们接差对2中的o压入一个对象,key取的是4294967296,但是数组的最大长度限制为4294967296,也就是说下标只能取到4294967295,只会取到32位——对于4294967296 = 1 0000 0000 0000 0000 0000 0000 0000 0000 取后32位,就变成了0,所以此次push的位置是0。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript学习笔记(五) Array 数组类型介绍
Jun 19 Javascript
JS/jQuery实现默认显示部分文字点击按钮显示全部内容
May 13 Javascript
使用js操作cookie的一点小收获分享
Sep 03 Javascript
js函数返回多个返回值的示例代码
Nov 05 Javascript
多种方法实现360浏览器下禁止自动填写用户名密码
Jun 16 Javascript
鼠标事件的screenY,pageY,clientY,layerY,offsetY属性详解
Mar 12 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
Jul 27 Javascript
JS图片轮播与索引变色功能实例详解
Jul 06 Javascript
angular中的cookie读写方法
Aug 02 Javascript
JavaScript中严格判断NaN的方法
Feb 16 Javascript
解决angularjs WdatePicker ng-model的问题
Sep 13 Javascript
浅谈JavaScript中你可能不知道URL构造函数的属性
Jul 13 Javascript
JavaScript中的await/async的作用和用法
Oct 31 #Javascript
使用 jQuery.ajax 上传带文件的表单遇到的问题
Oct 31 #Javascript
微信小程序 开发工具快捷键整理
Oct 31 #Javascript
微信小程序 实现tabs选项卡效果实例代码
Oct 31 #Javascript
HTML5基于Tomcat 7.0实现WebSocket连接并实现简单的实时聊天
Oct 31 #Javascript
jQuery绑定事件的四种方式介绍
Oct 31 #Javascript
JS 实现导航菜单中的二级下拉菜单的几种方式
Oct 31 #Javascript
You might like
PHP全概率运算函数(优化版) Webgame开发必备
2011/07/04 PHP
PHP文件锁定写入实例解析
2014/07/14 PHP
php生成图片验证码-附五种验证码
2015/08/19 PHP
PHP实现的XXTEA加密解密算法示例
2018/08/28 PHP
用JS判断IE版本的代码 超管用!
2011/08/09 Javascript
基于jquery的一个拖拽到指定区域内的效果
2011/09/21 Javascript
JavaScript对象和字串之间的转换实例探讨
2013/04/21 Javascript
javascript读写XML实现广告轮换(兼容IE、FF)
2013/08/09 Javascript
jquery实现不同大小浏览器使用不同的css样式表的方法
2014/04/02 Javascript
js使用Array.prototype.sort()对数组对象排序的方法
2015/01/28 Javascript
javaScript的函数对象的声明详解
2015/02/06 Javascript
jquery实现简单的banner轮播效果【实例】
2016/03/30 Javascript
使用jQuery制作浮动工具栏的实例分享
2016/05/13 Javascript
javascript中使用未定义变量或值的情况分析
2016/07/19 Javascript
ionic实现底部分享功能
2017/05/11 Javascript
理解 javascript 中的函数表达式与函数声明
2017/07/07 Javascript
关于JavaScript语句后面的分号问题
2017/12/07 Javascript
Spring boot 和Vue开发中CORS跨域问题解决
2018/09/05 Javascript
[36:22]VP vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python编写朴素贝叶斯用于文本分类
2017/12/21 Python
python中import与from方法总结(推荐)
2019/03/21 Python
Django自带日志 settings.py文件配置方法
2019/08/30 Python
Python实现基于socket的udp传输与接收功能详解
2019/11/15 Python
pandas 强制类型转换 df.astype实例
2020/04/09 Python
Django model class Meta原理解析
2020/11/14 Python
HTML5: Web 标准最巨大的飞跃
2008/10/17 HTML / CSS
英国No.1文具和办公用品在线:Euroffice
2016/09/21 全球购物
美国最大的在线寄售和旧货店:Swap.com
2018/08/27 全球购物
主题酒店策划书
2014/01/28 职场文书
授权委托书格式模板
2014/04/03 职场文书
信用卡结清证明怎么写
2014/09/13 职场文书
"9.18"国耻日演讲稿范文
2014/09/14 职场文书
个人查摆问题整改措施
2014/10/04 职场文书
2014年学生会生活部工作总结
2014/11/07 职场文书
保送生自荐信
2015/03/06 职场文书
厉害!这是Redis可视化工具最全的横向评测
2021/07/15 Redis