Javascript面象对象成员、共享成员变量实验


Posted in Javascript onNovember 19, 2010

1)Javascript对象成员实验:

var f = function d() { 
this.a = "a";/*这句运行后不存在f.a也不存在d.a存在一个window.a*/ 
var b = "b";/*局部变量*/ 
}; 
var o = { ff: function () { 
var a = "a"; /*局部变量*/ 
this.b = "b"; /*这句运行后存在o.b*/ 
} 
}; 
function Man(){ 
this.age = 30; 
}; 
Man.prototype.sex = 1; 
Man.prototype.name = function () { 
}; 
debugger;/*第一处断点*/ 
f(); 
o.ff(); 
var m = new Man(); 
debugger; /*第二处断点*/

第一处断点时对象成员的存在情况:

Javascript面象对象成员、共享成员变量实验

第二处断点时对象成员的存在情况:

Javascript面象对象成员、共享成员变量实验

一句话:关于js函数:this指的是所在函数外最近一层的对象,而嵌套函数的内部函数内的this指的是window对象。

一句话:js的oo特性:使用this.成员方式定义对象的成员使用对象具有js特有的动态持性,类与对象实例有差异的,而.prototype.成员定义成员是经典的定义方式,类与对象实例是统一的。
2)Javascript对象共享性成员变量实验:

function Ghost(_name) { 
this.name = _name; 
this.age = 1000; 
} 
Ghost.prototype.setName = function (_name) { 
this.name = _name; 
} 
function Man(_name){ 
this.age = 30; 
this.ghost = new Ghost("实例变量" + _name); 
}; 
Man.prototype.ManGhost = new Ghost("共享变量"); 
var a = new Man("a"); 
var b = new Man("b"); 
var amg = a.ManGhost.setName("我只设置a的共享变量"); 
debugger; /*第一处断点*/ 
var ag = a.ghost; 
var bg = b.ghost; 
var bmg = b.ManGhost; 
debugger; /*第二处断点*/

运行到第一片断点:

Javascript面象对象成员、共享成员变量实验

简单变量与对象变量的差别

使用.prototype.定义的成员,如果该成员为简单变量则,每个对象实例都有一个各自的副本。(例如:Man.prototype.noObejctVar)

使用.prototype.定义的成员,如果该成员对象变量,则每个对象实例都共享同一个对象副本。(例如:Man.prototype.ManGhost)

为什么有这样的差别呢?单从ManGhost变量与noObjectVar变量它们都是使用.prototype.定义的成员是没有差别的,只是它们类型不同,表示它们访问和使用用它们的方式是不同的,只是ManGhost变量内存放的是new出来的对象,而noObjectVar变量内存放的是值(或某种值的引用),换句话说ManGhost存放的是对象的引用,通过这个引用可以操作这个对象,noObjectVar变量内存放也可是某种值引用,可是无法使用这个引用来操作它.

从另一个视角看

noObjectVar变量存放的是字串对象的引用.

a.noObjectVar="新字符串a";

这表示noObjectVar从原来的存放字符串对象引用,指向新字符串对象引用.(也可以说新的字符串对象覆盖原字符串对象)

a.ManGhost=new Ghost("a");

b.ManGhost=new Ghost("b");

这样a与b就不存在共享对象的问题了.不过这样就存在另一个问题.prototype.ManGhost时定义新建的对象就浪费了.不过这样使用.prototype.是错误的.

使用.prototype.定义成员函数及定义共享变量才是正确的用法.

使用javascript来正确的定义类请见:[技术备忘录]javascript来定义类的规范

Javascript 相关文章推荐
JavaScript中的History历史对象
Jan 16 Javascript
jCallout 轻松实现气泡提示功能
Sep 22 Javascript
javascript实现漂亮的拖动层,窗口拖拽特效
Apr 24 Javascript
学习Bootstrap组件之下拉菜单
Jul 28 Javascript
jQuery ui实现动感的圆角渐变网站导航菜单效果代码
Aug 26 Javascript
jQuery ajax全局函数处理session过期后的ajax跳转问题
Jun 03 Javascript
JS判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)
Aug 02 Javascript
Vue结合SignalR实现前后端实时消息同步
Sep 19 Javascript
js实现轮播图的完整代码
Oct 26 Javascript
React 项目迁移 Webpack Babel7的实现
Sep 12 Javascript
vue使用微信扫一扫功能的实现代码
Apr 11 Javascript
微信小程序基于高德地图API实现天气组件(动态效果)
Oct 22 Javascript
js 创建快捷方式的代码(fso)
Nov 19 #Javascript
javascript 函数参数限制说明
Nov 19 #Javascript
Javascript的并行运算实现代码
Nov 19 #Javascript
js里的prototype使用示例
Nov 19 #Javascript
Google 静态地图API实现代码
Nov 19 #Javascript
javascript 窗口加载蒙板 内嵌网页内容
Nov 19 #Javascript
JS运行耗时操作的延时显示方法
Nov 19 #Javascript
You might like
杏林同学录(八)
2006/10/09 PHP
php无限极分类递归排序实现方法
2014/11/11 PHP
PHP如何通过AJAX方式实现登录功能
2015/11/23 PHP
thinkPHP框架对接支付宝即时到账接口回调操作示例
2016/11/14 PHP
PHP+jQuery实现滚屏无刷新动态加载数据功能详解
2017/05/04 PHP
javascript AOP 实现ajax回调函数使用比较方便
2010/11/20 Javascript
javascript禁用Tab键脚本实例
2013/11/22 Javascript
Bootstrap网格系统详解
2016/04/26 Javascript
bootstrap监听滚动实现头部跟随滚动
2016/11/08 Javascript
canvas实现图像布局填充功能
2017/02/06 Javascript
jQuery插件FusionCharts实现的MSBar2D图效果示例【附demo源码】
2017/03/24 jQuery
JavaScript实用代码小技巧
2018/08/23 Javascript
微信小程序中遇到的iOS兼容性问题小结
2018/11/14 Javascript
JavaScript 实现HTML DOM增删改查操作的常见方法详解
2020/01/04 Javascript
openlayers4实现点动态扩散
2020/08/17 Javascript
jQuery实现动态加载瀑布流
2020/09/01 jQuery
ant design vue中日期选择框混合时间选择器的用法说明
2020/10/27 Javascript
适用于 Vue 的播放器组件Vue-Video-Player操作
2020/11/16 Javascript
[49:18]2018DOTA2亚洲邀请赛 3.31 小组赛 A组 OG vs TNC
2018/04/01 DOTA
[01:28:24]NAVI vs VG Supermajor 败者组 BO3 第三场 6.5
2018/06/06 DOTA
Python 多线程抓取图片效率对比
2016/02/27 Python
python opencv 直方图反向投影的方法
2018/02/24 Python
Python3.6简单的操作Mysql数据库的三个实例
2018/10/17 Python
Pycharm设置utf-8自动显示方法
2019/01/17 Python
Python 的字典(Dict)是如何存储的
2019/07/05 Python
浅谈tensorflow中dataset.shuffle和dataset.batch dataset.repeat注意点
2020/06/08 Python
python向xls写入数据(包括合并,边框,对齐,列宽)
2021/02/02 Python
CSS3 3D位移translate效果实例介绍
2016/05/03 HTML / CSS
用html5实现语音搜索框的方法
2014/03/18 HTML / CSS
详解html5 postMessage解决跨域通信的问题
2018/08/17 HTML / CSS
意大利辅助药品、药物和补品在线销售:FarmaEurope
2020/04/29 全球购物
口腔医学技术应届生求职信
2013/11/09 职场文书
刑事辩护词范文
2015/05/21 职场文书
2015年社区重阳节活动总结
2015/07/30 职场文书
2015元旦感言
2015/12/09 职场文书
详细介绍MySQL中limit和offset的用法
2022/05/06 MySQL