JS function 是函数也是对象, 浅谈原型链
JS function 是函数也是对象, 浅谈原型链
JS 唯一支持的继承方式是通过原型链继承, 理解好原型链非常重要, 我记录下我的理解
1. 前言
new 出来的实例有 _proto_ 属性, 并且指向其构造函数的 prototype 对象
function Person(){}
const person = new Person();
person.__proto__ === Person.prototype // true
所有 new 出来的实例有 _proto_ 属性, 所有函数有 prototype 属性
不要小看任何一个对象, 这个对象有可能是一个函数; 不要小看任何一个函数, 这个函数有可能也是一个对象
只要是对象, 一定就有相应的构造函数 ( 除了 Object 的原型对象找不到 )
2. 有趣的部分
- function 是函数, 但也是对象
- Object 是函数, 但也是对象
- 看一个对象是不是函数, 就看它有没有 prototype 属性, 像原型对象没有, 它就只是单纯的对象, 不是函数 ( 原型对象无原型 )
- Function 是函数, 也是对象, 并且它作为对象的 _proto_ 属性 等于 它作为函数的 prototype 属性, 这说明, 它 自己创建自己
3. 解释
以这个为例
function Person(){}
const person = new Person();
function 是函数, 但也是对象
- 是函数
Person.prototype // {constructor: ƒ ...} Person.prototype.constructor === Person // true
这说明 Person 是函数, 有原型, 原型的 constructor 指向自己
- 是对象
Person.__proto__ // ƒ () { [native code] } Person.__proto__ === Function.prototype //true
这说明 Person 是对象, 相当于
Person = new Function(), 有没有那味了呢原型对象是单纯的对象, 不是函数
Person.prototype.prototype // undefined 不是函数, 无原型 Person.prototype.__proto__ // {constructor: ƒ...} Person.prototype.__proto__ === Object.prototype // true
原型对象无原型, 说明原型对象就只是一个对象, 是对象肯定就有构造函数, 其构造函数是 Object, 相当于
Person.prototype = new Object()Object 是函数, 但也是对象
Object.prototype // {constructor: ƒ ...} 是函数, 有原型 Object.prototype.__proto__ // null 所有对象都有其构造函数, Object 原型对象例外 Object.__proto__ // ƒ () { [native code] } Object 是对象 Object.__proto__ === Function.prototype // true
Object 有原型对象, 说明它是个函数, 并且它的原型是唯一一个找不到构造函数的; Object 是对象, 有自己的构造函数, 并且它的构造函数是 Function. 相当于
Object = new Function()Function 是函数, 也是对象, 并且它自己创建自己
Function.prototype // ƒ () { [native code] } 是函数 Function.__proto__ // ƒ () { [native code] } 是对象 Function.__proto__ === Function.prototype // true Function.prototype.__proto__ === Object.prototype // true
经过前面的讨论, 从这个代码可以看出, Function 即是函数也是对象, 并且相当于自己创建了自己, 相当于
Function = new Function();; Function 的原型对象的构造函数也是 Object, 相当于Function.prototype = new Object()
4. 关系图

new 的看法, new 出来的对象一定有 _proto_ 指向其构造函数的 prototype.
Function = new Function();
Object = new Function();
Person = new Function();
所有的原型对象 = new Object(); // 非继承, 人为修改后会发生变化
person = new Person();
JS function 是函数也是对象, 浅谈原型链的更多相关文章
- js function定义函数的4种方法
js function定义函数的4种方法 1.最基本的作为一个本本分分的函数声明使用. 复制代码代码如下: 复制代码代码如下: function func(){} 或 var func=functio ...
- JS对象继承与原型链
1.以复制方式实现的继承 1.1浅拷贝 基本类型的复制 var parent = { lanage: "chinese" } var child = { name: "x ...
- jsp内置对象浅谈
jsp内置对象浅谈 | 浏览:1184 | 更新:2013-12-11 16:01 JSP内置对象:我们在使用JSP进行页面编程时可以直接使用而不需自己创建的一些Web容器已为用户创建好的JSP内置对 ...
- JS核心系列:浅谈原型对象和原型链
在Javascript中,万物皆对象,但对象也有区别,大致可以分为两类,即:普通对象(Object)和函数对象(Function). 一般而言,通过new Function产生的对象是函数对象,其他对 ...
- js中的函数,Date对象,Math对象和数组对象
函数就是完成某个功能的一组语句,js中的函数由关键字 function + 函数名 + 一组参数定义;函数在定义后可以被重复调用,通常将常用的功能写成一个函数,利用函数可以使代码的组织结构更多清晰. ...
- [js高手之路]原型对象(prototype)与原型链相关属性与方法详解
一,instanceof: instanceof检测左侧的__proto__原型链上,是否存在右侧的prototype原型. 我在之前的两篇文章 [js高手之路]构造函数的基本特性与优缺点 [js高手 ...
- js 中对象--对象结构(原型链基础解析)
对于本篇对于如何自定义对象.和对象相关的属性操作不了解的话,可以查我对这两篇博客.了解这两篇可以更容易理解本篇文章 用构造函数创建了一个对象 obj对象的本身创建了两个属性 x=1 ,y=2 ...
- JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)
JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...
- 关于js的几道经典题(作用域、原型链等)自己做的
1. function test() { var a = 1; setTimeout(function() { alert(a); a = 3; }, 1000); a = 2; setTimeout ...
随机推荐
- 全文检索django-haystack+jieba+whoosh
全文检索里的组件简介 1.什么是haystack? 1. haystack是django的开源搜索框架,该框架支持Solr,Elasticsearch,Whoosh, *Xapian*搜索引擎,不用更 ...
- 第15.34节 PyQt(Python+Qt)入门学习:containers容器类部件QStackedWidget堆叠窗口部件详解
老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 一.概述 StackedWidget堆叠窗口部件为一系列窗口部件的堆叠,对应类为QStackedWi ...
- PyQt(Python+Qt)学习随笔:QAbstractItemView的defaultDropAction属性
老猿Python博文目录 老猿Python博客地址# 一.概述 defaultDropAction属性用于控制QAbstractItemView及其子类的实例视图中拖放时放下的默认操作.该属性的类型为 ...
- html5shiv.js和respond.min.js作用说明(IE9及以下兼容)
一.在web端页面开发过程中基本都会需要解决的问题(IE兼容): 1.解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题. 2.让不支持css3 Media Query的浏览 ...
- bootstrap table处理后台返回的数据
- 深入解析ConcurrentHashMap:感受并发编程智慧
如果有一个整型变量count,多个线程并发让count自增1,你会怎么设计? 你知道如何让多个线程协作完成一件事件吗? 前言 很高兴遇见你~ ConcurrentHashMap是个老生常谈的集合类了, ...
- P4085 [USACO17DEC]Haybale Feast
我又开始水了,感觉又是一道虚假的蓝题 题意 非常好理解,自己看吧 题解 可以比较轻易的发现,如果对于一段满足和大于等于 \(m\) 的区间和其满足和大于等于 \(m\) 的子区间来说,选择子区间肯定是 ...
- AcWing 362. 区间
听书上说有贪心 + 数据结构的做法,研究了一下. 朴素贪心 考虑把所有线段按照右端点 \(b\) 从小到大排序,依次考虑每一条线段的要求: 如果已经满足要求则跳过 否则尽量选择靠后的数(因为之后的线段 ...
- python叠加矩形框图层
两种方式以及效果: 方式一,使用PIL.Image.blend方式: from PIL import Image, ImageDraw im = Image.open('d:/tmp/58.249.0 ...
- sqli-labs less13-20(各种post型头部注入)
less-13 POST型双查询注入 less-14 POST型双查询注入 less-15 POST型布尔注入 less-16 POST型布尔注入 less-17 POST型报错注入(updatexm ...