在网上找了很多一直没找到关于JS扩展父类的方法，让我很是郁闷啊~要是真的开发组遇到了该咋整，于是乎自己手写了一些测试代码，没想到通过了……（难道是人品太好了？）废话不多说了直接上代码看看~

　　

 <script type="text/javascript">

 function chaolei(name){
       this.name=name;

     this.show=function(){

         alert("超类");

     };

 }

 function zilei(name){

     this.name=name;

 }

 zilei.prototype=new chaolei();

 zilei.prototype.constructor=zilei;

 zilei.prototype.show=function(){

     chaolei.call(zilei);

     zilei.show();

     alert(this.name);

 };

 var a=new zilei("我是谁？");

 a.show();

 </script>

　　用的是标准的原型链的继承写法，通过call函数来扩展了父类的show方法。运行的结果为先弹出“超类”然后弹出“我是谁”。

　　简单说一下原理吧（这里不介绍如何继承，想看继承去我以前的文章里找吧~）。这里继承完父类后，子类通过prototype给自己增加了一个show方法，这个方法和父类的show方法同名，所以如果不用call会覆盖掉父类的方法，但是我们用call之后首先让父类的show方法可以在子类中调用，这就是chaolei.call(zilei)的作用了，这里建议用子类的名字作为参数，因为如果用this的话会造成污染，因为这样的话作用域就变成了整个子类show方法，如果父类中也有一个跟子类相同的变量this.name那么接下来的alert(this.name)弹出的就是父类的了。然后zilei.show()这个就是调用的父类的show方法了（因为用了call函数，所以这里调用show时只能调用父类的因为子类的show还没有完成）。这里需要强调一点，如果call里面的参数是zilei的话接下来zilei.show这里也必须用“zilei”否则会报错。然后再一个alert(this.name);就是调用子类的变量了~所以也就先执行了父类的show然后又运行了子类show方法的扩展了！

　　以上是我的个人理解，如果有不多的地方还请高手拍砖~并给我指明错误~谢谢！

js扩展父类方法的更多相关文章

  1. 如何使用 js 扩展 prototype 方法

    如何使用 js 扩展 prototype 方法 expand prototype function enhancedLog(msg = ``) { // this.msg = msg; enhance ...

  2. js 判断数组包含某值的方法 和 javascript数组扩展indexOf()方法

    var  questionId = []; var anSwerIdValue = []; ////javascript数组扩展indexOf()方法 Array.prototype.indexOf ...

  3. JS扩展方法——字符串trim()

    转自:http://www.cnblogs.com/kissdodog/p/3386480.html <head> <title>测试JS扩展方法</title> ...

  4. JS扩展方法

    JS扩展方法与C#的扩展方法非常相似,也是可以链式调用的,也是通过对某个类的扩展写法来实现.这个东西非常好用,如果将预先写好的方法放到一个js里面引用的话,那么后面写js将非常有趣. 下面给出一个例子 ...

  5. jquery 扩展插件方法

    分析插件jquery.countdown.js (function($) { $.fn.countdown = function(options) { // default options var d ...

  6. 封装jQuery Validate扩展验证方法

    一.封装自定义验证方法-validate-methods.js /***************************************************************** j ...

  7. Xilium.CefGlue利用XHR实现Js调用c#方法

    防外链 博客园原文地址在这里http://www.cnblogs.com/shen6041/p/3442499.html 引 Xilium CefGlue是个不错的cef扩展工程,托管地址在这里 ht ...

  8. JS扩展 或 Jquery的扩展写法

    <script>//JS扩展String函数test,其它类推String.prototype.test = function(s){ alert(this+s);}var str = ' ...

  9. esayui扩展验证方法

    下面是关于平时中积累的esayui扩展验证方法仅作记录:       /**************************************************************** ...

随机推荐

  1. QT链接数据库

    在介绍QT与数据的链接问题上,我在这里就不介绍关于QT环境与mysql.sqlite3环境的安装步骤了,以下的所有的操作都是建立在你已经安装了所有环境的基础上的.好的,那我们就具体来看一看QT环境中怎 ...

  2. AngularJS创建新指令directive参数说明

    var myapp = angular.module('myapp', []); myapp.directive('worldname', function() { return { template ...

  3. QuartusII13.0使用教程详解（一个完整的工程建立）

    好久都没有发布自己的博客了,因为最近学校有比赛,从参加到现在都是一脸懵逼,幸亏有bingo大神的教程,让我慢慢走上了VIP之旅,bingo大神的无私奉献精神值得我们每一个业界人士学习,向bingo致敬 ...

  4. stl_config.h基本宏

    四.宏: (其实呢, 我们所有的宏都包含在了 "stl_config.h"头文件中.) //这些宏是怎么判断是否需要定义:是否有指定的宏,还有一些特定的编译器也可能支持. 4.1. ...

  5. Java中this关键字的作用

    转载: 原文地址:http://www.cnblogs.com/lzq198754/p/5767024.html 一.this关键字主要有三个应用: (1)this调用本类中的属性,也就是类中的成员变 ...

  6. C#中在比较自定义对象的时候要重写Equals方法

    using System;using System.Collections.Generic;using System.Text; namespace Equal{    using System; c ...

  7. Lua快捷键

      快捷键 含义 ctrl + shift + L 多行编辑 ctrl + D 继续向下选中下一个相同的文本 Alt + F3 选中所有相同所选中德文本                        

  8. 做自己的PHP语法解释器

    PHP关键字异构化实验 PHP词法分析和语法分析 简单理解PHP代码执行过程:http://blog.csdn.net/risingsun001/article/details/22888861 PH ...

  9. css中最基本几个选择器

    css中有四种不同的选择器 ①类选择器,又叫class选择器.类选择器{属性名:属性值:...}/*类选择器*/.s1{ font-weight:bold;font-size:16px;}②id选择器 ...

  10. LISTCTRL控件方法

    以下未经说明,listctrl默认view风格为report --------------------------------------------------------------------- ...