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. Sprint第二个冲刺(第九天)

    一.Sprint 计划会议: 现在简单说一下Sprint2的进展情况:大部分功能已经完成或者正在做,此次Sprint2中最难的设计商家的数据库表格已经完成了,剩下的其他功能都是比较耗时的,现在也在抓紧 ...

  2. Qt学习1

    Action 的用法 首先在头文件的 private 中加: 1 2 3 QMenu *fileMenu; QMenu *editMenu; QMenu *helpMenu; 1 2 3 4 5 6 ...

  3. EDIUS手绘遮罩功能如何用

    学了这么久的EDIUS视频编辑软件,你们学的怎么样了呢?你们知道EIDUS手绘遮罩的用法么,会熟练地使用它么?如果你们还没有学到这一知识点的话也不要着急,因为你们看完下面这篇文章就会明白了.事不宜迟, ...

  4. 鼠标滚动事件兼容性 wheel、onwheel

    wheelEvent = "onwheel" in document.createElement("div") ? "wheel" : // ...

  5. android管理联系人操作

    ContentProvider扩展之管理系统联系人 我们都知道ContentProvider是用来共享数据的,然而android本身就提供了大量的ContentProvider,例如联系人信息,系统的 ...

  6. 处理畅捷通的T+ 12.0版,web服务无故自动停止的问题

    用了几个月的畅捷通T+ 12.0版,一直都挺正常,但最近这两周,出现了好几次web服务自动停止的情况,今天抽空仔细看了Windows的日志,发现在半夜2点左右,TPlusProWebService12 ...

  7. Sedgewick的红黑树

    红黑树一直是数据结构中的难点,大部分关于算法与数据结构的学习资料(包括<算法导论>)对于这部分的讲解都是上来就下定义,告诉我们红黑树这个性质那个性质,插入删除要注意1234点,但是基本没有 ...

  8. 使用yield关键字来提高性能

    比如我们在开发当中往往会遇到这样的问题: public List<string> FindBobs(string [] names)   { List<string> bobs ...

  9. [转]Windows多进程编程

    转自:http://blog.csdn.net/bxhj3014/article/details/2082255 一.进程的概念       进程是是一个正在运行的程序的实例(飘---),是系统分配资 ...

  10. 【xargs使用】查询包含某字符串的所有文件

    在initrd目录下,查找包含"Loading virtio.ko"的所有文件 cd initrd find . | xargs grep "Loading virtio ...