JS模拟面向对象全解(二、类型与赋值)


Posted in Javascript onJuly 13, 2011

类型赋值类似变量传递的问题。
基本数据类型不必说,传值的。

var a=5; 
var b=a; 
b=3; 
alert(a);//提示5 
alert(b);//提示3

由此观之,发现改变b不会改变a,因为都是变量的值在来回传递,和变量本身没有关系。
对象类型,传址的。
var a=new Object(); 
a.x=5; 
var b=a; 
b.x=3; 
alert(a.x);//提示3 
alert(b.x);//提示3

这样,由于传址,所以b即是a,a即是b,互相改变。
如若还不清楚,再举个例子:
var a=new Object(); 
a.x=5; 
var b=a; 
alert(b.x);//提示5,b.x即a.x,都是5 
a.x=3;//改a.x即改b.x,都是3了 
alert(a.x);//提示3 
alert(b.x);//提示3

不过,对象类型的属性互相赋值,就与对象类型没关系了,就和其属性的类型有关系。
属性是基本数据类型则传值,属性是对象类型则传址。举个例子吧,简单点:
var a=new Object(); 
a.x=5; var b=new Object(); 
b.x=a.x; b.x=3; 
alert(a.x);//提示5 
alert(b.x);//提示3

上面来回赋值的不过是两个不同对象的属性,都是互相孤立的,也都是基本数据类型,因此只是互相传值,不会互相影响。
var a=new Object(); 
a.x=5; 
var b=a.x; 
b=3; 
alert(a.x);/提示/5 
alert(b);//提示3

这也是一样,b这个基本数据类型与a的基本数据类型的属性x相互赋值,同样不会互相影响,只是互相传值。
可是,对象的属性如果也是对象类型,那就也是传址了。
var a=new Object(); 
a.x=new Object; 
a.x.n=5; 
var b=a.x; 
alert(b.n);//提示5 
b.n=3;//也就改了a.x的n 
alert(a.x.n);//提示3 
alert(b.n);//提示3

a对象的属性x,被定义为一个Object对象类型。因此b赋值为a.x时,他们就是互通的了,其实就是同一个了,可以互相影响、改变。
————
可是,如果我想让对象类型变量赋值时,只是拷贝属性,而不是达到“你就是我,我就是你”的境界、“同生共死”的高尚品格。怎么办?
木有什么特别好的办法,用下面这个函数吧。
var DeepCopy = function(destination, source) 
{ 
for (var property in source) 
{ 
var copy = source[property]; 
if ( destination === copy ) continue; 
if ( typeof copy === "object" ) 



{ 
destination[property] = DeepCopy(destination[property] || {}, copy); 
  } 



 else 



 { 

 destination[property] = copy; 

 } 
} 
return destination; 
}

用法
var a=new Object; 
a.x=5; 
a.y=3; 
var b=new Object; 
DeepCopy(b,a); 
alert(b.x);//提示5 
alert(b.y);//提示3 
b.x=8; 
alert(a.x);//提示5

看,修改了b.x却不能影响a.x了吧?
这个DeepCopy是个不错的函数。
上面实现了对象类型的模拟“传值”
那么怎么做才能模拟基本数据类型的“传址”?
就是用Array对象。
function change(a) 
{ 
a[0]=5; 
alert(a);//提示5 
} 
var x=[3]; 
alert(x);//提示3 
change(x); 
alert(x);//提示5

赋值为一个[xx],其实就是赋值为一个有数据的Array对象。这里就是利用含有一个元素的数组来模拟传址。因为数组是对象类型,传递时传址。
当然,你也可以用任意对象类型的属性来模拟。
Javascript 相关文章推荐
你可能不再需要JQUERY
Mar 09 Javascript
jQuery中数据缓存$.data的用法及源码完全解析
Apr 29 Javascript
CSS3 media queries结合jQuery实现响应式导航
Sep 30 Javascript
一篇看懂vuejs的状态管理神器 vuex状态管理模式
Apr 20 Javascript
详解axios 全攻略之基本介绍与使用(GET 与 POST)
Sep 15 Javascript
微信小程序loading组件显示载入动画用法示例【附源码下载】
Dec 09 Javascript
JavaScript+H5实现微信摇一摇功能
May 23 Javascript
详解Vue单元测试case写法
May 24 Javascript
vue轻量级框架无法获取到vue对象解决方法
May 12 Javascript
js实现鼠标滑动到某个div禁止滚动
Sep 17 Javascript
基于Cesium绘制抛物弧线
Nov 18 Javascript
vuex的使用步骤
Jan 06 Vue.js
JS模拟面向对象全解(一、类型及传递)
Jul 13 #Javascript
一些实用的jQuery代码片段收集
Jul 12 #Javascript
formValidator3.3的ajaxValidator一些异常分析
Jul 12 #Javascript
在IE浏览器中resize事件执行多次的解决方法
Jul 12 #Javascript
JQuery获取当前屏幕的高度宽度的实现代码
Jul 12 #Javascript
Jquery进度条插件 Progress Bar小问题解决
Jul 12 #Javascript
遨游,飞飞,IE,空中网 浏览器无提示关闭方法
Jul 11 #Javascript
You might like
php中操作memcached缓存进行增删改查数据的实现代码
2014/08/15 PHP
php使用CURL伪造IP和来源实例详解
2015/01/15 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
浅谈PHP中其他类型转化为Bool类型
2016/03/28 PHP
PHP实现可自定义样式的分页类
2016/03/29 PHP
PHP实现的简单对称加密与解密方法实例小结
2017/08/28 PHP
总结PHP内存释放以及垃圾回收
2018/03/29 PHP
SyntaxHighlighter代码加色使用方法
2008/09/07 Javascript
下载文件个别浏览器文件名乱码解决办法
2013/03/19 Javascript
jquery移动listbox的值原理及代码
2013/05/03 Javascript
解析javascript 数组以及json元素的添加删除
2013/06/26 Javascript
JS仿百度搜索自动提示框匹配查询功能
2013/11/21 Javascript
浅谈js中变量初始化
2015/02/03 Javascript
JavaScript操作Cookie详解
2015/02/28 Javascript
JS实现上下左右对称的九九乘法表
2016/02/22 Javascript
引用jquery框架后出错的解决方法
2016/08/09 Javascript
vue展示dicom文件医疗系统的实现代码
2018/08/27 Javascript
手把手教你 CKEDITOR 4 实现Dialog 内嵌 IFrame操作详解
2019/06/18 Javascript
vue form表单post请求结合Servlet实现文件上传功能
2021/01/22 Vue.js
[57:53]Secret vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
Python+树莓派+YOLO打造一款人工智能照相机
2018/01/02 Python
解决Shell执行python文件,传参空格引起的问题
2018/10/30 Python
python hbase读取数据发送kafka的方法
2018/12/27 Python
python Matplotlib底图中鼠标滑过显示隐藏内容的实例代码
2019/07/31 Python
python数据处理之如何选取csv文件中某几行的数据
2019/09/02 Python
Python3+Selenium+Chrome实现自动填写WPS表单
2020/02/12 Python
html5利用canvas实现颜色容差抠图功能
2019/12/23 HTML / CSS
工作自荐信
2013/12/11 职场文书
小学门卫岗位职责
2013/12/17 职场文书
关于是否需要写商业计划书
2014/02/07 职场文书
个人考核材料
2014/05/15 职场文书
2014年项目工作总结
2014/11/24 职场文书
质量整改通知单
2015/04/21 职场文书
欠款纠纷起诉状
2015/05/19 职场文书
初中家长意见
2015/06/03 职场文书
Go语言测试库testify使用学习
2022/07/23 Golang