方式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. OpenJDK源码研究笔记(九)-可恨却又可亲的的异常(NullPointerException)

    可恨的异常 程序开发过程中,最讨厌异常了. 异常代表着程序出了问题,一旦出现,控制台会出现一屏又一屏的堆栈错误信息. 看着就让人心烦. 对于一个新人来讲,遇到异常经常会压力大,手忙脚乱,心生畏惧. 可 ...

  2. centos6.5_x86_64 下安装 Oracle11gR2 的详细过程

    也可参考:http://blog.csdn.net/nhm_lxy/article/details/37813789 转自:http://www.cnblogs.com/pengineer/p/435 ...

  3. socket 编程的端口和地址复用

    在linux socket网络编程中,大规模并发TCP或UDP连接时,经常会用到端口复用:   int opt = 1;   if(setsockopt(sockfd, SOL_SOCKET,SO_R ...

  4. 二 HTable 源码导读

    户端调优的方法里面无非就这么几种:1)关闭autoFlush2)关闭WAL日志3)把writeBufferSize设大一点,一般说是设置成5MB        经过实践,就第二条关闭日志的效果比较明显 ...

  5. [Recompose] Stream a React Component from an Ajax Request with RxJS

    Loading data using RxJS is simple using Observable.ajax. This lesson shows you how to take the ajax ...

  6. Android严苛模式StrictMode使用详解

    StrictMode类是Android 2.3 (API 9)引入的一个工具类,可以用来帮助开发者发现代码中的一些不规范的问题,以达到提升应用响应能力的目的.举个例子来说,如果开发者在UI线程中进行了 ...

  7. legend---五、如何优雅的实现多继承

    legend---五.如何优雅的实现多继承 一.总结 一句话总结:多继承可以通过把别人对象作为属性来调用属性的方法执行, 继承的本质也是为了调用方法和属性,而上述的方式可以满足 1.php中前端可以共 ...

  8. 5.应用与模块(ng-app)

    转自:https://www.cnblogs.com/best/tag/Angular/ 自动载入启动一个AngularJS应用,声明了ng-app的元素会成为$rootScope的起点 每个HTML ...

  9. centos7 ssh免口令认证登录

    摘要:centos7, xshell, 公钥,  ssh ssh登录方式有口令认证登录和密钥认证登录 接下来本次介绍是ssh密钥登录方式 (1)产生公钥 (2)将公钥放置到centos7的(/root ...

  10. HDU 4358 Boring counting dfs序+莫队算法

    题意:N个节点的有根树,每个节点有一个weight.有Q个查询,问在以u为根的子树中,有恰好出现了K次的weight有多少种. 这是第一次写莫队算法,之前也只是偶有耳闻. 看了别人的代码打的,还是贴上 ...