JavaScript-关于javascript如何实现类的继承

Question

不知道有没那些同志在前端的设计中用到了js的类继承
由于本人在前端编程方面都是中规中矩
不太明白js的类继承如何实现，那位技术大侠能分享一个您开发中用到的类继承实例

Answer 1

我这里举一个最简单的JavaScript继承

 var father=function(){
this.a="属性1"
};

var child = new father();

child.b="属性2";
child.func=function(){

}
//子对象具有父对象的属性
alert(child.a);

例子

Answer 2

这个例子应该可以说明你的疑问：

<script type="text/javascript">
function Person() {
// 属性
this.Gender = "female";
this.Age = 18;
this.Words = "Silence";
// 方法
this.shouting = function() {
alert("开心哦！父类的方法");
}
}
// 继承
function Programmer() {
this.base = Person;
}
Programmer.prototype = new Person;
// 为子类添加新的方法
Programmer.prototype.typeCode = function() {
alert("俺是敲代码的！IT民工，很不开心。子类的方法");
}
// 调用示例
function sayHello() {
var a = new Programmer();
alert(a.Gender); // 调用父类的属性
a.shouting(); // 调用父类的方法
a.typeCode(); // 调用子类的方法
}
sayHello();
</script>

Answer 3

首先定义类对象，然后扩展继承、实例化。

//定义类
(function(){
var Class = {
//扩展类
create: function(aBaseClass, aClassDefine){
var $class = function(){
for(var member in aClassDefine){
this[member] = aClassDefine[member];
}
if('undefined'===typeof aClassDefine.initialize){
this.initialize = function(){};
}
};
if('function' ===typeof aBaseClass){
$class.prototype = new aBaseClass();
}else if('object' ===typeof aBaseClass){
$class.prototype = aBaseClass;
}
return $class;
},
//实例化类
new: function(jclass,args){
var jclass = new jclass();
if(jclass.initialize){
jclass.initialize.apply(jclass, args);
}
return jclass;
}
};

//export
window.Class = Class;
})();

//示例

//基类对象或函数
var obj = {
name: 'BaseName',
init: function(){
//...
},
//...
};

var fun = function(){
this.name = '';
var init = function(){
//.. .
};
var getName = function(){
return this.name;
},
var setName = function(name){
this.name = name;
return this;//链式操作支持
},
//...
};

//从Object继承
var class_frome_obj = Class.create(obj,{
initialize: function(){
//构造函数
},
getName: function(){
return this.name;
},
setName: function(name){
this.name = name;
return this;//链式操作支持
},
//...

});
//从Function继承
var class_frome_fun = Class.create(fun,{
initialize: function(){
//构造函数
},
//...

});
//从空对生成基类
var class_frome_base = Class.create({},{
initialize: function(){
//构造函数
},
//...

});
//实例化
var get_class_frome_obj = Class.new(class_frome_obj,[arg1,arg2,...]);
var get_class_frome_fun = Class.new(class_frome_fun,[arg1,arg2,...]);

var name1 = get_class_frome_obj.getName();
//console.log(name1);//BaseName
var name2 = get_class_frome_obj.setName('NewName').getName();

Answer 4

以前看过一篇文章：javascript实现类、继承、多态（原创）

Answer 5

javascript 由原型链作为实现继承的主要方法，在js中的继承方式有很多种：

1 组合继承

 function sub() {
parent.call(this) //继承父类的属性
}

sub.prototype = new parent(); //继承父类的方法

2 原型式继承

 function object(0) {
function F(){}
F.prototype = o;
return new F();
}
var parent = {};
var sub = object(parent);

3 寄生式继承
4 寄生组合式继承

我就不一一给出代码，有兴趣可以找找相关资料。推荐你一本书《javascript高级程序设计》

Answer 6

可以采用Klass，An expressive, cross platform JavaScript Class provider with a classical interface to prototypal inheritance.

 var Person = klass(function (name) {
this.name = name
})
.statics({
head: ':)',
feet: '_|_'
})
.methods({
walk: function () {}
})

资料资料：JS类继承模型 Klass
另外可参考：javascript类继承模型