一:js原型继承四步曲

     //js模拟类的创建以及继承
//动物(Animal),有头这个属性,eat方法
//名字这个属性
//猫有名字属性,继承Animal,抓老鼠方法 //第一步:创建父类
function Animal(name){
this.name = name;
}
//给父类添加属性方法
Animal.prototype.eat = function(){
console.log(this.name + " eating..."); }
//第二步:创建子类
function Cat(name){
Animal.call(this,name); }
//第三步:确定继承的关系
Cat.prototype = Object.create(Animal.prototype); //第四步:改造构造器
//改变了某个构造器的原型之后,紧接着的代码一定是改构造器
Cat.prototype.constructor = Cat; Cat.prototype.zhualaoshu = function(){
console.log(this.name + " 抓 老鼠");
} var mao = new Cat("猫");
mao.eat();
mao.zhualaoshu();

二:原型继承图


下图辅助理解

练习提巩固理解

函数Foo的__proto的值等于Foo.prototype,对吗? 不对
Object的prototype可以修改吗?能与不能原因是什么 不可以
顶级constructor是谁? Function()
顶级原型对象是谁? Object.prototype
对象的construtor成员是个属性还是个方法? 方法
Function有没有__proto__,为什么?值等于Object.prototype吗? 有,是Function.prototype;
所有的构造器的__proto__都等于其对应的prototype 不对
创建类形式的继承的四部曲是什么? 创建父类——>创建子类——>确定继承关系——>改构造器
Function的constructor与prototype值可以修改吗? 可以
Object.prototype === Object.__proto__吗? 不对
Function.prototype === Function.__proto__吗?
function F(){}; var f1 = new F();f1.__proto__ === Object.prototype吗? 不对

js原型继承四步曲及原型继承图的更多相关文章

  1. 三张图搞懂JavaScript的原型对象与原型链 / js继承,各种继承的优缺点(原型链继承,组合继承,寄生组合继承)

    摘自:https://www.cnblogs.com/shuiyi/p/5305435.html 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__pro ...

  2. [js高手之路]从原型链开始图解继承到组合继承的产生

    基于javascript原型链的层层递进查找规则,以及原型对象(prototype)的共享特性,实现继承是非常简单的事情 一.把父类的实例对象赋给子类的原型对象(prototype),可以实现继承 f ...

  3. JS原型,原型链,类,继承,class,extends,由浅到深

    一.构造函数和原型 1.构造函数.静态成员和实例成员 在ES6之前,通常用一种称为构造函数的特殊函数来定义对象及其特征,然后用构造函数来创建对象.像其他面向对象的语言一样,将抽象后的属性和方法封装到对 ...

  4. JS原型继承和类式继承

    前言 一个多月前,卤煮读了一篇翻译过来的外国人写的技术博客.此君在博客中将js中的类(构造)继承和原型继承做了一些比较,并且得出了结论:建议诸位在开发是用原型继承.文中提到了各种原型继承的优点,详细的 ...

  5. JS创建对象、继承原型、ES6中class继承

    面向对象编程:java中对象的两个基本概念:1.类:类是对象的模板,比如说Leader 这个是泛称领导,并不特指谁.2:实例:实例是根据类创建的对象,根据类Leader可以创建出很多实例:liyi,y ...

  6. js继承之组合继承(结合原型链继承 和 借用构造函数继承)

    在我的前两篇文章中,我们已经介绍了 js 中实现继承的两种模式:原型链继承和借用构造函数继承.这两种模式都存在各自的缺点,所以,我们考虑是否能将这二者结合到一起,从而发挥二者之长.即在继承过程中,既可 ...

  7. javaScript——原型继承四步曲

    <script> //js模拟类的创建以及继承 //第一步:创建父类 function Parent(name){ this.name = name; } //给父类添加属性方法 Pare ...

  8. js继承中,原型属性的继承探究

    最近研究了js的继承,看了幻天芒的文章http://www.cnblogs.com/humin/p/4556820.html#3947420,明白了最好是使用apply或call方法来实现继承. 已知 ...

  9. 【前端知识体系-JS相关】深入理解JavaScript原型(继承)和原型链

    1. Javascript继承 1.1 原型链继承 function Parent() { this.name = 'zhangsan'; this.children = ['A', 'B', 'C' ...

随机推荐

  1. leetcode 596 BUG笔记

    There is a table courses with columns: student and class Please list out all classes which have more ...

  2. 剑指offer——570~n-1中缺失的数字

    题目:0~n-1中缺失的数字. 一个长度为n-1的递增排序数组中的所有数字都是唯一的,并且每个数字都在范围0~n-1之内. 在范围0~n-1内的n个数字中有且只有一个数字不在该数组中,请找出这个数字. ...

  3. Ubuntu14.04搭建JSP与Servlet开发环境及其测试详解

    一,搭建JDK开发环境 1,在Java官网下载Jdk软件包,我的系统是64位Ubuntu14.04,所以选择jdk-8u25-linux-x64.tar.gz. 2,解压Jdk软件包 tar xvzf ...

  4. 四(2)、springcloud之Ribbon负载均衡

    2.Ribbon负载均衡 ​ Ribbon在工作时分成两步第一步先选择 EurekaServer ,它优先选择在同一个区域内负载较少的server. 第二步再根据用户指定的策略,在从server取到的 ...

  5. bigger is greater

    题目: Lexicographical order is often known as alphabetical order when dealing with strings. A string i ...

  6. 修改Tomcat的端口号方法

      (1).查找conf路径下的server.xml文件,路径如: I: \tomcat6\apache-tomcat-6.0.32\conf\server.xml (2).打开server.xml文 ...

  7. 自定义实现系统max方法

    function MyMath(){ //添加了一个方法 this.getMax=function(){ //所有数字中的最大值 var max=arguments[0]; for(var i=0;i ...

  8. Vultr账号被锁定的几个常见原因

    很多小伙伴使用都在问Vultr账号为什么又是会出现被锁定的情况,今天我们就来了解一下Vultr账号被锁定的几个常见原因. 1.Vultr主机违规使用 按照Vultr主机商的要求,我们的Vultr主机也 ...

  9. Yii2 : Active Record add Not In condition

    $query = MyModel::find()->where(['not in','attribute',$array]); 參考 Yii2 : Active Record add Not I ...

  10. H5全局属性contenteditable,实现可编辑元素

    <div contenteditable="true">这是一段可编辑的段落.请试着编辑该文本.</div> 效果如下: