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 相关文章推荐
简单实用的反馈表单无刷新提交带验证
Nov 15 Javascript
js 获取、清空input type="file"的值示例代码
Feb 19 Javascript
JavaScript中变量声明有var和没var的区别示例介绍
Sep 15 Javascript
在JavaScript中处理字符串之link()方法的使用
Jun 08 Javascript
利用jQuery插件imgAreaSelect实现获得选择域的图像信息
Dec 02 Javascript
基于jQuery实现的Ajax 验证用户名唯一性实例代码
Jun 28 jQuery
vue.js项目nginx部署教程
Apr 05 Javascript
vue 使用自定义指令实现表单校验的方法
Aug 28 Javascript
Vue.js中 v-model 指令的修饰符详解
Dec 03 Javascript
微信小程序设置全局请求URL及封装wx.request请求操作示例
Apr 02 Javascript
微信小程序之下拉列表实现方法解析(附完整源码)
Aug 23 Javascript
Vue数组响应式操作及高阶函数使用代码详解
Aug 01 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 Xdebug 调试扩展的安装与使用.
2010/03/13 PHP
谈谈关于php的优点与缺点
2013/04/11 PHP
从wamp到xampp的升级之路
2015/04/08 PHP
PHP也能干大事之PHP中的编码解码详解
2015/04/20 PHP
学习PHP session的传递方式
2016/06/15 PHP
JavaScript面向对象之体会[总结]
2008/11/13 Javascript
JavaScript中的16进制字符(改进)
2011/11/21 Javascript
js优化针对IE6.0起作用(详细整理)
2012/12/25 Javascript
商城常用滚动的焦点图效果代码简单实用
2013/03/28 Javascript
jquery处理页面弹出层查询数据等待操作实例
2015/03/25 Javascript
jsTree使用记录实例
2016/12/01 Javascript
详谈js使用in和hasOwnProperty获取对象属性的区别
2017/04/25 Javascript
vue v-on监听事件详解
2017/05/17 Javascript
利用jquery去掉时光轴头尾部线条的方法实例
2017/06/16 jQuery
vue.js实例todoList项目
2017/07/07 Javascript
python中numpy的矩阵、多维数组的用法
2018/02/05 Python
Django重装mysql后启动报错:No module named ‘MySQLdb’的解决方法
2018/04/22 Python
python3+PyQt5实现文档打印功能
2018/04/24 Python
将python图片转为二进制文本的实例
2019/01/24 Python
django框架model orM使用字典作为参数,保存数据的方法分析
2019/06/24 Python
PyQt5 QTableView设置某一列不可编辑的方法
2019/06/25 Python
Python 通过截图匹配原图中的位置(opencv)实例
2019/08/27 Python
python中resample函数实现重采样和降采样代码
2020/02/25 Python
django实现模板中的字符串文字和自动转义
2020/03/31 Python
Python tkinter界面实现历史天气查询的示例代码
2020/08/23 Python
python 使用xlsxwriter循环向excel中插入数据和图片的操作
2021/01/01 Python
CSS3 实现弹幕的示例代码
2017/08/07 HTML / CSS
奠基仪式主持词
2014/03/20 职场文书
销售内勤岗位职责
2014/04/15 职场文书
暑期社会实践心得体会
2014/09/02 职场文书
争先创优演讲稿
2014/09/15 职场文书
交通事故委托书范本(2篇)
2014/09/21 职场文书
民事诉讼代理授权委托书范本
2014/10/08 职场文书
行政主管岗位职责
2015/02/03 职场文书
同学会感言
2015/07/30 职场文书
《这片土地是神圣的》教学反思
2016/02/16 职场文书