博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
轻松搞定JS中的prototype、__proto__与constructor
阅读量:7044 次
发布时间:2019-06-28

本文共 2171 字,大约阅读时间需要 7 分钟。

盗图一张,看完内容后再看这张图片不明白你来锤我。。。

什么是构造函数?

function Demo(){};let d1 = new Demo;复制代码

用来初始化新创建的对象的函数是构造函数。在上面代码中,Demo()函数是构造函数

什么是实例对象?

function Demo(){};let d1 = new Demo;复制代码

通过构造函数的new操作创建的对象是实例对象。可以用一个构造函数,构造多个实例对象,在上面代码中d1就是实例对象

什么是原型对象(prototype)?

function Demo(){};  Demo.prototype.a = 666;  let d1 = new Demo;  let d2 = new Demo;  console.log(Demo.prototype.a); //666  console.log(d1.a); //666  console.log(d2.a); //666复制代码

Demo.prototype,指的就是原型对象。通过同一个构造函数实例化的多个对象具有相同的原型对象。所以经常使用原型对象来实现继承,Object.prototype的原型对象是null

constructor概念

原型对象有一个constructor属性,指向该原型对象对应的构造函数

function Demo(){};console.log(Demo.prototype.constructor === Demo);//true复制代码

由于实例对象可以继承原型对象的属性,所以实例对象也拥有constructor属性,并且实例对象的constructor也指向原型对象对应的构造函数

function Demo(){};let d1 = new Demo;console.log(d1.constructor === Demo); //true复制代码

原型链(proto)概念

实例对象有一个proto属性,指向该实例对象对应的原型对象

function Demo(){};let d1 = new Demo;console.log(d1.__proto__ === Demo.prototype);//true复制代码

基本概念介绍完毕下面介绍深入一点的地方

原型对象的深入理解

function Demo(){};var d1 = new Demo;console.log(Demo.prototype.__proto__ === Object.prototype);//trueconsole.log(Demo.prototype.constructor  ===  Object);//true复制代码

Demo.prototype是d1的原型对象同时他也可以称作为实例对象,那么作为实例对象它又是怎么来的了?它的原型对象又是什么。实际上,任何对象都可以看做是通过Object()构造函数的new操作实例化的对象,所以,Demo.prototype作为实例对象,它的构造函数是Object(),原型对象是Object.prototype。相应地,构造函数Object()的prototype属性指向原型对象Object.prototype;实例对象Demo.prototype的proto属性同样指向原型对象Object.prototype,实例对象Demo.prototype本身具有constructor属性,所以它会覆盖继承自原型对象Object.prototype的constructor属性

Object.prototype

Object.prototype也可作为实例对象,那么Object.prototype. __ proto __又指向什么了?结果为null, 这也就是到了原型链的尽头啦

console.log(Object.prototype.__proto__ === null);//true复制代码

Function对象

先明白一个概念函数也是对象,任何函数都可以看做是通过Function()构造函数的new操作实例化的结果, 如果把函数Demo当成实例对象的话,其构造函数是Function(),其原型对象是Function.prototype;类似地,函数Object的构造函数也是Function(),其原型对象是Function.prototype

functionDemo(){};var f1 = new Demo();console.log(Demo.__proto__ === Function.prototype);//trueconsole.log(Object.__proto__ === Function.prototype);//true复制代码

那么问题又来了,Function 作为实例对象他的proto又是什么了?其实 所有的函数都可以看成是构造函数Function()的new操作的实例化对象所以,如果Function作为实例对象,其构造函数是Function,其原型对象是Function.prototype

转载于:https://juejin.im/post/5c926200f265da612f1b966a

你可能感兴趣的文章
我的友情链接
查看>>
单元测试Struts2的Action(包含源码)
查看>>
简要总结最近遇到的5个问题
查看>>
我的友情链接
查看>>
烂泥:jira7.2安装、中文及破解(20170829更新)
查看>>
手机App测试点归纳
查看>>
tp通过curl调用接口
查看>>
高校专业机房使用VMware Player解决方案
查看>>
oracle 11g 收缩临时表空间 temp
查看>>
MicroPython实现wifi干扰与抓包
查看>>
API网关软件编写指导原则
查看>>
MySQL Split 函数
查看>>
http的post请求和get请求
查看>>
python 异常处理
查看>>
我的友情链接
查看>>
Centos Development Tools 安装
查看>>
1.1.2 C++发展历程
查看>>
我的友情链接
查看>>
awk笔记
查看>>
apache使用.htaccess进行基于文件扩展名的访问控制
查看>>