JavaScript之函数原型链完整版
我的上一篇文章有解释绅士原型及简单的原型链,在这里我将对原型链做完整讲述;
// 函数的原型链: 把函数当对象(实例对象)来看
function Person(){}
// 底层Function创建出来的Person, 底层中任意函数都是Function创建的
// var Person = new Function();
// 把Person 当孩子来看,Person对象的原型链长啥样
// Person ==> Function.prototype ==> Object.prototype ==> null;
// console.log( Person.__proto__ == Function.prototype );
// console.log( Function.prototype.__proto__ );
// Person.prototype 这个prototype属性是函数Person自带的
// Function.prototype 是唯一的原型对象的类型是个函数的
// Function.prototype 原型对象有call apply bind三个方法
console.dir( Function.prototype );
// 函数都可以去使用call apply bind方法, 是的
// 1. 把Person函数当函数用,具体当构造函数用
function Person(){}
var p = new Person();
// 绘制以上代码的原型三角关系
// 构造函数: Person
// 原型对象: Person.prototype
// 实例对象: p
// console.log( Person.prototype.__proto__ === Object.prototype ); // 2. 把Person函数当对象看,当实例对象看(孩子)
// Person这个孩子谁创建的?
// 底层 var Person = new Function();
// 绘制以上代码的原型三角关系
// 构造函数: Function
// 原型对象: Function.prototype
// 实例对象: Person // 3. 把Object考虑进来,把Object当构造函数来看
var obj = new Object();
// 绘制以上代码的原型三角关系
// 构造函数: Object
// 原型对象: Object.prototype
// 实例对象: obj
// 4. 把Object当实例对象来看,孩子看,Object孩子谁生的
// 底层 var Object = new Function();
// 绘制以上代码的原型三角关系
// 构造函数: Function
// 原型对象: Function.prototype
// 实例对象: Object
// console.log( Object.__proto__ === Function.prototype ); // 5. Function 函数是谁生下来的,是Function自己
// var Function = new Function();
// 绘制以上代码的原型三角关系
// 构造函数: Function
// 原型对象: Function.prototype
// 实例对象: Function
console.log( Function.__proto__ == Function.prototype );
案例:
console.log( Function.prototype === Function.prototype ); // true
console.log(Object.__proto__ === Function.prototype); // true
console.log( Function.prototype.__proto__ === Object.prototype ); // true
console.log( Object.prototype.__proto__ === Object.prototype ); // false
console.log( Object.__proto__.__proto__ === Object.prototype ); // true
// 面试题
// Function的prototype原型对象有没有在Function对象的原型链上
/*console.log(Function instanceof Function); // true
console.log(Function instanceof Object); // true
console.log(Object instanceof Function); // true
console.log(Object instanceof Object); // true*/ // 练习
function Person() {}
var p = new Person()
console.log(p.constructor); // Person
console.log(Person.constructor); // Function
JavaScript之函数原型链完整版的更多相关文章
- 对Javascript 类、原型链、继承的理解
一.序言 和其他面向对象的语言(如Java)不同,Javascript语言对类的实现和继承的实现没有标准的定义,而是将这些交给了程序员,让程序员更加灵活地(当然刚开始也更加头疼)去定义类,实现继承 ...
- 图解JavaScript中的原型链
转自:http://www.jianshu.com/p/a81692ad5b5d typeof obj 和 obj instanceof Type 在JavaScript中,我们经常用typeof o ...
- JavaScript (JS) 面向对象编程 浅析 (含对象、函数原型链、闭包解析)
1. 构造函数原型对象:prototype ① 构造函数独立创建对象,消耗性能 function Person(name) { this.name = name; this.sayHello = fu ...
- JAVASCRIPT闭包以及原型链
方法内部还有个方法,实例化父方法后,再次调用父方法,可以运行父方法内部的子方法,这样的程序就叫做闭包 DEMO如下: //function outerFn() { // var outerVar = ...
- javaScript里的原型链
原型对象也是普通的对象,是对象一个自带隐式的__proto__属性,原型也有可能有自己的原型,如果一个原型对象的原型不为null的话,我们就称之为原型链.原型链是由一些用来继承和共享属性的对象组成的( ...
- JavaScript继承与原型链
对于那些熟悉基于类的面向对象语言(Java 或者 C++)的开发者来说,JavaScript 的语法是比较怪异的,这是由于 JavaScript 是一门动态语言,而且它没有类的概念( ES6 新增了c ...
- 一张图搞懂 Javascript 中的原型链、prototype、__proto__的关系 转载加自己的总结
1. JavaScript内置对象 所谓的内置对象 指的是:JavaScript本身就自己有的对象 可以直接拿来就用.例如Array String 等等.JavaScript一共有12内置对象 ...
- JavaScript中的原型链和继承
理解原型链 在 JavaScript 的世界中,函数是一等公民. 上面这句话在很多地方都看到过.用我自己的话来理解就是:函数既当爹又当妈."当爹"是因为我们用函数去处理各种&quo ...
- JavaScript -- 继承与原型链
JavaScript对象有一个指向一个原型对象的链,当试图访问一个对象的属性的时候,他不仅仅会在该对象上面搜寻,还会搜寻该对象的原型,以及对象的原型的原型,依次层层搜索,直到找到名字匹配的属性或者到达 ...
随机推荐
- jenkins、gitlab配置CI/CD
1. 在gitlab中创建好项目(gitlab的安装和基本使用这里不在说明) 2. 创建jenkins任务 jenkins 需要几个插件请先安装好 - Git plugin - GitLab Plug ...
- iOS中跑马灯效果小结
时光过得好快,记忆中刚刚从春节返回没有多久,清明.五一已飞逝而过,眨眼已到盛夏季节.不过还好,济南这两年不算太热,刚开始升温几天,一场及时雨总能让温度保持适宜.为了纪念一下青春的尾巴,也为了能有个健康 ...
- 基于Kubernetes和OpenKruise的可变基础设施实践
本文首发在OPPO互联网公众号,欢迎点击转载 https://mp.weixin.qq.com/s/hRvZz_bZfchmP0tkF6M2OA 对于可变基础设施的思考 kubernetes中的可变与 ...
- JVM类加载机制详解,建议看这一篇就够了,深入浅出总结的十分详细!
类加载机制 虚拟机把描述类的数据从Class文件加载到内存,并对数据进行校验.转换解析和初始化,最终形成可以被虚拟机直接使用的Java类型,这就是虚拟机的类加载机制. 类加载的时机 遇到new(比如n ...
- VUE中,@click后边( ) 有无括号的区别
在使用的时候,两种方式结果效果差不多是一样. @click="Login()" @click="Login"而唯一的区别就是,有括号的可以在括号里写传递的参数. ...
- python装饰器基础及应用
一.简介 装饰器是是修改其它函数功能的函数:其意义是让其他函数在不修改任何代码的前提下增加额外功能 二.数据类型 首先我们来看一段简单的代码: from types import MethodType ...
- Zabbix监控使用进阶
1. Zabbix基于SNMP监控 1.1 zabbix-web所能指定的监控方式 ssh/telnet agent:master/agent SNMP:Simple Network Manageme ...
- PyQt(Python+Qt)学习随笔:树型部件QTreeWidget提供的currentItem当前项操作访问方法
老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 当前项是指当前鼠标和键盘焦点所在项,在项可以进行选择操作时,当前项可以是选中状态,也可以是未选中状态 ...
- 第12.2节 Python sys模块导览
sys模块包括一些用于系统处理的功能,常用的成员包括: sys.argv:当前执行进程的命令参数列表,不含执行程序本身的名字: sys.stdin .sys.stdout 和 stderr :分别对应 ...
- centos 7系统,解决python3.x 安装后使用yum不能安装的问题(错误:urlgrabber-ext-down | KeyboardInterrupt)
1.在安装python3.xx版本后,通过yum去安装软件会出现问题,目前我遇到的有2种问题 比如显示:urlgrabber-ext-down Downloading packages: File & ...