1.prototype


我们可以简单的把prototype看做是一个模版,新创建的自定义对象都是这个模版(prototype)的一个拷贝 (实际上不是拷贝而是链接,只不过这种链接是不可见,给人们的感觉好像是拷贝)。

  1. //'构造函数'a
  2. function a(name){
  3. this.name = name
  4. }
  5.  
  6. //原型属性,可共享
  7. a.prototype.getName = function(){
  8. return this.name;
  9. }
  10.  
  11. a.prototype.setName = function(name){
  12. this.name = name;
  13. return this.name;
  14. }
  15.  
  16. var b = new a('zqz');
  17.  
  18. //--内部实现
  19. //看上去像copy 其实就是改变了实例的指针到a原型上
  20. //复制'成员属性','成员函数'
  21. var _b = {
  22. getName:function(){
  23. return this.name;
  24. },
  25. setName:function(name){
  26. this.name = name;
  27. return this.name;
  28. }
  29. }
  30.  
  31. //还有构造函数的指向为a
  32. var b = _b;
  33. //--end
  34.  
  35. //使用
  36. b.getName() //=>zqz
  37. b.setName('z')
  38.  
  39. b.getName() //=>z
  40.  
  41. -------------------
  42.  
  43. //把MyFn作为构造函数
  44. function MyFn(){}
  45. var a = new MyFn();
  46.  
  47. function MyFn(){}
  48. var a = {}
  49. MyFn.call(a) //将a对象作为this的指针调用MyFn函数

继承可以理解为一个对象从另一个对象获取属性的过程。

java:使用new创建对象时,会调用构造方法初始化对象。

constructor始终指向创建当前对象的构造函数

2.原型继承


左边跟右边都能实现方法的调用。
但是左边在每个实例对象的上创建一个个jiao对象副本。
而右边不会,因为不管new出多少对象。都只会共享原型上的一个jiao正本。

prototype提供了一群同类对象共享属性和方法的机制。

  1. function Person(name){
  2. this.name = name;
  3. }
  4.  
  5. Person.prototype.Say = function(){
  6. alert(this.name)
  7. }
  8.  
  9. function Emp(name, sal){
  10. Person.call(this, name);
  11. this.sal = sal;
  12. }
  13.  
  14. //这里的操作就是将Person这个类的方法跟属性复制一份出来给Emp的原型(原型上的Say是不会copy故去的,Say而是在Emp的原型链上)
  15. //并且这时候Emp.prototype.constructor不再指向Emp这个构造函数,而是指向Person
  16. //在原型模型中,为了实现类继承,必须首先将子类构造函数的prototype设置为一个父类的对象实例
  17. Emp.prototype = new Person();
  18.  
  19. Emp.prototype.Show = function(){
  20. alert(this.name + '$' +this.sal)
  21. }

见图:

这里我们只是需要这个原型__proto__,而不需要name这类成员属性,因为这些对于继承来说没什么用。

 3.多态性


对象可以覆盖原型对象的属性跟方法,但这钟覆盖其实是在自身对象上创建了新的属性和方法,只不过这些属性和方法与原型对象的同名而已。(原型上的其实并没有改变)

这中掩盖机制就是"多态"性。与静态语言的虚函数和重载不谋而合。
然后,更厉害的是,我们可以随之给原型对象动态添加新的属性和方法,从而动态的扩展基类的功能特性。

  1. function Person(name){
  2. this.name = name;
  3. }
  4.  
  5. Person.prototype.Say = function(){
  6. alert(this.name)
  7. }
  8.  
  9. var xiaoming = new Person('小明')
  10. xiaoming.Say()
  11.  
  12. var xiaohong = new Person('小红');
  13.  
  14. //小红实现自己的Say方法,不会覆盖Person上的Say
  15. xiaohong.Say = function(){
  16. alert('我叫' + this.name)
  17. }
  18. xiaohong.Say();

javaScript的原型继承与多态性的更多相关文章

  1. JavaScript的原型继承

    JavaScript是一门面向对象的语言.在JavaScript中有一句很经典的话,万物皆对象.既然是面向对象的,那就有面向对象的三大特征:封装.继承.多态.这里讲的是JavaScript的继承,其他 ...

  2. Javascript的原型继承,说清楚

    一直以来对Javascript的原型.原型链.继承等东西都只是会用和了解,但没有深入去理解这门语言关于继承这方面的本质和特点.闲暇之余做的理解和总结,欢迎各位朋友一起讨论. 本文本主要从两段代码的区别 ...

  3. 谈谈javascript中原型继承

    什么是继承?拿来主义:自己没有,别人有,把别人的拿过来使用或者让其成为自己的 如何实现继承的方式 原型继承 混入继承 经典继承 1. 混入继承 由于一个对象可以继承自任意的对象,即:o可以继承自对象o ...

  4. 关于JavaScript的原型继承与原型链

    在讨论原型继承之前,先回顾一下关于创建自定义类型的方式,这里推荐将构造函数和原型模式组合使用,通过构造函数来定义实例自己的属性,再通过原型来定义公共的方法和属性. 这样一来,每个实例都有自己的实例属性 ...

  5. Javascript 构造函数原型继承机制

    我们先聊聊Js的历史,1994年Netscape公司发布了Navigator浏览器0.9班.这是历史上第一个比较成熟的网络浏览器.轰动一时.但是,这个版本的浏览器只能用来浏览,不具备交互功能,最主要的 ...

  6. 理解JavaScript中的原型继承(2)

    两年前在我学习JavaScript的时候我就写过两篇关于原型继承的博客: 理解JavaScript中原型继承 JavaScript中的原型继承 这两篇博客讲的都是原型的使用,其中一篇还有我学习时的错误 ...

  7. javascript原型继承

    在传统的基于Class的语言如Java.C++中,继承的本质是扩展一个已有的Class,并生成新的Subclass. 由于这类语言严格区分类和实例,继承实际上是类型的扩展.但是,JavaScript由 ...

  8. JavaScript大杂烩4 - 理解JavaScript对象的继承机制

    JavaScript是单根的完全面向对象的语言 JavaScript是单根的面向对象语言,它只有单一的根Object,所有的其他对象都是直接或者间接的从Object对象继承.而在JavaScript的 ...

  9. 深入理解JavaScript系列:史上最清晰的JavaScript的原型讲解

    一说起JavaScript就要谈的几个问题,原型就是其中的一个.说了句大话,史上最清晰.本来是想按照大纲式的行文写一下,但写到后边感觉其实就一个概念,没有什么条理性,所以下面就简单按照概念解释的模式谈 ...

随机推荐

  1. java中的字符串相关知识整理

    字符串为什么这么重要 写了多年java的开发应该对String不陌生,但是我却越发觉得它陌生.每学一门编程语言就会与字符串这个关键词打不少交道.看来它真的很重要. 字符串就是一系列的字符组合的串,如果 ...

  2. iframe用法

    <iframe src="http://caiyanli.top/" height="500"  width="500" frameb ...

  3. Centos 下 mysql root 密码重置

    重置mysql密码的方法有很多,官网也提供了很方便的快捷操作办法,可参考资料 resetting permissions .本文重置密码的具体步骤如下: 一.停止MySQL(如果处于运行状态) #se ...

  4. [.NET] 利用 async & await 的异步编程

    利用 async & await 的异步编程 [博主]反骨仔 [出处]http://www.cnblogs.com/liqingwen/p/5922573.html  目录 异步编程的简介 异 ...

  5. 如何利用pt-online-schema-change进行MySQL表的主键变更

    业务运行一段时间,发现原来的主键设置并不合理,这个时候,想变更主键.这种需求在实际生产中还是蛮多的. 下面,看看pt-online-schema-change解决这类问题的处理方式. 首先,创建一张测 ...

  6. [WARNING] Using platform encoding (GBK actually) to copy filtered resources, i.e. build is platform

    eclipse maven clean install 报错 1. 修改properties-->resource-->utf-8仍然报错 2.修改项目pom.xml文件,增加: < ...

  7. JavaWeb——Listener

    一.基本概念 JavaWeb里面的listener是通过观察者设计模式进行实现的.对于观察者模式,这里不做过多介绍,大概讲一下什么意思. 观察者模式又叫发布订阅模式或者监听器模式.在该模式中有两个角色 ...

  8. Java开发中的23种设计模式详解

    [放弃了原文访问者模式的Demo,自己写了一个新使用场景的Demo,加上了自己的理解] [源码地址:https://github.com/leon66666/DesignPattern] 一.设计模式 ...

  9. Android开发学习—— 创建项目时,不是继承activity,而是继承ActionBarActivity

    对于我们新建android项目时, 会 继承ActionBarActivity. 我们在新建项目时, 最小需求的sdk 选择 4.0以上版本.这样 新建的android项目就是继承activity了!

  10. 虚拟机VMware12.05下安装Ubuntu16.04几个关键地方

    在踩了自己按照网上的教程安装Ubuntu之后,仍然踩了不少坑,鼓捣了一段时间,才达到自己想要的界面.   下面就来说说,大家可能也会遇到的情况:   1.安装ISO镜像时候,路径直接选择 你从Ubun ...