博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
new FunctionName() 运行机制浅析 -----转自玉伯
阅读量:5259 次
发布时间:2019-06-14

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

   测试代码:

function Dog(name) {    this.name = name;    Dog.prototype = {        shout: function() { alert("I am " + this.name); }    };}var dog1 = new Dog("Dog 1");dog1.shout();

上面的代码看起来很“优美”,可一运行,却报错:“Object doesn’t support this property or method”.

对于代码:

Fn() {};var fn = new Fn();

new Fn() 的实际构造过程可以等价为以下伪代码:

var o = {__proto__: Fn.prototype};Fn.apply(o);return o;

理解了 new 的构造过程,我们可以分析上面的实例了。

首先,JS引擎在遇到函数声明 function Dog(…) 时,会给函数对象添加 prototype 属性,伪代码如下:

Dog.prototype = {constructor: Dog};

当运行到 var dog1 = new Dog(”Dog 1″) 时,内部操作:

var o = {__proto__: Dog.prototype};Dog.apply(o);return o;

也许你已经知道问题所在了。为了更清楚,添加点注释:

// Dog.prototype = {constructor: Dog};var o = {__proto__: Dog.prototype};// 此时,o = {__proto__: {constructor: Dog}}Dog.apply(o);// 此时,Dog.prototype = {shout: function(){...}}return o;

显然,运行 dog1.shout() 时,dog1 的确没有 shout 方法。

转载于:https://www.cnblogs.com/litao229/archive/2012/01/30/2332329.html

你可能感兴趣的文章
负载均衡策略
查看>>
微信智能开放平台
查看>>
ArcGIS Engine 中的绘制与编辑
查看>>
Oracle--通配符、Escape转义字符、模糊查询语句
查看>>
子网划分讲解及练习(一)
查看>>
c# 文件笔记
查看>>
第一页 - 工具的使用(webstorm)
查看>>
Linux 进程资源用量监控和按用户设置进程限制
查看>>
IE浏览器整页截屏程序(二)
查看>>
D3.js 之 d3-shap 简介(转)
查看>>
制作满天星空
查看>>
类和结构
查看>>
CSS3选择器(二)之属性选择器
查看>>
adidas crazylight 2018 performance analysis review
查看>>
typeset shell 用法
查看>>
python 之 循环语句
查看>>
心得25--JDK新特性9-泛型1-加深介绍
查看>>
[转]ceph网络通信模块_以monitor模块为例
查看>>
HDOJ 1754 I Hate It(线段树基本操作)
查看>>
latex tree
查看>>