JavaScript中继承是通过原型链来体现的。

function Foo(){}

var f1=new Foo();

f1.a=10;

Foo.prototype.a=100;

Foo.prototype.b=200;

console.log(f1.a);//10

console.log(f1.b);//200

f1是Foo函数new出来的对象,f1.a是f1对象的基本属性,f1.b是怎么来的呢?——从Foo.prototype得来,因为f1.__proto__指向的是Foo.prototype。

访问一个对象的属性时,先在基本属性中查找,如果没有,再沿着__proto__这条链向上找,这就是原型链。

那么问题来了,在实际应用中如何区分一个属性到底是基本的还是从原型中找到的呢?hasOwnProperty,特别是在for…in…循环中,一定要注意。

function Foo(){}                                               function Foo(){}

var f1=new Foo();                var f1=new Foo();

f1.a=10;                     f1.a=10;

Foo.prototype.a=100;                                        Foo.prototype.a=100;

Foo.prototype.b=200;                                       Foo.prototype.b=200;

var item;                    var item;

for(item in f1){                                               for(item in f1){

  console.log(item);//a b                                    if(f1.hasOwnProperty(item)){

}                                                                             console.log(item);//a

                             }

                          }

但是f1的这个hasOwnProperty方法是从哪里来的, f1本身没有,Foo.prototype中也没有,哪儿来的?它是从Object.prototype中来的。

对象的原型链是沿着__proto__这条线走的,因此在查找f1.hasOwnProperty属性时,就会顺着原型链最终找到Object.prototype。当然也可以自定义函数和对象来实现自己的继承。

说一个函数的例子。我们知道每个函数都有call,apply方法,都有length,arguments,caller等属性。为什么每个函数都有?这肯定是“继承”的。函数由Function函数创建,因此继承的Function.prototype中的方法。

那怎么还有hasOwnProperty呢?——那是Function.prototype继承自Object.prototype的方法。

深入理解js——继承的更多相关文章

  1. 一篇文章理解JS继承——原型链/构造函数/组合/原型式/寄生式/寄生组合/Class extends

    说实在话,以前我只需要知道"寄生组合继承"是最好的,有个祖传代码模版用就行.最近因为一些事情,几个星期以来一直心心念念想整理出来.本文以<JavaScript高级程序设计&g ...

  2. 理解js继承的6种方式

    想要继承,就必须要提供个父类(继承谁,提供继承的属性) 一.原型链继承 重点:让新实例的原型等于父类的实例. 特点:1.实例可继承的属性有:实例的构造函数的属性,父类构造函数属性,父类原型的属性.(新 ...

  3. 深入理解JS原型链与继承

    我 觉得阅读精彩的文章是提升自己最快的方法,而且我发现人在不同阶段看待同样的东西都会有不同的收获,有一天你看到一本好书或者好的文章,请记得收藏起来, 隔断时间再去看看,我想应该会有很大的收获.其实今天 ...

  4. JS继承的从入门到理解

    开场白 大三下学期结束时候,一个人跑到帝都来参加各厂的面试,免不了的面试过程中经常被问到的问题就是JS中如何实现继承,当时的自己也是背熟了实现继承的各种方法,回过头来想想却不知道__proto__是什 ...

  5. 【学习笔记】六:面向对象的程序设计——理解JS中的对象属性、创建对象、JS中的继承

    ES中没有类的概念,这也使其对象和其他语言中的对象有所不同,ES中定义对象为:“无序属性的集合,其属性包含基本值.对象或者函数”.现在常用的创建单个对象的方法为对象字面量形式.在常见多个对象时,使用工 ...

  6. 【学习笔记】深入理解js原型和闭包(6)——继承

    为何用“继承”为标题,而不用“原型链”? 原型链如果解释清楚了很容易理解,不会与常用的java/C#产生混淆.而“继承”确实常用面向对象语言中最基本的概念,但是java中的继承与javascript中 ...

  7. JS继承(简单理解版)

    童鞋们,我们今天聊聊js的继承,关于继承,平时开发基本用不到,但是面试没有不考的,我就想问,这是人干的事吗? 好吧,迫于社会主义核心价值观,我们今天就来简单说一说js的继承,谁让它是面向对象编程很重要 ...

  8. 浅谈JS继承

    今天呢,我们来谈谈继承,它也是JS语言中的一大重点,一般什么时候我们会用继承呢,比如有两个拖拽的面板,两个功能基本一致,只是第二个面板多了一些不同的东西,这个时候,我们就会希望,要是第二个直接能继承第 ...

  9. js继承之call,apply和prototype随谈

    在js中,call,apply和prototype都可以实现对象的继承,下面我们看一个例子: function FatherObj1() { this.sayhello = "I am jo ...

随机推荐

  1. VMD_EI_API=>MAINTAIN_BAPI 去创建供应商主数据

    转自 http://blog.sina.com.cn/s/blog_9ae2f2940102uxyp.html VMD_EI_API=>MAINTAIN_BAPI 去创建供应商主数据的部分数据代 ...

  2. [NOIP2009] 靶形数独(搜索+剪枝)

    题目描述 小城和小华都是热爱数学的好学生,最近,他们不约而同地迷上了数独游戏,好胜的他 们想用数独来一比高低.但普通的数独对他们来说都过于简单了,于是他们向 Z 博士请教, Z 博士拿出了他最近发明的 ...

  3. Oracle学习系列4

    Oracle学习系列4 ************************************************************************************ 数据库 ...

  4. *** glibc detected *** malloc(): memory corruption 分类: C/C++ Linux 2015-05-14 09:22 37人阅读 评论(0) 收藏

    *** glibc detected *** malloc(): memory corruption: 0x09eab988 *** 发现是由于memset越界写引起的. 在Linux Server上 ...

  5. JVM byte code

    http://blog.jamesdbloom.com/JVMInternals.html#constant_pool http://grepcode.com/file/repository.grep ...

  6. YOLO: Real-Time Object Detection 安装和测试

    1.下载darknet git clone https://github.com/pjreddie/darknet.git 2.修改make GPU= CUDNN= OPENCV= DEBUG= 3. ...

  7. Windows 10 x64 安装 Visual Basic 6.0 SP6

    原文是E文,E文好的可以直接看这里:http://www.fortypoundhead.com/showcontent.asp?artid=23993 原则上Windows 7 x64, Window ...

  8. 用ABBYY提取文本和表格的方法

    在ABBYY FineReader 12 OCR文字识别软件中,有一个插件ABBYY Screenshot Reader,通常情况下与ABBYY FineReader 12一起安装到计算机中,它是一款 ...

  9. MindProject R6025解决

    -- 来之百度贴吧,收藏在此. 不知道吧里有没有人用mindmanager2012,如果用的话会发现保存.mmap文件后,移动到其他地方,再打开,就会出错,软件关闭.网上很多人说是模版里tips的原因 ...

  10. python标准库xml.etree.ElementTree的bug

    使用python生成或者解析xml的方法用的最多的可能就数python标准库xml.etree.ElementTree和lxml了,在某些环境下使用xml.etree.ElementTree更方便一些 ...