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 相关文章推荐
newxtree.js代码
Mar 13 Javascript
JQuery中如何传递参数如click(),change()等具体实现
Apr 28 Javascript
jQuery内置的AJAX功能和JSON的使用实例
Jul 27 Javascript
JavaScript中的方法重载实例
Mar 16 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
jQuery实现的仿百度分页足迹效果代码
Oct 30 Javascript
jquery ztree异步搜索(搜叶子)实践
Feb 25 Javascript
Bootstrap警告(Alerts)的实现方法
Mar 22 Javascript
简单谈谈关于 npm 5.0 的新坑
Jun 08 Javascript
H5实现仿flash效果的实现代码
Sep 29 Javascript
switchery按钮的使用方法
Dec 18 Javascript
微信小程序canvas绘制圆角base64图片的实现
Aug 18 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下MAIL的另一解决方案
2006/10/09 PHP
php下的权限算法的实现
2007/04/28 PHP
浅析PHP绘图技术
2013/07/03 PHP
Laravel执行migrate命令提示:No such file or directory的解决方法
2016/03/16 PHP
PHP编写学校网站上新生注册登陆程序的实例分享
2016/03/21 PHP
php使用curl通过代理获取数据的实现方法
2016/05/16 PHP
PHP使用FFmpeg获取视频播放总时长与码率等信息
2016/09/13 PHP
laravel通过a标签从视图向控制器实现传值
2019/10/15 PHP
javascript中的事件代理初探
2014/03/08 Javascript
js数组的操作指南
2014/12/28 Javascript
Javascript中获取对象的原型对象的方法小结
2015/02/25 Javascript
jquery轮播的实现方式 附完整实例
2016/07/28 Javascript
JavaScript拖动层Div代码
2017/03/01 Javascript
JS/HTML5游戏常用算法之碰撞检测 地图格子算法实例详解
2018/12/12 Javascript
TypeScript的安装、使用、自动编译的实现
2020/04/10 Javascript
vue+element使用动态加载路由方式实现三级菜单页面显示的操作
2020/08/04 Javascript
PHP webshell检查工具 python实现代码
2009/09/15 Python
python+flask实现API的方法
2018/11/21 Python
python用类实现文章敏感词的过滤方法示例
2019/10/27 Python
修改Pandas的行或列的名字(重命名)
2019/12/18 Python
PyTorch实现更新部分网络,其他不更新
2019/12/31 Python
tensorflow tf.train.batch之数据批量读取方式
2020/01/20 Python
10 套华丽的CSS3 按钮小结
2012/10/03 HTML / CSS
Doyoueven官网:澳大利亚健身服饰和配饰品牌
2019/03/24 全球购物
俄罗斯电子产品在线商店:UltraTrade
2020/01/30 全球购物
医学院四年学习生活的自我评价
2013/11/06 职场文书
2014年教研活动总结范文
2014/04/26 职场文书
医院护士党的群众路线教育实践活动对照检查材料思想汇报
2014/10/04 职场文书
四风对照检查剖析材料
2014/10/07 职场文书
2014大学辅导员工作总结
2014/12/02 职场文书
云台山导游词
2015/02/03 职场文书
世界红十字日活动总结
2015/02/10 职场文书
《夜莺的歌声》教学反思
2016/02/22 职场文书
2016年共产党员公开承诺书
2016/03/24 职场文书
python的变量和简单数字类型详解
2021/09/15 Python
MySQL和Oracle批量插入SQL的通用写法示例
2021/11/17 MySQL