原文:JS中通过call方法实现继承

讲解都写在注释里面了，有不对的地方请拍砖，谢谢！

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>JS通过call方法实现继承</title>

</head>

<body>

    <script type="text/javascript">

        /*  js中的继承有多种实现方式，今天我们讨论下通过call方法实现的继承。

        此方法与 原型链继承 相比还是比较简单，容易理解的。

        那么，我们先对call方法进行简单的讲解：

        call 方法可以用一个对象来代替另一个对象调用一个方法。

        这句话蛮不好理解，

        还是看示例代码吧，更直观明了：

        */

        function a() {

            this.name = "我是a";

            this.showName = function () {

                alert(this.name);

            }

        }

        function b() {

            this.name = "我是b";

        }

        var _a = new a();

        var _b = new b();

        //下面这行代码的意思是：用 _b 来代替 _a 执行 _a 的showName方法。

        //因此执行对象从 _a 变成了 _b, showName方法里面的this此时指代的是 b 了，而不是 a

        //因此输出结果为： 我是b

        _a.showName.call(_b);

        /*

        哎，语文没学好，总感觉表达不清楚，也不知道大家能不能看懂。

        好了，进入正题，我们来看继承的实现。

        */

        /*

        首先我们要定义4个类：动物(animal) ; 人(person) ; 中国人(chinese) ; 日本人(japanese)。

        代码如下:

        */

        function animal() {

            this.eat = function () {

                alert("动物都要吃东西");

            }

        }

        function person() {

            this.say = function () {

                alert("人是会说话的");

            }

        }

//        function chinese() {

//            this.ch = function () {

//                alert("我是中国人");

//            }

//        }

//        function japanese() {

//            this.ja = function () {

//                alert("我是日本人");

//            }

//        }

        /*  然后实现4个类之间的关系

            关系如下： 中国人 继承自 人

                      日本人 继承自 动物 和 人

            说明： 

            在JS中是可以实现类的多继承的。

            因此 japanese 可以同时继承自 animal 和 person ,

            它不像C#和java语言，只支持接口的多继承，而不支持类的多继承。

            修改上面的chinese和japanese如下：

        */

        function chinese() {

            person.call(this); //继承自 person 类 （用chinese来代替person）

            this.ch = function () {

                alert("我是中国人");

            }

        }

        function japanese() {

            animal.call(this); //继承自 animal 类

            person.call(this); //继承自 person 类

            this.ja = function () {

                alert("我是日本人");

            }

        }

        /*

            我们知道：实现继承后，子类是可以拥有父类的公有字段和方法的。

            而父类不会拥有子类的任何东西

            说明：

            js中的 字段，方法 也是有公有和私有之分的。

            子类只能访问到父类的公有字段和方法。

            关于 js 中的 公有，私有，全局，静态 等等的定义讲解我会另写一篇博文

            与大家讨论。

            请看如下代码：

        */

        //实例化对象

        var c = new chinese();

        var j = new japanese();

        var p = new person();

        c.say(); //拥有父类 person 的 say 方法

        c.ch();  //自身的 ch 方法

        j.eat();  //拥有父类 animal 的 eat 方法

        j.say();  //拥有父类 person 的 say 方法

        j.ja();   //自身的 ja 方法

        p.say();  //自身的 say 方法

        /*

            下面两句会报错，

            因为父类person是不会拥有子类的任何东西的，

            所以p没有ch和ja方法。

            p.ch();

            p.ja();

        */

    </script>

</body>

</html>

　　　　　

JS中通过call方法实现继承的更多相关文章

  1. JS与OC交互，JS中调用OC方法(获取JSContext的方式)

    最近用到JS和OC原生方法调用的问题,查了许多资料都语焉不详,自己记录一下吧,如果有误欢迎联系我指出. JS中调用OC方法有三种方式: 1.通过获取JSContext的方式直接调用OC方法 2.通过继 ...

  2. js中的tostring()方法

    http://blog.sina.com.cn/s/blog_85c1dc100101bxgg.html js中的tostring()方法 (2013-11-12 11:07:43) 转载▼ 标签: ...

  3. 秒味课堂Angular js笔记------Angular js中的工具方法

    Angular js中的工具方法 angular.isArray angular.isDate angular.isDefined angular.isUndefined angular.isFunc ...

  4. jQuery与JS中的map()方法使用

    1.jquery中的map()方法 首先看一个简单的实例: $("p").append( $("input").map(function(){ return $ ...

  5. JavaScript -- 时光流逝（二）：js中数组的方法

    JavaScript -- 知识点回顾篇(二):js中数组的方法 1. 数组 (1)定义数组,数组赋值 <script type="text/javascript"> ...

  6. ASP.NET#使用母版时，如果要使用js中的getElementById()方法取得某个内容页的元素时要注意的问题

    当使用母版,要使用js中的getElementById()方法取得某个内容页的元素时,所选取的id并不是母版中内容页的id,而是在设计内容页时设定的id例子:母版页: ...... <head ...

  7. JS中split使用方法和数组中元素的删除

    JS中split使用方法和数组中元素的删除 JS中split使用方法 <script language="javascript"> function spli(){ d ...

  8. JS中的splice方法

    JS中的splice方法 定义和用法 splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目. 注释:该方法会改变原始数组(集合). 语法 arrayObject.splice(ind ...

  9. JS中常见的几种继承方法

    1.原型链继承 // 1.原型链继承 /* 缺点:所有属性被共享,而且不能传递参数 */ function Person(name,age){ this.name = name this.age = ...

随机推荐

  1. mongodb.conf

    # mongodb.conf # Where to store the data. dbpath=/var/lib/mongodb #where to log logpath=/var/log/mon ...

  2. SVN目录对号图标（更新、冲突）不显示

    长谈想知道,大约SVN这些冲突.变化.加入.不显示问题etc目录下的复选图标,退房的在线信息,多数说的更改icon的settings,后来,一点点仔细阅读SVN配有英文说明文档,我相信,改变是有点问题 ...

  3. 一个关于Linux Bridge配置的吐嘈

    话说有些事情十分适合在放假前的一天折腾一天,但绝对不适合在你准备去吃饭前多看一眼...我上周就碰到了这么一件揪心的事,终于以低血糖收场.十分狼狈地四处觅食,却觅到了一包超级辣的鸡爪.吃完后感觉症状加重 ...

  4. 每天收获一点点------Hadoop Eclipse插件的使用

    本文所用软件版本:myeclipe2014    hadoop1.2.1 1.安装Hadoop开发插件 下载hadoop-eclipse-plugin-1.2.1.jar,拷贝到myeclipse根目 ...

  5. SQL Mirroring[Hot back up with Double machine]

    Background: It's fairly common for businesses to want to provide some high availability for their SQ ...

  6. UOJ #5. 【NOI2014】动物园 扩大KMP

    第一次NOI称号. ... 扩展假设知道KMP如果. .. . 就是水题了. ... #5. [NOI2014]动物园 统计提交情况 描写叙述 提交 近日.园长发现动物园中好吃懒做的动物越来越多了.比 ...

  7. jquery中 $ 和 jQuery 及 $() 的差别

    用过jquery的人都知道,jquery有两种使用方法,一种是$,另一种是jQuery,那么这两种方式在使用上有什么差别呢? 答案是这两种使用方法没什么差别,仅仅是别名而已,用$要比jQuery简短一 ...

  8. Linux 火狐浏览器安装Flash插入

    Linux系统安装完毕,找到Firefox浏览器和视频播放器不能总是提示安装Flash.而据火狐浏览器的提示Flash插件安装总是失败,能手动安装Flash插件啦. 到Flash官网:http://g ...

  9. SyntaxHighlighter代码高亮插件

    SyntaxHighlighter它是Google Code在一个开源项目,主要用于对代码着色页, 使用十分方便,效果也不错,并且差点儿支持常见的全部语言. 使用步骤: 一.下载并解压缩SyntaxH ...

  10. 持续集成并不能消除 Bug，而是让它们非常容易发现和改正（转）

    互联网软件的开发和发布,已经形成了一套标准流程,最重要的组成部分就是持续集成(Continuous integration,简称 CI). 本文简要介绍持续集成的概念和做法. 一.概念 持续集成指的是 ...