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 相关文章推荐
JS 容错处理代码, 屏蔽错误信息
Mar 09 Javascript
jquery 注意事项与常用语法小结
Jun 07 Javascript
js判断上传文件的类型和大小示例代码
Oct 18 Javascript
Javascript 命名空间模式
Nov 01 Javascript
jQuery实现炫酷的鼠标轨迹特效
Feb 01 Javascript
javascript自动生成包含数字与字符的随机字符串
Feb 09 Javascript
谈谈JavaScript中function多重理解
Aug 28 Javascript
js实现拉幕效果的广告代码
Sep 02 Javascript
AngularJS实现根据变量改变动态加载模板的方法
Nov 04 Javascript
AngularJS自定义插件实现网站用户引导功能示例
Nov 07 Javascript
原生js获取浏览器窗口及元素宽高常用方法集合
Jan 18 Javascript
Node.js创建HTTP文件服务器的使用示例
May 11 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在XP下IIS和Apache2服务器上的安装
2006/09/05 PHP
4.与数据库的连接
2006/10/09 PHP
有关PHP中MVC的开发经验分享
2012/05/17 PHP
开启PHP Static 关键字之旅模式
2015/11/13 PHP
jQuery maxlength文本字数限制插件
2010/04/16 Javascript
JavaScript栏目列表隐藏/显示简单实现
2013/04/03 Javascript
jQuery插件datalist实现很好看的input下拉列表
2015/07/14 Javascript
jquery实现横向图片轮播特效代码分享
2015/11/19 Javascript
对javascript继承的理解
2016/10/11 Javascript
JS实现购物车特效
2017/02/02 Javascript
AngularJs 延时器、计时器实例代码
2017/09/16 Javascript
vue源码解析之事件机制原理
2018/04/21 Javascript
AngularJs1.x自定义指令独立作用域的函数传入参数方法
2018/10/09 Javascript
Vue项目中最新用到的一些实用小技巧
2018/11/06 Javascript
angularjs http与后台交互的实现示例
2018/12/21 Javascript
详解如何提升JSON.stringify()的性能
2019/06/12 Javascript
vue中typescript装饰器的使用方法超实用教程
2019/06/17 Javascript
vue.js 输入框输入值自动过滤特殊字符替换中问标点操作
2020/08/31 Javascript
python自动化工具日志查询分析脚本代码实现
2013/11/26 Python
python实现udp数据报传输的方法
2014/09/26 Python
python中sets模块的用法实例
2014/09/30 Python
python实现的jpg格式图片修复代码
2015/04/21 Python
Python数据拟合与广义线性回归算法学习
2017/12/22 Python
python自动查询12306余票并发送邮箱提醒脚本
2018/05/21 Python
Python加载带有注释的Json文件实例
2018/05/23 Python
python面试题Python2.x和Python3.x的区别
2019/05/28 Python
python实现控制台输出彩色字体
2020/04/05 Python
英国评分最高的女性剃须刀订阅盒:FFS Beauty
2018/01/25 全球购物
通信工程专业毕业生推荐信
2013/12/25 职场文书
黄河的主人教学反思
2014/02/07 职场文书
《再别康桥》教学反思
2014/02/12 职场文书
物业管理委托协议(2篇)
2014/09/23 职场文书
小学班主任自我评价
2015/03/11 职场文书
演讲开场白和结束语
2015/05/29 职场文书
结婚典礼致辞
2015/07/28 职场文书
如何打开Win11系统注册表编辑器?Win11注册表编辑器打开修复方法
2022/04/05 数码科技