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 相关文章推荐
jQuery validate 中文API 附validate.js中文api手册
Jul 31 Javascript
利用js实现前台动态添加文本框,后台获取文本框内容(示例代码)
Nov 25 Javascript
jquery+json实现分页效果
Mar 07 Javascript
node.js 核心http模块,起一个服务器,返回一个页面的实例
Sep 11 Javascript
详解vue 实例方法和数据
Oct 23 Javascript
解决vue-cli单页面手机应用input点击手机端虚拟键盘弹出盖住input问题
Aug 25 Javascript
jQuery实现的淡入淡出图片轮播效果示例
Aug 29 jQuery
微信小程序实现banner图轮播效果
Jun 28 Javascript
浅谈react-router@4.0 使用方法和源码分析
Jun 04 Javascript
layui写后台表格思路和赋值用法详解
Nov 14 Javascript
vue+canvas实现拼图小游戏
Sep 18 Javascript
vue-router懒加载的3种方式汇总
Feb 28 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
dedecms系统的广告设置代码 基础版本
2010/04/09 PHP
php连接mssql的一些相关经验及注意事项
2013/02/05 PHP
使用PHP获取汉字的拼音(全部与首字母)
2013/06/27 PHP
php生成固定长度纯数字编码的方法
2015/07/09 PHP
PHP代码实现表单数据验证类
2015/07/28 PHP
Laravel5.1数据库连接、创建数据库、创建model及创建控制器的方法
2016/03/29 PHP
laravel中短信发送验证码的实现方法
2018/04/25 PHP
在laravel中实现ORM模型使用第二个数据库设置
2019/10/24 PHP
php实现根据身份证获取精准年龄
2020/02/26 PHP
cloudgamer出品ImageZoom 图片放大效果
2010/04/01 Javascript
各种常用的JS函数整理
2013/10/25 Javascript
对之前写的jquery分页做下升级
2014/06/19 Javascript
JQuery中使用.each()遍历元素学习笔记
2014/11/08 Javascript
使用jQueryMobile实现滑动翻页效果的方法
2015/02/04 Javascript
分享经典的JavaScript开发技巧
2015/11/21 Javascript
canvas时钟效果
2017/02/16 Javascript
解决百度Echarts图表坐标轴越界的方法
2018/10/17 Javascript
Vue触发式全局组件构建的方法
2018/11/28 Javascript
基于Proxy的小程序状态管理实现
2019/06/14 Javascript
vue实现评论列表功能
2019/10/25 Javascript
vue实现两个组件之间数据共享和修改操作
2020/11/12 Javascript
Python编程中实现迭代器的一些技巧小结
2016/06/21 Python
python使用itchat库实现微信机器人(好友聊天、群聊天)
2018/01/04 Python
解决pandas中读取中文名称的csv文件报错的问题
2018/07/04 Python
Python实现Event回调机制的方法
2019/02/13 Python
python手写均值滤波
2020/02/19 Python
Python3.7将普通图片(png)转换为SVG图片格式(网站logo图标)动起来
2020/04/21 Python
学会python自动收发邮件 代替你问候女友
2020/05/20 Python
用Python实现童年贪吃蛇小游戏功能的实例代码
2020/12/07 Python
关于HTML5你必须知道的28个新特性,新技巧以及新技术
2012/05/28 HTML / CSS
俄罗斯化妆品和香水网上商店:Iledebeaute
2019/01/03 全球购物
伊莱克斯阿根廷网上商店:Tienda Electrolux
2021/03/08 全球购物
2014年党务公开实施方案
2014/02/27 职场文书
外国人聘用意向书
2014/04/01 职场文书
工作保证书怎么写
2015/02/28 职场文书
阿里云ECS云服务器快照的概念以及如何使用
2022/04/21 Servers