JS模拟面向对象全解(一、类型及传递)


Posted in Javascript onJuly 13, 2011

可是,没有类,何来面向对象一说?没有关系,可以模拟。而且这一套方法已经成为公认的JS实现面向对象的方法。
另外,JS内的东西完全开发,也就不存在成员的什么private、protected作用域。
下面切入正题。

一、类型

//从基础开始,省的后面看着吃力

1、类型的区别
基本数据类型和对象类型不是一回事。
a、基本类型只是一个值,没有任何行为;而对象类型有自己的行为。
b、基本类型是值类型,仅表示一个值;对象类型则拥有许多复杂的东西。
c、基本类型传递时传值,对象类型传递时传址。
另外,文本非常特殊,JS里面有两种文本类型——一种基本数据类型,一种对象类型。 举个例子:
var str="The End";//这样是基本数据类型,传递方式就是传值
var str2=new string("The End");//这就不同,有了new这个为对象开辟内存空间的标识符,对应的变量就会成为对象类型,传递时即传址
简单点说: a、直接用字面量赋值的变量,如var a=1;var b="a";var c=true;,都是基本数据类型(常用的有:数值、文本、布尔)
b、用new赋值的变量,如var a=new Object();var b=new string();,都是对象类型(JS有许多对象,算是精简的面向对象语言) 请注意:基本数据类型也可以new,但是很少有那种用法。因此上述区分办法不完全适用所有情况,请加以自行判断。

2、参数传递方式 这一节主要来区分传址、传值。 仍然拿例子来说事:

function changeVar(varible){ 

varible=5; 


alert(varible);//提示5 
} 
var a=3; 
alert(a);//提示3 
changeVar(a);//该函数内部有改变参数的代码 alert(a);//仍然提示3

根据上例可以发现,函数虽然改变了参数,但是并没有改变参数所代表的传递过去变量。这是传值。在调用changeVar时,JS重新拷贝了一份你传递的变量作为参数,所以,在changeVar内部操作的参数实际上是你传递的变量的副本,而非本身。 传递的其实是变量的值,而非变量本身。这叫做传值。
function changeVar(varible){ 

varible.x=5; 


alert(varible.x);//提示5 
} 
var a=new Object; 
a.x=3 alert(a.x);//提示3 
changeVar(a);//该函数内部有改变参数的代码 
alert(a.x);//提示5

上例改成使用Object对象了。发现,changeVar之后,原来的变量的对应属性也发生改变,函数内部就是操作的传递的变量本身。 传址就是这个道理,把你给定的变量的内存地址传递过去,函数内部改变的其实就是你传递的变量。因为操作的都是在统一内存地址的东西。

但是,一定注意这个“但是”!JS的传址还是有些特别之处! JS在传递对象类型时,大概也拷贝了一份相应类型的对象,但是副本对象的所有属性、函数都是原对象的属性、函数。 也许就是,属性传址而对象不传址。 这个特点可以证明。 代码如下:

function changeVar(varible){ 

varible=new Object(); 


varible.x=5; 


alert(varible.x);//提示5 
} 
var a=new Object; 
a.x=3 alert(a.x);//提示3 
changeVar(a);//该函数内部有改变参数的代码 
alert(a.x);//提示3

当你改变了参数代表的对象时,并未改变的了你传递的变量代表的对象。但前面说过,可以通过函数内对参数对象的属性操作改变原变量代表对象的属性。这结合起来就可以证明,JS在传递对象类型时,也拷贝了一份相应类型的对象,但是副本对象的所有属性、函数都是原对象的属性、函数。
Javascript 相关文章推荐
js定时调用方法成功后并停止调用示例
Apr 08 Javascript
利用JavaScript脚本实现滚屏效果的方法
Jul 07 Javascript
JavaScript脚本判断蜘蛛来源的方法
Sep 22 Javascript
详解Bootstrap的aria-label和aria-labelledby应用
Jan 04 Javascript
Vue.js快速入门教程
Sep 07 Javascript
node.js中express中间件body-parser的介绍与用法详解
May 23 Javascript
理解 javascript 中的函数表达式与函数声明
Jul 07 Javascript
JavaScript数据结构之单链表和循环链表
Nov 28 Javascript
解决Layui数据表格的宽高问题
Sep 28 Javascript
十分钟教你上手ES2020新特性
Feb 12 Javascript
canvas实现贪食蛇的实践
Feb 15 Javascript
JS前端使用Canvas快速实现手势解锁特效
Sep 23 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
一款Jquery 分页插件的改造方法(服务器端分页)
Jul 11 #Javascript
You might like
如何实现给定日期的若干天以后的日期
2006/10/09 PHP
一步一步学习PHP(5) 类和对象
2010/02/16 PHP
优化WordPress的Google字体以加速国内服务器上的运行
2015/11/24 PHP
PHP5.6读写excel表格文件操作示例
2019/02/26 PHP
Jquery知识点二 jquery下对数组的操作
2011/01/15 Javascript
基于jquery实现控制经纬度显示地图与卫星
2013/05/20 Javascript
jquery控制背景音乐开关与自动播放提示音的方法
2015/02/06 Javascript
JS实现超过长度限制后自动跳转下一款文本框的方法
2015/02/23 Javascript
AngularJS中的Directive实现延迟加载
2016/01/25 Javascript
原生javascript实现匀速运动动画效果
2016/02/26 Javascript
微信小程序 http请求的session管理
2017/06/07 Javascript
Vue中定义全局变量与常量的各种方式详解
2017/08/23 Javascript
Vuex实现简单购物车
2021/01/10 Vue.js
[02:39]DOTA2英雄基础教程 天怒法师
2013/11/29 DOTA
python模块之StringIO使用示例
2015/04/08 Python
python 打印直角三角形,等边三角形,菱形,正方形的代码
2017/11/21 Python
Python实现字典排序、按照list中字典的某个key排序的方法示例
2018/12/18 Python
Python 硬币兑换问题
2019/07/29 Python
简单了解pytest测试框架setup和tearDown
2020/04/14 Python
python 如何读、写、解析CSV文件
2021/03/03 Python
8款精美的CSS3表单设计(登录表单/下拉选择/按钮附演示及源码)
2013/02/04 HTML / CSS
websocket+sockjs+stompjs详解及实例代码
2018/11/30 HTML / CSS
学校安全工作制度
2014/01/19 职场文书
十八届三中全会报告学习材料
2014/02/17 职场文书
警校毕业生自我评价
2014/04/06 职场文书
小班下学期评语
2014/05/04 职场文书
金融保险专业求职信
2014/09/03 职场文书
销售员工作检讨书(推荐篇)
2014/10/18 职场文书
婚宴邀请函
2015/01/30 职场文书
匿名检举信范文
2015/03/02 职场文书
党支部对转正的意见
2015/06/02 职场文书
地震捐款简报
2015/07/21 职场文书
生活委员竞选稿
2015/11/21 职场文书
素质教育培训心得体会
2016/01/19 职场文书
银行工作心得体会范文
2016/01/23 职场文书
Python数据可视化之基于pyecharts实现的地理图表的绘制
2021/06/10 Python