先铺垫下原型规则:

1.所有的引用类型(数组,对象,函数)都具有对象特性,可自由扩展属性(出了null外)

2.所有的引用类型(数组,对象,函数)都有一个__proto__属性(隐式原型),属性值是一个对象

3.所有的函数都有一个prototype属性(显示原型),属性值是一个对象

4.所有的引用类型(数组,对象,函数),__protot__属性值指向他的构造函数的prototype属性值(new出来对象自身的(__protot__)隐式原型就是他构造函数的(prototype)显示原型)

5.当试图去得到一个对象的某个属性时,如果这个对象本身没有这个属性,那么会去他的__proto__(即他的构造函数的prototype)中寻找

看例子:

例子中new出来的f对象是只有name属性(第3行创建的)和printName方法(第10行创建的),第15行中调用f.alertName.而alertName直接在f对象本身中是没有的,那么会去他的__proto__(即他的构造函数Foo的prototype)中寻找(在第5行)

这就引出了原型链

当我们访问对象的一个属性或方法时,它会先在对象自身中寻找,如果有则直接使用,
如果没有则会去原型对象中寻找,一直往上找(像冒泡一样),浏览器防止无限循环,找到最上层就是object了(祖先),再往上找就是null

拓展:

使用hasOwnProperty()方法来检查该属性是new出实例对象自身中含有的还是在原型中含有的,当对象自身中含有属性时,会返回true,

对比in,使用in检查对象中是否含有某个属性时,如果对象中没有但是原型中有,也会返回true,所以hasOwnProperty()更严格,

js原型,原型链的更多相关文章

  1. 前端基本知识(二):JS的原型链的理解

    之前一直对于前端的基本知识不是了解很详细,基本功不扎实,但是前端开发中的基本知识才是以后职业发展的根基,虽然自己总是以一种实践是检验真理的唯一标准,写代码实践项目才是唯一,但是经常遇到知道怎么去解决这 ...

  2. js javascript 原型链详解

    看了许多大神的博文,才少许明白了js 中原型链的概念,下面给大家浅谈一下,顺便也是为了巩固自己 首先看原型链之前先来了解一下new关键字的作用,在许多高级语言中,new是必不可少的关键字,其作用是为了 ...

  3. 攻略前端面试官(三):JS的原型和原型链

    本文在个人主页同步更新~ 背就完事了 介绍:一些知识点相关的面试题和答案 使用姿势:看答案前先尝试回答,看完后把答案收起来检验成果~ 面试官:什么是构造函数 答:构造函数的本质是一个普通函数,他的特点 ...

  4. js中的原型,原型链和继承

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

  5. 怎么理解js的原型链继承?

    前言 了解java等面向对象语言的童鞋应该知道.面向对象的三大特性就是:封装,继承,多态. 今天,我们就来聊一聊继承.但是,注意,我们现在说的是js的继承. 在js的es6语法出来之前,我们想实现js ...

  6. 详聊js中的原型/原型链

    先以一段简单的代码为例: function Dog(params){     this.name = param.name;     this.age = param.age;     this.ba ...

  7. 一文让你对js的原型与原型链不再害怕、迷惑

    目录 原型与原型链的详细剖析 原型 显式原型prototype 隐式原型__proto__ 显式原型prototype与隐式原型__proto__的关系 原型链(隐式原型链) 探寻原型链的尽头 完整详 ...

  8. 基础1:JS的原型和原型链究竟

    JS的原型和原型链究竟是什么? 1. 从JS创建一个对象开始说起: 1.1 工厂模式创建对象 (缺点是无法知道创建出来的对象是一个什么类型的对象) function createPerson(name ...

  9. js中的原型对象链

    由于原型对象也是一个对象,它也有自己的原型对象并继承对象中的属性,这就是原型对象链:对象继承其原型对象,而原型对象继承它的原型对象,以此类推. 我们创建的每一个函数都有一个prototype(原型)属 ...

  10. js的原型

    在讲js的原型之前,必须先了解下Object和Function. Object和Function都作为JS的自带函数,Object继承自己,Funtion继承自己,Object和Function互相是 ...

随机推荐

  1. [web前端] react router4.0 登录后返回之前浏览页面(回到来源页)

    本文链接:https://blog.csdn.net/zeroyulong/article/details/81911704困扰了好久的问题,最终还是在官方文档上找到了答案(看英文文档真心难受啊~~) ...

  2. func 传参异步方法

    public async Task<T> AssignAsync<T>(string key, Func<T> acquire) {} var result = a ...

  3. odoo开发笔记--一个模块显示两个一级菜单

    场景描述: 在已启动开发的模块中,odoo顶部一级菜单只有一个“会员管理”,需求是:在同一级顶部菜单,增加新菜单“产品管理”.举例如图:       处理方式: 按照odoo的机制,实现这种效果,可以 ...

  4. Python3基础 dict __len__ 统计键值对的数量

             Python : 3.7.3          OS : Ubuntu 18.04.2 LTS         IDE : pycharm-community-2019.1.3    ...

  5. eclipse配置maven环境 腾讯课堂的(还没试)

    下载和基本配置 https://ke.qq.com/webcourse/index.html#cid=434021&term_id=100518216&taid=37765432689 ...

  6. 如何杀死处于进程状态D的进程

    D状态的就是 uninterruptible sleep ,此时进程不能被信号唤醒,GDB等调试工具也不能对它调试,因为GDB也是用到了信号,也杀不死它 D状态的形成 如何分析D状态 cat /pro ...

  7. Legacy和UEFI,MBR和GPT的区别

    Legacy(历史的,遗留的,传统的)和UEFI指的是系统引导方式(Legacy为传统BIOS,UEFI为新式BIOS),MBR和GPT指的是磁盘分区表类型. 一般情况下都是Legacy+MBR, U ...

  8. VS2017中使用ObjectARX 2019 wizard的 ArxWizMFCSupport向导出现的bug修复前因后果

    VS2017中使用ObjectARX 2019 wizard的 ArxWizMFCSupport向导出现的bug,提示脚本错误. 实际原因类似在arx2012向导的问题,需要修改C:\Program ...

  9. vs2010+ARX2012向导添加mfc支持类出现Error in default.htm PopulateDialogIDs():

    初步判断为ARX2012默认的编译器平台集是v90,如果你只安装了vs2010,没有安装vs2008sp1或者vs2008sp1的编译器,以及对应的Windows MFC SDK,就可能会出现这样的问 ...

  10. Postman系列三:Postman中post接口实战(上传文件、json请求)

    一:接口测试过程中GET请求与POST请求的主要区别 从开发角度我们看get与post的主要区别是:1.Get是用来从服务器上获得数据,而Post是用来向服务器上传递数据:2.Get安全性比Post低 ...