JavaScript对象引用与赋值实例详解


Posted in Javascript onMarch 15, 2017

本文实例讲述了JavaScript对象引用与赋值。分享给大家供大家参考,具体如下:

<script type="text/javascript">
//例子一: 引用
var myArrayRef = new Array(0,1,2); //创建数组对象
var mySeconArrayRef = myArrayRef; // 对象复制.
myArrayRef[0] = 100; // 修改元素值
alert(mySeconArrayRef[0]);
/**
* 输出 100; 学过其它语言的都应该知道这里应该输出的是0 为什么输出的是100呢?
* 上面程序通过把myArrayRef对象复制给了mySeconArrayRef这时就存在了2个独立的 但最初值是相同的对象
* 因为是独立的为什么修改myArrayRef会对别一个对象有影响呢?大家都知道只有当他们引用的是同一个对象时这时修改一个才会
* 对别一个产生影响.但是在javascript语言中创建的对象myArrayRef值中其时保存的是对象的引用(也就是一个地址).
* 也就是 我用 new Array生成的保存在内存中而new Array把它所在的地方告诉了myArrayRef,myArrayRef又把这地址告诉了mySeconArrayRef
* 他们两个都指向的是new Array生成对象的地址而不是把对象保存在myArrayRef中,所以通过其中的一个去修改值时其时是修改他们同指象的那对象.
*/
alert(mySeconArrayRef[0] );
//例子二: 赋值
var myVa = 'ABC'; //把ABC的值 赋予了myVa
var myVb = myVa; // myVa 赋值给 myVb
myVa = 'DEF'; //修改myVa
/**
* 输出的是:ABC. 因为是把值保存在了变量了 而不是保存的是引用地址,所以他们两个是相对独立的整体.
*/
alert(myVb);
</script>

如果真要复制对象互不影响,则要通过转换赋值或者遍历key:value来复制你中的方法和属性。

注意:对象的子对象也是引用,所以遍历赋值的时候要判断,子元素是否是对象,如果子元素是对象,则继续对子元素进行遍历赋值。

转换赋值方式:

var data = {a:1,b:2,c:3,d:[0,1,2,3]};
var str = JSON.stringify(data);
var data1 = $.parseJSON(str); //$为jQuery对象需要引入jQuery包
data1["e"] = 4;
data1["d"][0] = 11;
console.log(data);
console.log(data1);

输出结果:

{a: 1, b: 2, c: 3, d: [0,1,2,3]}
{a: 1, b: 2, c: 3, d: [11,1,2,3], e: 4}

相互没有影响

当对象引用做为函数参数传递时候,依然会相互影响,切记,如下示例:

var data = {a:1,b:2,c:3,d:{q:4,w:5,e:6}};
var data1 = data;
function con(data2){
data2["r"] = 5;
console.log(JSON.stringify(data2));
}
con(data1);
console.log(JSON.stringify(data));

输出结果:

{"a":1,"b":2,"c":3,"d":{"q":4,"w":5,"e":6},"r":5}
{"a":1,"b":2,"c":3,"d":{"q":4,"w":5,"e":6},"r":5}

对象引用赋值后,如果将对象置空,相互间是不受影响的,如下:

var arr = {"a":"1","b":"2"};
var arr1 = arr;
arr = {};
arr["a"] = 2;
console.log(arr1);
console.log(arr);

输出结果:

{"a":"1","b":"2"},{"a":2}

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

Javascript 相关文章推荐
无语,javascript居然支持中文(unicode)编程!
Apr 12 Javascript
js读写cookie实现一个底部广告浮层效果的两种方法
Dec 29 Javascript
js如何判断用户是否是用微信浏览器
Jun 05 Javascript
jQuery+easyui中的combobox实现下拉框特效
Feb 27 Javascript
JavaScript页面模板库handlebars的简单用法
Mar 02 Javascript
jQuery实现标题有打字效果的焦点图代码
Nov 16 Javascript
谈谈js中的prototype及prototype属性解释和常用方法
Nov 25 Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
Sep 01 Javascript
微信小程序  modal弹框组件详解
Oct 27 Javascript
js eval函数使用,js对象和字符串互转实例
Mar 06 Javascript
JavaScript实现的联动菜单特效示例
Jul 08 Javascript
微信小程序实现左侧滑动导航栏
Apr 08 Javascript
jQuery图片瀑布流的简单实现代码
Mar 15 #Javascript
JavaScript关联数组用法分析【概念、定义、遍历】
Mar 15 #Javascript
jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】
Mar 15 #Javascript
js中的触发事件对象event.srcElement与event.target详解
Mar 15 #Javascript
jQuery动态产生select option下拉列表
Mar 15 #Javascript
使用jQuery实现一个类似GridView的编辑,更新,取消和删除的功能
Mar 15 #Javascript
js中获取键盘按下键值event.keyCode、event.charCode和event.which的兼容性详解
Mar 15 #Javascript
You might like
全国FM电台频率大全 - 23 四川省
2020/03/11 无线电
PHP采用自定义函数实现遍历目录下所有文件的方法
2014/08/19 PHP
通过php添加xml文档内容的方法
2015/01/23 PHP
php利用smtp类实现电子邮件发送
2015/10/30 PHP
php实现的错误处理封装类实例
2017/06/20 PHP
利用Homestead快速运行一个Laravel项目的方法详解
2017/11/14 PHP
Convert Seconds To Hours
2007/06/16 Javascript
Javascript 类型转换方法
2010/10/24 Javascript
jquery json 实例代码
2010/12/02 Javascript
Jquery实现视频播放页面的关灯开灯效果
2013/05/27 Javascript
Jquery性能优化详解
2014/05/15 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
2015/03/18 Javascript
JavaScript判断是否为数字的4种方法及效率比较
2015/04/01 Javascript
详细解读Jquery各Ajax函数($.get(),$.post(),$.ajax(),$.getJSON())
2016/08/15 Javascript
json的结构与遍历方法实例分析
2017/04/25 Javascript
移动设备手势事件库Touch.js使用详解
2017/08/18 Javascript
对Vue beforeRouteEnter 的next执行时机详解
2018/08/25 Javascript
vue 监听某个div垂直滚动条下拉到底部的方法
2018/09/15 Javascript
基于vue中keep-alive缓存问题的解决方法
2018/09/21 Javascript
vue动态注册组件实例代码详解
2019/05/30 Javascript
JavaScript中交换值的10种方法总结
2020/08/18 Javascript
python脚本内运行linux命令的方法
2015/07/02 Python
Python使用 Beanstalkd 做异步任务处理的方法
2018/04/24 Python
Python 存储字符串时节省空间的方法
2019/04/23 Python
Python3中函数参数传递方式实例详解
2019/05/05 Python
python中栈的原理及实现方法示例
2019/11/27 Python
python识别验证码图片实例详解
2020/02/17 Python
详解html5页面 rem 布局适配方法
2018/01/12 HTML / CSS
Linux文件操作命令都有哪些
2015/02/27 面试题
外贸员简历中的自我评价
2014/03/04 职场文书
2014年国培研修感言
2014/03/09 职场文书
警示教育活动总结
2014/05/05 职场文书
实习协议书
2015/01/27 职场文书
2015年超市工作总结范文
2015/05/26 职场文书
2015年乡镇纪委工作总结
2015/05/26 职场文书
2015年医院保卫科工作总结
2015/07/23 职场文书