原型相关的知识点-new的实现原理
2019-08-14 10:22:01来源:博客园 阅读 ()
let obj = {}
let fn = function(){
this.content = 'zhangsan'
} let fn2 = new fn()
fn2是fn实例化出来的一个对象,要了解new做了那些事情,先看一下一个普通对象有哪些东西。
普通对象:
实例化对象fn2:
1:普通对象的__proto__指向了Function.prototype而fn2的__proto__指向了fn.prototype,所以new的过程中改变了fn2的__proto__的指向,让其指向了fn的prototype。
2:fn2中有着fn中的content属性,说明fn中的this指向了fn2,所以new的过程中经历this指向的改变,并调用了fn方法给fn1添加content属性。fn.call(fn1)。
完整过程:
let fn = function(){ this.content = 'zhangsan' } let fn2 = new fn() 过程: let fn2 = {} //创建出一个空对象 fn2.__proto__ = fn.prototype //改变fn2的__proto__指向 fn.call(fn2) //改变fn的this指向
实现一个自己的new:
let myNew = function(sup){ let obj = {} obj.__proto__ = sup.prototype sup.call(obj) return obj } let fn = function(){ this.content = 'zhangsan' } let fn2 = myNew(fn) console.log(fn2)
原文链接:https://www.cnblogs.com/bravefuture/p/11278205.html
如有疑问请与原作者联系
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:入门webpack,看这篇就够了
下一篇:layui 上传图片 实现过程
- javascript的知识点整理 2019-10-25
- js截取字符串相关的知识点 2019-08-14
- JavaScript知识点:分支结构(if、switch)+算法例题 2019-08-14
- JavaScript知识点---->运算规则与运算(逻辑、位) 2019-08-14
- 原生JS实现上拉下拉列表 2019-08-14
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash