方式1：子类.prototype = 父类对象

Boy.prototype = new Person();

Sub.prototype = new Sup('张三');   //可以传参数也可以不传

既可以使用父类用this声明的属性、方法。也可以使用原型对象里面的属性、方法。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>Untitled Document</title>

        <script type=text/javascript charset=utf-8>

        // js中怎么去实现继承：采用原型链的概念。继承也只是继承父类的原型对象中的属性、方法。子类对象可以使用父类的属性、方法。

        // 3 原型对象.isPrototypeOf(实例对象)  判断实例对象的原型 是不是当前对象

        // 父类构造函数 sup

        function Sup(name){

            this.name = name;

        }

        // 父类的原型对象

        Sup.prototype = {

            constructor : Sup ,

            sayName : function(){

                alert(this.name);

            }

        };

        // 子类构造函数 sub

        function Sub(age){

            this.age = age ;

        }

        Sub.prototype = new Sup('张三');

        alert(Sub.prototype.constructor);//父类function Sup(name){this.name = name;}

        var sub1 = new Sub();

        alert(sub1.name);//张三，子类对象可以使用父类的属性、方法

        sub1.sayName();//张三，子类对象可以使用父类的属性、方法

        // 子类.prototype = 父类对象，就是前面的第二种方式。既可以使用父类的对象属性、方法，又可以使用父类原型对象的属性、方法

        // 父类

        function Person(name, age){

            this.name = name ;

            this.age  = age ;

        }

        // 父类的原型对象属性

        Person.prototype.id = 10 ;

        // 子类

        function Boy(sex){

            this.sex = sex ;

        }

        //继承已经实现了

        Boy.prototype = new Person('z3');

        var b = new Boy();

        alert(b.name);//z3，，子类对象可以使用父类的属性、方法

        alert(b.id);//10，，子类对象可以使用父类的属性、方法

        </script>

    </head>

    <body>

    </body>

</html>

方式2：通过call调用，只能继承父类用this声明的属性、方法。不能继承父类原型对象的属性、方法。

// 通过call调用

        // 父类

        function Person(name, age){

            this.name = name ;

            this.age  = age ;

        }

        // 父类的原型对象属性

        Person.prototype.id = 10 ;

        // 子类

        function Boy(name , age , sex){

            // call apply

            Person.call(this,name,age);

            this.sex = sex ;

        }

        var b = new Boy('张三' , 20 , '男');

        alert(b.name);

        alert(b.age);

        alert(b.sex);

        alert(b.id); //父类的原型对象并没有继承

方式三：上面2种的组合

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>Untitled Document</title>

        <script type=text/javascript charset=utf-8>

        // 父类

        function Person(name, age){

            this.name = name ;

            this.age  = age ;

        }

        // 父类的原型对象属性

        Person.prototype.id = 10 ;

        Person.prototype.sayName = function(){alert(this.name);};

        // 子类

        function Boy(name , age , sex){

            Person.call(this,name,age);//继承函数的this属性、方法

            this.sex = sex ;

        }

        Boy.prototype = new Person(); //继承父类的原型对象，其实这里既可以使用父类用this声明的属性、方法。也可以使用原型对象里面的属性、方法。

        var b = new Boy('李四' , 20 , '男');

        alert(b.name);

        alert(b.sex);

        b.sayName();

        </script>

    </head>

    <body>

    </body>

</html>

js18--继承方式的更多相关文章

  1. js的三种继承方式及其优缺点

    [转] 第一种,prototype的方式: //父类 function person(){ this.hair = 'black'; this.eye = 'black'; this.skin = ' ...

  2. JavaScript继承方式详解[转]

    js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承) 类式继承(构造函数间的继承) 由于js不像java那样是真正面向对象的语言,js是基于对象的,它没有类的概念.所以,要想实现 ...

  3. 从jQuery中学习来的另一种继承方式（技巧）

    遵从Js的原型链规则,利用js灵活的特性灵活地改造原型,可以实现各种创意地继承方式,昨天研究了jQuery,对作者实现继承的方式感到佩服,他对js原型和原型链的理解比较透彻,运用自如.这里给出jQue ...

  4. 重新理解JS的6种继承方式

    写在前面 一直不喜欢JS的OOP,在学习阶段好像也用不到,总觉得JS的OOP不伦不类的,可能是因为先接触了Java,所以对JS的OO部分有些抵触. 偏见归偏见,既然面试官问到了JS的OOP,那么说明这 ...

  5. js两种定义函数、继承方式及区别

    一:js两种定义函数的方式及区别 1:函数声明: function sayA() { alert("i am A"); } 2:函数表达式: var sayB = function ...

  6. 谈谈JavaScript的2种主要继承方式

    今天给自己巩固一下js的继承知识,基础不好,有不对的地方,请尽量拍砖,越重越好. js继承方法最主要的是2种,一种是通过原型的方式,一种是通过借用call&apply的构造函数方式. 1.原型 ...

  7. C++的三种继承方式简述

    C++对父类(也称基类)的继承有三种方式,分别为:public继承.protected继承.private继承.三种继承方式的不同在于继承之后子类的成员函数的"可继承性质". 在说 ...

  8. C++学习15 继承权限和继承方式

    C++继承的一般语法为: class 派生类名:［继承方式］ 基类名{ 派生类新增加的成员 }; 继承方式限定了基类成员在派生类中的访问权限,包括 public(公有的).private(私有的)和 ...

  9. Javascript的四种继承方式

    在Javascript中,所有开发者定义的类都可以作为基类,但出于安全性考虑,本地类和宿主类不能作为基类,这样可以防止公用访问编译过的浏览器级的代码,因为这些代码可以被用于恶意攻击. 选定基类后,就可 ...

  10. JavaScript之四种继承方式讲解

    在Javascript中,所有开发者定义的类都可以作为基类,但出于安全性考虑,本地类和宿主类不能作为基类,这样可以防止公用访问编译过的浏览器级的代码,因为这些代码可以被用于恶意攻击. 选定基类后,就可 ...

随机推荐

  1. 紫书 习题 10-9 UVa 294（正约数个数）

    一个数的正约数个数等于这个数的质因数分解后 每一项幂+1的积 因为每个质因数的幂可以为0, 1, 2--(注意可以为0) 所以就每个质因数配一个幂任意组合就可得一个正因数,根据乘法原理可得正约数个数. ...

  2. 如何使用Java创建Excel(.xls 和 .xlsx)文件 并写入数据

    1,需要依赖的jar包, <!-- POI(operate excel) start --> <!-- the version of the following POI packag ...

  3. POJ——T 1986 Distance Queries

    http://poj.org/problem?id=1986 Time Limit: 2000MS   Memory Limit: 30000K Total Submissions: 14383   ...

  4. 洛谷 P1407 工资

    P1407 工资 题目描述 有一家世界级大企业,他们经过调查,发现了一个奇特的现象,竟然在自己的公司里,有超过一半的雇员,他们的工资完全相同! 公布了这项调查结果后,众多老板对于这一现象很感兴趣,他们 ...

  5. 【DevExpress】GridControl添加按钮列并添加按钮事件

    在GridControl中添加按钮列的步骤如下: 1. 把列的ColumnEdit属性设置为RepositoryItemButtonEdit 2. 把TextEditStyle属性设置为HideTex ...

  6. 设置UITableViewCell高度的问题

    有非常多时候.UITableViewCell每行的高度是不固定的,须要动态设置. UITableView有个代理方法, -(CGFloat)tableView:(UITableView *)table ...

  7. Lesson 1 Basic Concepts: Part 3

    A cheaper option Some people may not want to buy a domain or pay for hosting because they only have ...

  8. shrio 身份认证流程-Realm

    身份认证流程 流程如下: 1.首先调用Subject.login(token)进行登录,其会自动委托给Security Manager,调用之前必须通过SecurityUtils. setSecuri ...

  9. OpenCV中数据转换

    在OpenCV中Mat.CvMat和IplImage类型都可以代表和显示图像.IplImage由CvMat派生,而CvMat由CvArr派生即CvArr -> CvMat -> IplIm ...

  10. Android 设置屏幕不待机

    本文转载于:http://blog.csdn.net/yudajun/article/details/7748760 androidnullservice 目录(?)[+] 最近做项目时正好用到,进行 ...