javascript继承扩展类方法实现
javascript没有原生的继承语法,这确实很让人困惑,但是广大人民群从的智慧是无穷的。最近呢,正尝到一点从源码中学习的甜头,不分享一下实在难以平复激动的心情。前不久改造视频播放插件的时候,找到了videojs这个优秀的开源项目。经过一段时间深入学习它的源码,发现它的继承机制写的很好,而且短小精悍,于是决定把它拔离出来,做成一个单独的库,方便以后项目中使用。

//定义一个命名空间
var xut = {}; /**
* Core Object/Class for objects that use inheritance + contstructors
*
* @class
* @constructor
*/
xut.CoreObject = xut['CoreObject'] = function(){}; /**
* Create a new object that inherits from this Object
*
* var Animal = CoreObject.extend();
* var Horse = Animal.extend();
*
* @param {Object} props Functions and properties to be applied to the
* new object's prototype
* @return {xut.CoreObject} An object that inherits from CoreObject
* @this {*}
*/
xut.CoreObject.extend = function(props){
var init, subObj; props = props || {};
// Set up the constructor using the supplied init method
// or using the init of the parent object
// Make sure to check the unobfuscated version for external libs
init = props['init'] || props.init || this.prototype['init'] || this.prototype.init || function(){};
// In Resig's simple class inheritance (previously used) the constructor
// is a function that calls `this.init.apply(arguments)`
// However that would prevent us from using `ParentObject.call(this);`
// in a Child constuctor because the `this` in `this.init`
// would still refer to the Child and cause an inifinite loop.
// We would instead have to do
// `ParentObject.prototype.init.apply(this, argumnents);`
// Bleh. We're not creating a _super() function, so it's good to keep
// the parent constructor reference simple.
subObj = function(){
init.apply(this, arguments);
}; // Inherit from this object's prototype
subObj.prototype = xut.obj.create(this.prototype);
// Reset the constructor property for subObj otherwise
// instances of subObj would have the constructor of the parent Object
subObj.prototype.constructor = subObj; // Make the class extendable
subObj.extend = xut.CoreObject.extend;
// Make a function for creating instances
subObj.create = xut.CoreObject.create; // Extend subObj's prototype with functions and other properties from props
for (var name in props) {
if (props.hasOwnProperty(name)) {
subObj.prototype[name] = props[name];
}
} return subObj;
}; xut.obj = {}; xut.obj.create = Object.create || function(obj){
//Create a new function called 'F' which is just an empty object.
function F() {} //the prototype of the 'F' function should point to the
//parameter of the anonymous function.
F.prototype = obj; //create a new constructor function based off of the 'F' function.
return new F();
}; /**
* Create a new instace of this Object class
*
* var myAnimal = Animal.create();
*
* @return {xut.CoreObject} An instance of a CoreObject subclass
* @this {*}
*/
xut.CoreObject.create = function(){
// Create a new object that inherits from this object's prototype
var inst = xut.obj.create(this.prototype); // Apply this constructor function to the new object
this.apply(inst, arguments); // Return the new object
return inst;
};

项目地址:https://github.com/bjtqti/mini-extend
关于它的使用,我会抽空在git上详细说明,先作一个简单的案例,有兴趣的读者可以自行分析一下它的妙处:

var Animal = xut.CoreObject.extend({
init : function(name){
this.name = name;
}
}); Animal.prototype.getName = function(){
return this.name;
} Animal.prototype.makeSound = function(){
alert('xxx');
} var Bird = Animal.extend(); var Dog = Animal.extend({
makeSound : function(){
alert('wang...')
}
}); var b = new Bird('bage');
var d = new Dog('wang');
d.makeSound() b.makeSound()

子类可以很方便的继承父类的功能,而且子类也可以很自由的修改父类的功能,还不会影响它子类。这对于熟悉php/java等语言的程序员来说,这简直就是废话,但是js用这一百来行的代码实现,做到这种程度,非常的不容易。
javascript继承扩展类方法实现的更多相关文章
- 【读书笔记】javascript 继承
在JavaScript中继承不像C#那么直接,C#中子类继承父类之后马上获得了父类的属性和方法,但JavaScript需要分步进行. 让Brid 继承 Animal,并扩展自己fly的方法. func ...
- javascript 继承、命名空间实现分享
命名空间是用来组织和重用代码的编译单元,在大型项目开发中javascript使用的越来越多时,我们就应该将项目里的js类库管理起来,如何将自己进行归类管理,防止命名冲突,但是Javascript默认不 ...
- Javascript继承之最佳实践
尊重原创,转载请注明出处:http://blog.csdn.net/zoutongyuan 什么是继承? 继承是面向对象最显著的一个特性.继承是从已有的类中派生出新的类,新的类能吸收已有类的数据属性和 ...
- JavaScript继承详解
面向对象与基于对象 在传统面向对象的语言中,有两个非常重要的概念 - 类和实例. 类定义了一类事物公共的行为和方法:而实例则是类的一个具体实现. 我们还知道,面向对象编程有三个重要的概念 - 封装.继 ...
- JavaScript继承详解(五)
在本章中,我们将分析John Resig关于JavaScript继承的一个实现 - Simple JavaScript Inheritance. John Resig作为jQuery的创始人而声名在外 ...
- javascript面向对象之Javascript 继承
转自原文javascript面向对象之Javascript 继承 在JavaScript中实现继承可以有多种方法,下面说两种常见的. 一,call 继承 先定义一个“人”类 //人类 Person=f ...
- JavaScript 继承小记
面向对象编程很重要的一个方面,就是对象的继承.A 对象通过继承 B 对象,就能直接拥有 B 对象的所有属性和方法.这对于代码的复用是非常有用的. 大部分面向对象的编程语言,都是通过“类”(class) ...
- javascript继承的三种模式
javascript继承一般有三种模式:组合继承,原型式继承和寄生式继承: 1组合继承:javascript最为广泛的继承方式通过原型链实现对原型属性和方法的继承,通过构造函数实现对实例属性的继承,同 ...
- javascript继承机制的设计思想(ryf)
我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...
随机推荐
- Android程序启动加载动画实现
package com.example.bmob_test.ui;//程序启动动画,图片颜色由浅到深,方法一 import com.example.bmob_test.LogActivity; imp ...
- HTML前端
1.<html>内容</html> 解释:HTML文档的文档标记,也成为HTML开始标记 功能:这对标记分别位于网页的最前端和最后端 <html>在最前段表示网页的 ...
- 使用twisted.web实现代理服务器
简单的实现谷歌的代理: 架构就是下面这么简单. ================= my server outside GFW | <----------------------> ...
- 代码风格与树形DP
Streaming很惨,不过因为比赛之间没有提交过就没掉(或掉了)rating.第二题是一个树形DP,但是我都在想第一题了,简直作死. 看着神犇的代码我也是醉了...各种宏,真是好好写会死系列. 看到 ...
- 二级域名session 共享方案
二级域名session 共享方案 1.利用COOKIE存放session_id(); 实例: 域名一文件php代码: <?php session_start(); setcookie(&qu ...
- VMware Snapshot 工作原理
VMware中的快照是对VMDK在某个时间点的“拷贝”,这个“拷贝”并不是对VMDK文件的复制,而是保持磁盘文件和系统内存在该时间点的状态,以便在出现故障后虚拟机能够恢复到该时间点.如果对某个虚拟机创 ...
- windows2003批量添加和导出所有ip
批量添加IP 在cmd命令行下运行: FOR /L %i IN (130,1,190) DO netsh interface ip add address "本地连接" 192.1 ...
- 六间房 去掉水印的方法 绕过游客VIP限制
firefox 40 + Adblock Plus 2.6.9.1 + Execute JS 0.2.4.1 Adblock Plus 过滤规则里添加 ------------------------ ...
- 【USACO】clocks 遇到各种问题 最后还是参考别人的思路
//放在USACO上一直通不过 不知道哪里出了问题 输出的n总是等于1 但是BFS递归的次数是对的 <----这个问题解决了 局部变量压入queue中返回就是对的了 #include<io ...
- vector.end() 指向的节点
存储器vector, vector.end() 指向的是最后的结束符,而不是最后一个元素.