原文地址:http://www.moye.me/2014/11/21/也说this/

引子

Any sufficiently advanced technology is indistinguishable from magic.

— Arthur C.Clarke

老爷子所言不虚,各种技术里都有黑魔法,比如JavaScript,就有着像 this这样的奇葩存在。

What's this?

this是什么?大概能得到的答案有:

  • 当前方法引用的对象实例
  • 当前调用函数本身
  • 全局上下文(顶层对象)
  • 函数运行的context环境

哪种解释是对的呢?来看段代码:

function foo() {
console.log(this.a);
}
var a = 2;
var obj = {a: 1};
foo(); // 2 (在Node下是undefined)
foo.call(obj); // 1
obj.foo = foo;
obj.foo(); // 1

在这段代码中,this 呈现了三种可能:

  1. 全局上下文:foo执行时,this 开放式的指向了全局上下文(在node下为undefined,原因在于Global的作用域与浏览器不同
  2. 向方法传递的上下文:Function对象固有的applycall方法,第一个参数均为 thisArg,它将被调用函数做为执行的上下文(在非strict模式,如果这个值为null或undefined,将有污染全局上下文的风险
  3. 方法引用的对象:可以将这个对象看成new创建的对象,函数的this将指向它

看起来是要有无限可能的节奏……好在我提前找到了这本书:

You Don't Know JS: this & Object Prototypes

To learn this, you first have to learn what this is not, despite any assumptions or misconceptions that may lead you down those paths. this is neither a reference to the function itself, nor is it a reference to the function’s lexical scope.

this is actually a binding that is made when a function is invoked, and what it references is determined entirely by the call-site where thefunction is called.

 

this 绑定上下文

this 实质上是一种绑定(binding)机制,只关乎函数被调用时所处的 上下文(context),而不关心它在哪里被定义。举个粟子:

function foo(something) {
this.a = something;
}
var obj1 = {
foo: foo
};
var obj2 = {};
obj1.foo( 2 );
console.log( obj1.a ); // 2
obj1.foo.call( obj2, 3 );
console.log( obj2.a ); // 3
var bar = new obj1.foo( 4 );
console.log( obj1.a ); // 2
console.log( bar.a ); // 4

this做为一个被绑定的context,甚至与函数依附的对象无关,通过obj1.foo.call( obj2, 3 )一句我们能看清:这个context被引入,函数既可以读也可以修改它,但这里涉及到一个优先级问题,即:为什么 obj1绑定的this.a 没有被foo()改写,却是 obj2的 this.a?

this 绑定优先级

绑定 this 的形式大概有以下几种,它们的优先级如下排列:

  1. 被new过的函数实例,那么函数里的this绑定的就是这个实例对象本身,如 var bar = new foo();
  2. 函数是被 call 或者 apply 调用,那么 this 绑定的是第一个参数: var bar = foo.call( obj2 );
  3. 函数是被某个对象引用的方法,那么它的this 绑定的是这个对象:var bar = obj1.foo();
  4. 最后,就是隐式绑定了,这种情况的this 绑定的是全局上下文,在 strict mode(Node)下是 undefined:var bar = foo();

建议

对于闭包惯用的self = this技俩,You Don't Know JS 一书是不提倡的,它的建议是:

Embrace  this-style mechanisms completely, including using bind(..) where necessary, and try to avoid  self = this ...

Function.prototype.bind,它的实现看起来是这样的:

if (!Function.prototype.bind) {
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
// closest thing possible to the ECMAScript 5
// internal IsCallable function
throw new TypeError(
"Function.prototype.bind - what is trying " +
"to be bound is not callable"
);
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function () {
},
fBound = function () {
return fToBind.apply(
(this instanceof fNOP && oThis ? this : oThis),
aArgs.concat(Array.prototype.slice.call(arguments))
)
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}

更多文章请移步我的blog新地址: http://www.moye.me/

[Node.js] 也说this的更多相关文章

  1. node.js学习(三)简单的node程序&&模块简单使用&&commonJS规范&&深入理解模块原理

    一.一个简单的node程序 1.新建一个txt文件 2.修改后缀 修改之后会弹出这个,点击"是" 3.运行test.js 源文件 使用node.js运行之后的. 如果该路径下没有该 ...

  2. 利用Node.js的Net模块实现一个命令行多人聊天室

    1.net模块基本API 要使用Node.js的net模块实现一个命令行聊天室,就必须先了解NET模块的API使用.NET模块API分为两大类:Server和Socket类.工厂方法. Server类 ...

  3. Node.js:进程、子进程与cluster多核处理模块

    1.process对象 process对象就是处理与进程相关信息的全局对象,不需要require引用,且是EventEmitter的实例. 获取进程信息 process对象提供了很多的API来获取当前 ...

  4. Node.js:理解stream

    Stream在node.js中是一个抽象的接口,基于EventEmitter,也是一种Buffer的高级封装,用来处理流数据.流模块便是提供各种API让我们可以很简单的使用Stream. 流分为四种类 ...

  5. Node.js:Buffer浅谈

    Javascript在客户端对于unicode编码的数据操作支持非常友好,但是对二进制数据的处理就不尽人意.Node.js为了能够处理二进制数据或非unicode编码的数据,便设计了Buffer类,该 ...

  6. node.js学习(二)--Node.js控制台(REPL)&&Node.js的基础和语法

    1.1.2 Node.js控制台(REPL) Node.js也有自己的虚拟的运行环境:REPL. 我们可以使用它来执行任何的Node.js或者javascript代码.还可以引入模块和使用文件系统. ...

  7. Node.js npm 详解

    一.npm简介 安装npm请阅读我之前的文章Hello Node中npm安装那一部分,不过只介绍了linux平台,如果是其它平台,有前辈写了更加详细的介绍. npm的全称:Node Package M ...

  8. Node.js入门(一)

    一.Node.js本质上是js的运行环境. 二.可以解析js代码(没有浏览器安全级的限制): 提供系统级的API:1.文件的读写 2.进程的管理 3.网络通信 三.可以关注的四个网站: 1.https ...

  9. Node.js学习笔记——Node.js开发Web后台服务

    一.简介 Node.js 是一个基于Google Chrome V8 引擎的 JavaScript 运行环境.Node.js 使用了一个事件驱动.非阻塞式 I/O 的模型,使其轻量又高效.Node.j ...

  10. Node.js入门

    开始之前,安利一本正在看的书<站在两个世界的边缘>,作者程浩,上帝丢给他太多理想,却忘了给他完成理想的时间.OK,有兴趣的可以看一看. node.js如标题一样,我也是刚开始接触,大家一起 ...

随机推荐

  1. iOS:OC Lib:MagicalRecord

    # MagicalRecord 2.1 ## 前言 CoreData是iOS开发中经常使用的数据持久化的技术.但其操作过程稍微繁琐,即使你只是实现简单的存取,不涉及请求优化,也要进行许多配置工作,代码 ...

  2. Win7版IE10浏览器正式版官方下载地址

    • 简体中文,Win7 SP1 32位版IE10下载: http://download.microsoft.com/download/4/1/4/4149BFB1-AC27-401D-943F-DA1 ...

  3. android 透明度颜色值

    100% — FF99% — FC98% — FA97% — F796% — F595% — F294% — F093% — ED92% — EB91% — E890% — E689% — E388% ...

  4. 关于 c# 操作 world

    把数据存放在datatable 中并循环取出来数据然后再保存在world中 protected void ExportToWord(DataSet Ads) { try { Object Nothin ...

  5. .NET Core:面向未来的开源跨平台开发技术

    作为一种全新的开源和跨平台的开发平台,.NET Core 历经两年多的开发,终于在于2016年6月27日针对所有主流服务器和桌面操作系统发布 1.0 RTM 版本..NET Core 是一种通用开发平 ...

  6. ch5 MySQL 备份与恢复

    第 5 章 MySQL 备份与恢复 前言 数据库的备份与恢复一直都是 DBA 工作中最为重要的部分之一,也是基本工作之一.任何正式环境的数据库都必须有完整的备份计划和恢复测试,本章内容将主要介绍 My ...

  7. 使用SQL Server 2014 In-Memory 内存数据库时需要注意的地方

    转载: http://www.infoq.com/cn/articles/sql-server-2014-memory-database http://www.cnblogs.com/Amaranth ...

  8. js 当前日期增加自然月

    js 在日期不满足的情况下就会自动加1个月,比如在当前时间为3月31号,传入1,1两个参数,预期结果为2月29日,但是结果输出了3月2日.就是如果不满就会溢出到下个月,后来看了api发现了setMon ...

  9. Hbase0.98.4/Hadoop2.4.1整合小结【原创】

    设定hbase的数据目录,修改conf/hbase-site.xml <configuration> <property> <name>hbase.cluster. ...

  10. Multipart/form-data POST文件上传详解

    Multipart/form-data POST文件上传详解 理论 简单的HTTP POST 大家通过HTTP向服务器发送POST请求提交数据,都是通过form表单提交的,代码如下: <form ...