javascript的继承在很多书里面细致的分了很多种类型和实现方式，大体上就是两种：对象冒充、原型方式。这两种方式各有优点和缺陷，这里我先列举出来，再从底层分析区别
学完了Javascript类和对象的创建之后，现在总结一下Javascript继承机制的实现。Javascript并不像Java那样对继承机制有严格明确的定义，它的实现方式正如它的变量的使用方式那样也是十分宽松的，你可以设计自己的方法“模仿”继承机制的实现。有以下几种方法：
1、对象冒充
function classA(str){ this.str=str; this.printstr=function(){ document.write(this.str); document.write("
"); } this.getstr=function(){ return this.str; } } function classB(name,str){ //下面这两句代码相当于将classA代码体中的内容搬到这里 this.newMethod1=classA; this.newMethod1(str); //注意，这里的写法 delete this.newMethod1; //新的方法和属性的定义须在删除了newMethod之后定义，因为可能覆盖超类的属性和方法。 this.name=name; this.sayName=function(){ document.write(this.name); document.write("
"); } } var a=new classB("Amy","helloworld"); a.printstr(); alert(a.getstr()); a.sayName(); 登录后复制
function定义的代码块就相当于一个类，你可以用而且它有this关键字，你可以用this为它添加属性和方法，上述代码中有以下两句：
立即学习“Java免费学习笔记（深入）”；
this.newMethod1=classA;
this.newMethod1(str);
classB中定义了newMethod1变量，它是一个引用，指向了classA，并且还调用了classA，这两句代码的作用等同于直接将classA代码块中的内容直接复制到这里，这样创建的classB对像当然具有classA的属性和方法了。对象冒充还可以实现多继承，如下：
function ClassZ() { this.newMethod = ClassX; this.newMethod(); delete this.newMethod;this.newMethod = ClassY; this.newMethod(); delete this.newMethod;}登录后复制
不过，classY会覆盖classX中同名的属性和方法，如果设计没问题的话，classz也不应该继承具有相同属性和方法的不同类。
2、利用call()方法
function classA(str){ this.str=str; this.printstr=function(){ document.write(this.str); document.write("
"); } this.getstr=function(){ return this.str; } } function classB(name,str){ //利用call方法实现继承 classA.call(this,str); this.name=name; this.sayName=function(){ document.write(this.name); document.write("
"); } } var a=new classB("Amy","helloworld"); a.printstr(); alert(a.getstr()); a.sayName(); 登录后复制
call()方法中第一个参数传递一个对象，这里的this指的是当前对象，后面的参数（可能有多个）是指传递给调用call()方法的类（函数）所需要的参数，classA.call()也是相当于直接将classA代码块中的内容直接复制到这里，classB的对象同样可以直接使用classB中的变量和方法。
3、原型链
function cA(){}; cA.prototype.name="John"; cA.prototype.sayName=function(){ document.write(this.name); document.write("
"); } function cB(){}; cB.prototype=new cA(); cB.prototype.age=23; cB.prototype.sayAge=function(){ document.write(this.age); document.write("
"); } var objB=new cB(); objB.sayAge(); objB.sayName(); document.write("is objB the instance of cA "+(objB instanceof cA)); document.write("
"); document.write("is objB the instance of cB "+(objB instanceof cB)); document.write("
"); 登录后复制
这里对类的定义要用prototype关键字，定义function时不带有参数，prototype后面的变量或方法相当于java中被static修饰后的属性和方法，是属于所有对象的，这里有个特殊之处：cB.prototype=new cA();该句话相当于将cA对象内容复制给cB,cB还可以追加自己的属性和方法。
4、混合方法
function cA(name){ this.name=name; }; cA.prototype.sayName=function(){ document.write(this.name); document.write("
"); } function cB(name,age){ cA.call(this,name); this.age=age; }; cB.prototype=new cA(); cB.prototype.sayAge=function(){ document.write(this.age); document.write("
"); } var objB=new cB("Alan",27); objB.sayName(); objB.sayAge(); document.write("is objB the instance of cA "+(objB instanceof cA)); document.write("
"); document.write("is objB the instance of cB "+(objB instanceof cB)); document.write("
"); 登录后复制
这里可以将属性封装在类体内，而方法利用原型方式定义，个人感觉，这是一个很好的设计方法，利用prototype定义的函数可以为多个对象重用，这里需要注意两点：cB类体内有cA.call(this,name);同时还要将cB原型赋为cB对象，即：cB.prototype=new cA();cA.call(this,name)同样相当于将cA类块内的代码复制于此，后面一句话又将cA的方法添加给cB,同时cB还可以追加自己的属性和方法。
上面是我整理给大家的，希望今后会对大家有帮助。
相关文章：
Servlet3.0与JS通过Ajax交互实例详解
原生JS封装淡入淡出效果函数步骤详解
p5.js键盘交互函数总结
以上就是Javascript继承机制(详细解答，图文教程)的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2760925.html
