javascript教程之不完整的继承(js原型链)


Posted in Javascript onJanuary 13, 2014

Javascript的继承和标准的oop继承有很大的区别,Javascript的继承是采用原型链的技术,每个类都会将“成员变量”和“成员函数”放到 prototype 上,Js++都过superclass将其链接起来,即 C.prototype.superclass = C.superclass = P.prototype;
当 var c = new C()时,c.__proto__ = C.prototype ;
当 c访问“成员变量”时,如果在__proto__无法获取时,就会到C.prototype查找,如果又不存在,又会到父类的prototype查找,由于只有 __proto__ 是对象创建时分配的(每个对象独立分配),其他都是定义时分配的(每个对象共享),此时,如果访问C.prototype中“成员变量”是对象时,不修改“成员变量”的本身,而是修改“成员变量”对象的成员时,修改的“成员变量”对象的成员就会被所有对象实例共享,这样就违背类设计的初衷。
例如:

'package'.j(function () {
        'class A'.j(function () {
            jpublic({
                v:{a: 1}
            });
            jprivate({
                p:{a:1}
            });
            jprotected({
                x:{a:1}
            });
        });
        'class B extends A'.j(function () {
        });
});
var b1 = new B();
b1.v.a = 5;
b1.x.a = 5;
var b2 = new B();
console.log(b1.v.a) // 输出为 5
console.log(b1.x.a) // 输出为 5
console.log(b2.v.a) // 输出也为 5,并不是预想的 1
console.log(b2.x.a) // 输出为 1
console.log(b2.p.a) // 不可用,会提示 p不存在

如何解决此问题?
A. 将 v 这样的成员“成员变量”(其本身是对象)不在原型链上定义,而是在构造函数中调用,此时,创建对象实例时,就会在对象的__proto__上分配。

Js++提供了类似的方法,只要在jprivate中定义的“成员变量”或“成员函数”都会分配到对象的__proto__上,且只有本实例可用, jprotected中定义的“成员变量”(其本身是对象)也会分配到对象的__proto__上,且只有继承他的可用,

B. 原型链上只定义只读的“成员变量”(其本身是对象)

C.jpublic 定义的“成员变量”(其本身是对象)中的成员,只是只读成员,切记不可赋值,否则会在各个实例中共享。

Javascript 相关文章推荐
Ext中下拉列表ComboBox组件store数据格式用法介绍
Jul 15 Javascript
当鼠标移动时出现特效的JQuery代码
Nov 08 Javascript
$.extend 的一个小问题
Jun 18 Javascript
在Node.js应用中读写Redis数据库的简单方法
Jun 30 Javascript
javascript实现10个球随机运动、碰撞实例详解
Jul 08 Javascript
javascript插件开发的一些感想和心得
Feb 28 Javascript
JavaScript生成.xls文件的代码
Dec 22 Javascript
Vue文件配置全局变量的实例
Sep 06 Javascript
Vue中使用vux配置代码详解
Sep 16 Javascript
JavaScript继承的特性与实践应用深入详解
Dec 30 Javascript
vue router总结 $router和$route及router与 router与route区别
Jul 05 Javascript
JS页面获取 session 值,作用域和闭包学习笔记
Oct 16 Javascript
javascript函数作用域学习示例(js作用域)
Jan 13 #Javascript
多选列表框动态添加,移动,删除,全选等操作的简单实例
Jan 13 #Javascript
鼠标经过tr时,改变tr当前背景颜色
Jan 13 #Javascript
js导航栏单击事件背景变换示例代码
Jan 13 #Javascript
JS文本获得焦点清除文本文字的示例代码
Jan 13 #Javascript
javascript间隔定时器(延时定时器)学习 间隔调用和延时调用
Jan 13 #Javascript
parentElement,srcElement的使用小结
Jan 13 #Javascript
You might like
PHP开发中四种查询返回结果分析
2011/01/02 PHP
解析将多维数组转换为支持curl提交的一维数组格式
2013/07/08 PHP
浅析51个PHP处理字符串的函数
2013/08/02 PHP
PHP Session 变量的使用方法详解与实例代码
2013/09/11 PHP
PHP图片处理之图片旋转和图片翻转实例
2014/11/19 PHP
php文件缓存类汇总
2014/11/21 PHP
PHP从零开始打造自己的MVC框架之入口文件实现方法详解
2019/06/03 PHP
JavaScipt基本教程之JavaScript语言的基础
2008/01/16 Javascript
javascript this用法小结
2008/12/19 Javascript
js弹窗代码 可以指定弹出间隔
2010/07/03 Javascript
jQuery Migrate 1.1.0 Released 注意事项
2014/06/14 Javascript
浅谈JavaScript对象的创建方式
2016/06/13 Javascript
JS 实现可停顿的垂直滚动实例代码
2016/11/23 Javascript
vue双向绑定简要分析
2017/03/23 Javascript
基于JavaScript实现活动倒计时效果
2017/04/20 Javascript
微信小游戏之使用three.js 绘制一个旋转的三角形
2019/06/10 Javascript
jquery ui 实现 tab标签功能示例【测试可用】
2019/07/25 jQuery
解决在Vue中使用axios POST请求变成OPTIONS的问题
2020/08/14 Javascript
python对视频画框标记后保存的方法
2018/12/07 Python
对Python发送带header的http请求方法详解
2019/01/02 Python
Python中format()格式输出全解
2019/04/12 Python
pandas DataFrame的修改方法(值、列、索引)
2019/08/02 Python
python中web框架的自定义创建
2019/09/08 Python
python  ceiling divide 除法向上取整(或小数向上取整)的实例
2019/12/27 Python
完美解决pycharm 不显示代码提示问题
2020/06/02 Python
如何在mac下配置python虚拟环境
2020/07/06 Python
python开发入门——列表生成式
2020/09/03 Python
Python eval函数介绍及用法
2020/11/09 Python
澳大利亚女性快速时尚零售商:Ally Fashion
2018/04/25 全球购物
Theflamel意大利:女士奢华服装、鞋子和配件
2020/01/11 全球购物
年会搞笑主持词串词
2014/03/24 职场文书
公司证明怎么写
2014/09/22 职场文书
python编写函数注意事项总结
2021/03/29 Python
基于Redis延迟队列的实现代码
2021/05/13 Redis
新手入门Mysql--sql执行过程
2021/06/20 MySQL
CSS3实现指纹特效代码
2022/03/17 HTML / CSS