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 相关文章推荐
JS request函数 用来获取url参数
May 17 Javascript
jquery 层次选择器siblings与nextAll的区别介绍
Aug 02 Javascript
举例简介AngularJS的内部语言环境
Jun 17 Javascript
BootStrap Progressbar 实现大文件上传的进度条的实例代码
Jun 27 Javascript
Jquery Easyui进度条组件Progress使用详解(8)
Mar 26 Javascript
Bootstrap Table使用整理(三)
Jun 09 Javascript
微信小程使用swiper组件实现图片轮播切换显示功能【附源码下载】
Dec 12 Javascript
深入理解node.js http模块
Jan 24 Javascript
vue2.0 axios跨域并渲染的问题解决方法
Mar 08 Javascript
Javascript实现异步编程的过程
Jun 18 Javascript
JavaScript的一些小技巧分享
Jan 06 Javascript
通过滑动翻页效果实现和移动端click事件问题
Jan 26 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
如何用PHP实现插入排序?
2013/04/10 PHP
php使用ftp实现文件上传与下载功能
2017/07/21 PHP
用javascript实现计算两个日期的间隔天数
2007/08/14 Javascript
非常不错的功能强大代码简单的管理菜单美化版
2008/07/09 Javascript
jquery获取radio值实例
2014/10/16 Javascript
详解jquery中$.ajax方法提交表单
2014/11/03 Javascript
浅谈JavaScript 框架分类
2014/11/10 Javascript
JavaScript阻止事件冒泡示例分享
2014/12/28 Javascript
jQuery 插件封装的方法
2016/11/16 Javascript
基于cookie实现zTree树刷新后展开状态不变
2017/02/28 Javascript
Bootstrap笔记之缩略图、警告框实例详解
2017/03/09 Javascript
利用ES6实现单例模式及其应用详解
2017/12/09 Javascript
layui获取选中行数据的实例讲解
2018/08/19 Javascript
基于vue-router 多级路由redirect 重定向的问题
2018/09/03 Javascript
Vue form表单动态添加组件实战案例
2019/09/02 Javascript
Vue 的 v-model用法实例
2020/11/23 Vue.js
python备份文件的脚本
2008/08/11 Python
用Python脚本来删除指定容量以上的文件的教程
2015/05/04 Python
python基础教程之分支、循环简单用法
2016/06/16 Python
Python实现单词翻译功能
2017/06/06 Python
python消除序列的重复值并保持顺序不变的实例
2018/11/08 Python
对Python _取log的几种方式小结
2019/07/25 Python
python argparser的具体使用
2019/11/10 Python
Pytorch Tensor基本数学运算详解
2019/12/30 Python
关于Python turtle库使用时坐标的确定方法
2020/03/19 Python
Python爬虫之Selenium实现窗口截图
2020/12/04 Python
AmazeUI 评论列表的实现示例
2020/08/13 HTML / CSS
乌克兰机票、铁路和巴士票、酒店搜索、保险:Tickets.ua
2020/01/11 全球购物
Aosom西班牙:家具在线商店
2020/06/11 全球购物
创建索引时需要注意的事项
2013/05/13 面试题
单位刻章介绍信范文
2014/01/11 职场文书
博士毕业生自我鉴定范文
2014/04/13 职场文书
爱祖国演讲稿
2014/05/04 职场文书
孩子教育的心得体会
2014/09/01 职场文书
副校长个人对照检查材料思想汇报
2014/10/04 职场文书
instantclient客户端 连接oracle数据库
2022/04/26 Oracle