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 相关文章推荐
js资料prototype 属性
Mar 13 Javascript
js鼠标左右键 键盘值小结
Jun 11 Javascript
JavaScript高级程序设计(第3版)学习笔记2 js基础语法
Oct 11 Javascript
jQuery插件fullPage.js实现全屏滚动效果
Dec 02 Javascript
详解如何在vue中使用sass
Jun 21 Javascript
es7学习教程之fetch解决异步嵌套问题的方法示例
Jul 21 Javascript
详解react-router 4.0 下服务器如何配合BrowserRouter
Dec 29 Javascript
jquery实现联想词搜索框和搜索结果分页的示例
Oct 10 jQuery
vue 内置过滤器的使用总结(附加自定义过滤器)
Dec 11 Javascript
Vue-cli3.x + axios 跨域方案踩坑指北
Jul 04 Javascript
javascript简单实现深浅拷贝过程详解
Oct 08 Javascript
vue中使用mockjs配置和使用方式
Apr 06 Vue.js
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
PHP下对数组进行排序的函数
2010/08/08 PHP
php中获取关键词及所属来源搜索引擎名称的代码
2011/02/15 PHP
php自动加载代码实例详解
2021/02/26 PHP
JavaScript 应用技巧集合[推荐]
2009/08/30 Javascript
Jquery 高亮显示文本中重要的关键字
2009/12/24 Javascript
JavaScript学习笔记(二) js对象
2011/10/25 Javascript
如何在父窗口中得知window.open()出的子窗口关闭事件
2013/10/15 Javascript
javascript客户端遍历控件与获取父容器对象示例代码
2014/01/06 Javascript
JavaScript生成随机字符串的方法
2015/03/19 Javascript
详解Vue.js动态绑定class
2016/12/20 Javascript
BootStrap3使用错误记录及解决办法
2016/12/22 Javascript
详解基于angular路由的requireJs按需加载js
2017/01/20 Javascript
webpack学习笔记之代码分割和按需加载的实例详解
2017/07/20 Javascript
vue 使用ref 让父组件调用子组件的方法
2018/02/08 Javascript
vue中如何实现pdf文件预览的方法
2018/07/12 Javascript
vue.js配合$.post从后台获取数据简单demo分享
2018/08/11 Javascript
详解vuex的简单todolist例子
2019/07/14 Javascript
如何解决vue在ios微信"复制链接"功能问题
2020/03/26 Javascript
JavaScript交换变量常用4种方法解析
2020/09/02 Javascript
[01:21]辉夜杯战队访谈宣传片—CDEC
2015/12/25 DOTA
python实现根据图标提取分类应用程序实例
2014/09/28 Python
在python3中pyqt5和mayavi不兼容问题的解决方法
2019/01/08 Python
pandas读取CSV文件时查看修改各列的数据类型格式
2019/07/07 Python
彻底搞懂python 迭代器和生成器
2020/09/07 Python
Python存储读取HDF5文件代码解析
2020/11/25 Python
python中pdb模块实例用法
2021/01/15 Python
德国BA保镖药房中文网:Bodyguard Apotheke
2021/03/09 全球购物
英语演讲稿范文
2014/01/03 职场文书
微博营销计划书
2014/01/10 职场文书
创先争优个人承诺书
2014/08/30 职场文书
工作经历证明书范文
2014/11/02 职场文书
2016年大学迎新晚会工作总结
2015/10/15 职场文书
Python如何使用logging为Flask增加logid
2021/03/30 Python
python 自动化偷懒的四个实用操作
2021/04/11 Python
MySQL 存储过程的优缺点分析
2021/05/20 MySQL
html,css,javascript是怎样变成页面的
2023/05/07 HTML / CSS