本文是一篇原理推測的文章,假设有不准确的地方请指正,

原文:http://blog.csdn.net/softmanfly/article/details/34833931

JavaScript中构造函数与普通函数事实上没有什么区别,构造函数能够当做普通函数来使用,普通函数也能够用new来模拟构造函数的调用。然而使普通函数与构造函数发生区别的事实上就在于new操作符的内部原理。以下是我通过測试推測的new操作符的运行过程,当你在用new操作符来生成一个对象时内部可能运行了以下几个步骤的操作:

以构造函数

function Person(name){

this.name = name

this.sayName = function() {

alert(this.name);

}

}

来举例说明:

(1) 新建一个对象 var object = {};

(2) 然后设置构造函数的作用域为object,这样就能使用this指针,详细的操作可能是这种:

Person.apply(object。name);

(3) 运行构造函数中的详细代码,因为上一步apply使用的作用域是object,所以当运行this.name = name时事实上运行器先是去寻找object中有没有name属性。没有name属性就加入一个name属性,并为他赋值。

(4) 返回这个创建的object;

var p = new Person("cat");

window.sayName = p.sayName;

window.sayName();

终于事实上输出的是undefined为什么呢?

由于 假设未对函数进行this指针重定向操作的话(三种方式:object.sayName, sayName.apply(object), var object = new Person()),那么这个函数在调用时所创建的运行上下文环境中的this指针默认指向的是window全局对象,所以当调用window.sayName时。要alert一个this.name,事实上就是在alert window.name,而window对象中没有name这个属性,所以就提示undefined。

假设你调用window.sayName = p.sayName.bind(p);然后再去调用window.sayName的话。输出就变成了cat,这是由于你把一个新的sayName对象(由于bind返回的是一个新的对象)的this指针绑定到了p对象上,即this指向p对象。当你再调用window.sayName()时搜索sayName函数对象的this指针就不再是window对象了,而是p。此时就直接输出了cat.

初学JavaScript之推測new操作符的原理的更多相关文章

  1. 初学JavaScript七大注意事项

    知识说明: 初学JavaScript,注意以下七大细节,在实现同样功能的情况下,让我们的代码更易懂.效率更高. 一.简化代码 例如:创建对象 之前是这样的: Var car = new object( ...

  2. cocos2d-3.0 Helloworld::onTouchMoved的处理机制的推測

    bool sign2 = true; bool sign2 = true; void GameLayer::onTouchMoved(Touch *touch, Event *unused){ if( ...

  3. 每天一个JavaScript实例-检測表单数据

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. Javascript自执行匿名函数(function() { })()的原理浅析

    匿名函数就是没有函数名的函数.这篇文章主要介绍了Javascript自执行匿名函数(function() { })()的原理浅析的相关资料,需要的朋友可以参考下 函数是JavaScript中最灵活的一 ...

  5. JavaScript中Object.prototype.toString方法的原理

    在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法. ? 1 2 var arr = []; console.lo ...

  6. Javascript的变量与delete操作符

    原文:http://charlee.li/javascript-variables-and-delete-operator.html 刚刚看到一篇好文(原文链接), 对Javascript中的dele ...

  7. javascript中!=、!==、==、===操作符总结

    JavaScript 有两种比较方式:严格比较运算符和转换类型比较运算符. 在相等运算符中对应 === .!==和 ==.!=. 先举个栗子 var str = '1' var num0 = 0 va ...

  8. 点滴的积累---初学Javascript

    在学习知识的路上,我们须要的不断的去接触新的知识,同一时候我们也不要不停地对自己旧的知识进行总结.近期通过<牛腩Javascript>和姜昊的<Javascript专题视频>对 ...

  9. javascript中的递增递减操作符

    javascript中递增递减属于一元操作符,所谓一元操作符,即只能操作一个值的操作符. 递增和递减操作符各有两个版本:前置型和后置型.顾名思义,前置型应该位于要操作的变量之前,而后置型应该位于要操作 ...

随机推荐

  1. 利用LruCache载入网络图片实现图片瀑布流效果(改进版)

    PS: 2015年1月20日21:37:27 关于LoadImageAsyncTask和checkAllImageViewVisibility可能有点小bug 改动后的代码请參见升级版本号的代码 ht ...

  2. TCP三次握手及关闭时的2MSL分析

    TCP/IP三次握手四次挥手,是非常重要的,这个链接与关闭过程也是非常easy的.但为什么是三次握手?以及为什么要等待2MSL的状态?大部分人或许听到这个问题就蒙了.这篇博客就综合<TCP/IP ...

  3. hdoj--3072--Intelligence System(scc+缩点+数据去重)

    Intelligence System Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Othe ...

  4. EOJ 2844 排序去重

    有 n 个 1 到 1000 之间的整数 (1≤n≤100),对于其中重复的数字,只保留一个,把其余相同的数去掉.然后再按照指定的排序方式把这些数排序. Input 第 1 行为字母 A 或 D,A ...

  5. c#为程序添加全局热键的方法

    在程序失去焦点或者在后台运行时,可以通过使用全局热键的方式,进行一些快捷的操作,如QQ默认操作中ctrl+alt+A调出截图功能. 在Windows中实现热键功能需要使用win32的Api函数Regi ...

  6. php pdo具体操作

    0x01:测试PDO是否安装成功 运行如下代码,如果提示参数错误,说明PDO已经安装,如果说明对象不存在,则修改PHP配置文件php.ini,取消php_pdo_yourssqlserverhere. ...

  7. 最详细的CentOS 6与7对比(一):常见设置对比

    本主题将从3个角度进行对比 常见设置(CentOS 6 vs CentOS 7) 服务管理(Sysvinit vs Upstart vs Systemd) 性能测试(cpu/mem/io/oltp) ...

  8. ajax获取跨域数据

    1.效果图 2.源码 <%@ page contentType="text/html;charset=UTF-8" language="java" %&g ...

  9. 【Oracle】利用trace文件重建控制文件

    重建步骤: 1.生成trace文件: alter database backup controlfile to trace; 2.找到生成的trace文件: show parameter dump u ...

  10. System.Windows.Forms.WebBrowser中 处理 js 脚本 window.Open 禁止新建窗口 的方法

    wb 是 拖放在窗体上的 System.Windows.Forms.WebBrowser 在你的窗体代码中定义 SHDocVw.WebBrowser_V1 wb1; 在 你窗体的 load 事件中 加 ...