依旧是恶补js基础,上代码:

1、定义父类及父类方法

function Animal(){
this.name = "动物";
} Animal.prototype.eat = function(food){
alert('eat ' + food);
}

2、定义子类

function Ferret(){
this.name = "雪貂";
  //this.type = "leixing";//此处,如果定义了type,会覆盖下面prototype.type的“domestic”
  //说明一个机制,调用Ferret().type的时候,先寻找对象自有属性,再查找原型链内属性
}

3、原型链继承核心

function fn(){
//中间函数,防止每次创建对象都要new
}
//父类的属性与方法通过prototype传递给中间函数
fn.prototype = Animal.prototype;
//中间函数的实例将父类的属性与方法传递给子类的prototype
Ferret.prototype = new fn();

4、扩展子类

//为所有Ferret实例定义type属性
Ferret.prototype.type = "domestic"; Ferret.prototype.eat = function(food){ //子类执行父类的方法
Animal.prototype.eat.call(this,food); //子类的扩展逻辑
alert(this.type + ' eat ' + food); }

5、测试继承结果

var animal = new Animal();
var ferret = new Ferret();

animal instanceof Animal // true
animal instanceof Ferret // false
ferret instanceof Ferret // true
ferret instanceof Animal // true 此处,子类是父类的实例为true,说明继承成功~
ferret.eat('meat');//1、alert(eat meat); 2、alert(domestic eat meat);

以下是一些啰嗦:

var a = { a: 'b', c: 'd' };

function a1(){
  this.a = 'b';
  this.c = 'd';
} a instanceof Object // true
a1 instanceof Object // true

由此可以看出,a与a1均属于对象,那么,有什么区别呢

a.prototype == undifiend // true
a1.prototype == undefined // false typeof a == "object" // true
typeof a1 == "function" // true Object.keys(a) // ["a", "c"]
Object.keys(a1) // []

a仅仅是一个单纯的key&value,没有构造函数,属于【引用类型】

而a1则有prototype,可以实现继承,通过Object.keys()可以看出,a1身为一个Object,不存在key&value,属于【值类型】

V8中的继承:

function Animal(){}
function Ferret(){}
Ferret.prototype.__proto__ = Animal.prototype// 父类将属性传递给子类

prototype原型链继承的更多相关文章

  1. 原型链继承中的prototype、__proto__和constructor的关系

    前不久写了有关原型链中prototype.__proto__和constructor的关系的理解,这篇文章说说在原型链继承中的prototype.__proto__和constructor的关系. 通 ...

  2. 一步步学习javascript基础篇(5):面向对象设计之对象继承(原型链继承)

    上一篇介绍了对象创建的几种基本方式,今天我们看分析下对象的继承. 一.原型链继承 1.通过设置prototype指向“父类”的实例来实现继承. function Obj1() { this.name1 ...

  3. javascript中继承(一)-----原型链继承的个人理解

    [寒暄]好久没有更新博客了,说来话长,因为我下定决心要从一个后台程序员转为Front End,其间走过了一段漫长而艰辛的时光,今天跟大家分享下自己对javascript中原型链继承的理解. 总的说来, ...

  4. javascript原型链继承

    一.关于javascript原型的基本概念: prototype属性:每个函数都一个prototype属性,这个属性指向函数的原型对象.原型对象主要用于共享实例中所包含的的属性和方法. constru ...

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

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

  6. js重点--原型链继承详解

    上篇说过了关于原型链继承的问题,这篇详解一下. 1. function animals(){ this.type = "animals"; } animals.prototype. ...

  7. js原型链+继承 浅析

    名称:    prototype--原型对象    __proto__--属性 原型链与继承网上搜索定义,看起来挺绕的 .先说继承: 所有的对象实例都可以共享原型对象包含的属性和方法  例如一个实例A ...

  8. Javascript 组合继承 原型链继承 寄生继承

    Javascript继承通常有三种方式. 第一种:组合式继承: function SuperType(name) { this.name = name; this.colors = ["re ...

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

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

随机推荐

  1. 重装mysql步骤

    , 卸载MySQL 2, 删除目录 C:\Documents and Settings\All Users\Application Data\MySQL (这个真的有,原先没注意到,删掉!) 如果没有 ...

  2. Java笔记(二十四)……集合工具类Collections&Arrays

    Collections 集合框架的工具类,方法全部为静态 Collections与Collection的区别 Collection是集合框架的一个顶层接口,里面定义了单列集合的共性方法 Collect ...

  3. Html笔记(七)表单

    表单标签: <form> 表单标签是最常用的标签,用于与服务器端的交互. <input>:输入标签:接受用户输入信息 其中type属性指定输入标签的类型 文本框 text:输入 ...

  4. PHP使用SwiftMailer发送邮件

    用到了swiftmailer 的lib库 官方网址:http://swiftmailer.org/ require_once 'lib/swift_required.php';//给我发送邮件func ...

  5. Installing your app on your Windows RT device

    Alright… so my app is almost finished and I want to install it for real on my Surface tablet. How do ...

  6. hdoj 1702 ACboy needs your help again!【数组模拟+STL实现】

    ACboy needs your help again! Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K ( ...

  7. php数组相加 两个数组键名相同 后者不能覆盖前者

    array(“a”)+array(“b”)结果还是array(“a”) array(“a”)+array(“b”)的结果是 array(“a”) 因为,它们等效于array(“0″=>”a”)+ ...

  8. JSON ,JSONArray和JSONObject

    和 XML 一样,JSON 也是基于纯文本的数据格式.由于 JSON 天生是为 JavaScript 准备的,因此,JSON 的数据格式非常简单,可以用 JSON 传输一个简单的 String,Num ...

  9. 页面接口防刷 解决思路一nginx

    线上环境 很多接口 如果不做缓存 可能导致有人拿到url  每秒几万次的访问后台程序,导致系统down机. 此处, nginx可以加一层缓存. expires起到控制页面缓存的作用,合理的配置expi ...

  10. 根据日期累加金额的mysql

    今天遇到了一个语句,想了一会觉得有必要记录一下 问题描述 id  money date 1 10 2015-01-012 20 2015-01-023 30 2015-01-034 40 2015-0 ...