JavaScript
发布时间：2022-04-16 发布网站：大佬教程 code.js-code.com
大佬教程收集整理的这篇文章主要介绍了javascript关于继承的用法汇总，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
本文实例汇总了javascript关于继承的用法。分享给大家供大家参考。具体如下：
例子：
**
* 实现子类继承父类,但不会产生多余的属性和方法
* @returns
{Function}
*/
define(function()
{
return function(subType,superTyp
E){
var proto = new Ob
ject(superType.prototyp
E);
proto.constructor = subType;
subType.prototype = proto;
};
}
);
//——————————————————————————
define(function()
{
function o
String(s)
{
thi
s.str = s;
thi
s.length = thi
s.str.length;
}
o
String.prototype.show = function()
{
alert(thi
s.str
);
};
return o
String;
}
);
//——————————————————————————
define(['inherit','o
String'],function(inherit,o
String)
{
function w
String(s)
{
//用call实现调用父类构造函数
o
String.call(this,s
);
thi
s.chlength = 2 *
s.length;
}
//继承其他的属性
inherit(w
String,o
String
);
w
String.prototype.add = function(w)
{
alert(thi
s.str + w
);
};
return w
String;
}
);再看例子
一、用function实现：
Name)
{
thi
s.name = name;
}
Person.prototype.getName = function()
{
return thi
s.name;
}
function Author(name,books)
{
thi
s.inherit=person;
thi
s.inherit(
Name);
this
.books = books;
}
var au=new Author("dororo","Learn much");
au.name
或者同等效力的：
<div class="code
title">
<a style="cursOR: pointer" data="50954" class="copybut" id="copybut50954" onclick="doCopy('code50954')"> 代码如下: <div class="codebody" id="code50954">function Person(
Name) {
thi
s.name = name;
}
Person.prototype.getName = function()
{
return thi
s.name;
}
function Author(name,books)
{
Person.call(this,
Name);
this
.books = books;
}
var au=new Author("dororo","Learn much");
au.getName
由于这只是将this作为参数，调用父类Person的构造函数，把赋予父类的所有域赋予Author子类，所以任何父类Person构造函数之外的定义的域（原型prototype），子类都不会继承。所以上面例子中，au.getName将是没有被定义的（undefined），因为getName是在Person的原型对象中定义的。
而且，子类的构造函数要在定义自己的域之前调用父类构造函数，免得子类的定义被父类覆盖掉。也就是说，Author定义属性book要在Person.call之后，否则会被Person中属性覆盖。同时，在子类中也最好不要用prototype来定义子类的函数域，因为在一个子类被new，实例化之后就要执行prototype，然后才是调用父类的构造函数，这样也容易被父类的属性覆盖掉。
二、用prototype实现：
Name)
{
thi
s.name = name;
}
Person.prototype.getName = function()
{
return thi
s.name;
}
function Author(name,books)
{
this
.books = books;
}
Author.prototype=new Person(
Name);
Author.prototype.constructor=Author;
Author.prototype.getBooks = function()
{
return this
.books;
}
var au1=new Author("dororo1","Learn much"
);
var au2=new Author("dororo2","Learn less"
);
alert(au1.getName()
);
alert(au2.getName()
);
这种方法避免了function实现中，无法继承prototype的问题。因为 Author.prototype=new Person(
Name);new Person（）实例会调用Person构造和原型的所有属性。但是缺点是已经实例化了Author.prototype。所以当子类实例化的时候，所有非基本数据类型都是reference copy。所以上面例子中，无论实例au1,还是au2返回的值都是dororo1.
三、用“混合”实现
Name)
{
thi
s.name = name;
}
Person.prototype.getName = function()
{
return thi
s.name;
}
function Author(name,books)
{
this
.base = new Person(
Name);
for(var key in this
.bas
E){
if(!this[ke
y]){
this[key]=this
.base[key];
}
}
this
.book=books;
}
var au1=new Author("dororo1","work"
);
var au2=new Author("dororo2","play"
);
alert(au1.getName()
);
alert(au2.getName()
);
au1
.book;
au2
.book;
属于扩展，把父类的所有域都拷贝到子类。完全没有上述两方面的问题。
寄生组合模式）
JS的继承包括属性的继承和方法的继承，他们分别通过不同的方法来实现。
1.属性的继承
属性的继承通过改变函数的执行环境来实现的。而改变函数的执行环境可以使用call()和apply()两种方法来实现。
我们首先创建一个Animal“类”（因为JS中没有类的概念，这里只是一个模拟，它实际上只是一个Function函数对象）。
Name)
{
//为当前方法的执行环境(this)添加一个属性typ
ename
//但是执行环境(this)要执行这个函数的时候才能确定
thi
s.typ
ename = typ
ename;
thi
s.colors = ["red","while"];
}
//想函数的原型里 添加 两个（对象
共享的）的方法
Anima
l.prototype.Shout = function ()
{ alert("我是：--" + thi
s.type
Name);};
Anima
l.prototype.Eat = function ()
{ alert("我是：--" + thi
s.type
Name) };
//--定义一个狮子--“类”（其实就是一个函数）
function Lion(tn)
{
//
--执行Animal方法，并通过apply的第一个参数 修改了Animal的执行环境为Lion的this
//同样的，Lion的this，也要在执行的时候才能确定是谁
Anima
l.apply(this,["狮子"]
);//--继承了父类的变量属性，this因为是new了Lion，this是Lion
}
Lion.prototype = Anima
l.prototype; //继承父类的方法，搞定--但是这写不好，当子类再添加方法时候，父类同样也有此方法，这是指针引用
Lion.prototype.Hunt = function ()
{
alert("我是：狮子，我要去捕猎~~·~"
);
}
var aminm = new Animal(
);
amin
m.Hunt(
); //---可以访问到子类的方法，这样就不好了
//----那么如何解决这个问题呢》？？？？？？
//---解决方案：继承方法时候
可以这样写：
Lion.prototype = new Animal(
);//继承父类的方法，把Animal对象赋给了prototype原型，其实它里面也有属性
var lion = new Lion(
); //new 关键字除了创建的，还会修改Lion对象的执行环境为Lion对象本身
// ---换句话说，就是new完了之后，Lion函数里的this就是Lion函数本身了，然后调用Lion函数
分析一下new关键字：
而new关键字是十分伟大的，在上段代码中，new关键字完成了以下几项工作:
1)开辟堆空间，以准备存储Lion对象
2)修改Lion对象本身的执行环境，使得Lion函数的this指向了Lion函数对象本身。
3)调用Lion“类”的“构造函数”，创建Lion对象
4)将Lion函数对象的堆地址赋值给变量l，这个时候l就指向了这个Lion函数对象
lion.Shout();
lion.Eat();
但是这种继承有个缺点：就是父类的构造函数的被调用了两次，call一次，然后new又一次。
希望本文所述对大家的javascript程序设计有所帮助。
大佬总结
以上是大佬教程为你收集整理的javascript关于继承的用法汇总全部内容，希望文章能够帮你解决javascript关于继承的用法汇总所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。
