he scope of all functions is window.

(The reason why is you are invoking f as a function(类,全局的类) and not a method. When invoked as a function this is set to window during the execution of the target)

To circumvent that, you can do this:

A.prototype.go = function() {
var self = this;
console.log(self); //A { go=function()}
var f = function() {
console.log(self); //A { go=function()}
}; f();
}

  this would only not refer to the window when it is in the method of a class and not just a regular function. –

看一段有意思的代码,猜测一下,弹出的 this 变量会是什么?

function Menu(elem) {
alert(this);
function privateMethod() {
alert(this) // window, not menu!
} // ... call private method
privateMethod()
} new Menu(document.createElement('div'))

  

Because function f() is not called without any object reference. Try,

f.apply(this);
function Menu(elem) {
alert(this);
function privateMethod() {
alert(this) // window, not menu!
} // ... call private method
privateMethod.apply(this)
} new Menu(document.createElement('div'))

  ——---------------------------------------------------------------------------------------------------------------------------

参考 stack-overflow:

http://stackoverflow.com/questions/9674252/javascript-why-this-inside-the-private-function-refers-to-the-global-scope

http://javascript.info/tutorial/binding

JavaScript has a different concept of what the special name this refers to than most other programming languages do. There are exactly five different ways in which the value of this can be bound in the language.

The Global Scope

this;

When using this in global scope, it will simply refer to the global object.

Calling a Function

foo();

Here, this will again refer to the global object.

ES5 Note: In strict mode, the global case no longer exists. this will instead have the value of undefined in that case.

Calling a Method

test.foo();

In this example, this will refer to test.

Calling a Constructor

new foo();

A function call that is preceded by the new keyword acts as a constructor. Inside the function, thiswill refer to a newly created Object.

Explicit Setting of this

function foo(a, b, c) {}

var bar = {};
foo.apply(bar, [1, 2, 3]); // array will expand to the below
foo.call(bar, 1, 2, 3); // results in a = 1, b = 2, c = 3

When using the call or apply methods of Function.prototype, the value of this inside the called function gets explicitly set to the first argument of the corresponding function call.

As a result, in the above example the method case does not apply, and this inside of foo will be set to bar.

Note: this cannot be used to refer to the object inside of an Object literal. So var obj = {me: this} will not result in me referring to obj, since this only gets bound by one of the five listed cases.

Common Pitfalls

While most of these cases make sense, the first one is to be considered another mis-design of the language because it never has any practical use.

Foo.method = function() {
function test() {
// this is set to the global object
}
test();
}

A common misconception is that this inside of test refers to Foo; while in fact, it does not.

In order to gain access to Foo from within test, it is necessary to create a local variable inside of method which refers to Foo.

Foo.method = function() {
var that = this;
function test() {
// Use that instead of this here
}
test();
}

that is just a normal variable name, but it is commonly used for the reference to an outer this. In combination with closures, it can also be used to pass this values around.

Assigning Methods

Another thing that does not work in JavaScript is function aliasing, which is assigning a method to a variable.

var test = someObject.methodTest;
test();

Due to the first case, test now acts like a plain function call; therefore, this inside it will no longer refer to someObject.

While the late binding of this might seem like a bad idea at first, in fact, it is what makes prototypal inheritance work.

function Foo() {}
Foo.prototype.method = function() {}; function Bar() {}
Bar.prototype = Foo.prototype; new Bar().method();

When method gets called on a instance of Barthis will now refer to that very instance.

Disclaimer: Shamelessy stolen from my own resources at http://bonsaiden.github.com/JavaScript-Garden/#function.this

javascript 中的this的更多相关文章

  1. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  2. javascript中的this与函数讲解

    前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...

  3. JavaScript 中的数据类型

    Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...

  4. javascript中的操作符详解1

    好久没有写点什么了,根据博主的技术,仍然写一点javascript新手入门文章,接下来我们一起来探讨javascript的操作符. 一.前言 javascript中有许多操作符,但是许多初学者并不理解 ...

  5. 掌握javascript中的最基础数据结构-----数组

    这是一篇<数据结构与算法javascript描述>的读书笔记.主要梳理了关于数组的知识.部分内容及源码来自原作. 书中第一章介绍了如何配置javascript运行环境:javascript ...

  6. javascript中变量提升的理解

    网上找了两个经典的例子 var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); // 10 var ...

  7. 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  8. 简单分析JavaScript中的面向对象

    初学JavaScript的时候有人会认为JavaScript不是一门面向对象的语言,因为JS是没有类的概念的,但是这并不代表JavaScript没有对象的存在,而且JavaScript也提供了其它的方 ...

  9. Javascript中的valueOf与toString

    基本上,javascript中所有数据类型都拥有valueOf和toString这两个方法,null除外.它们俩解决javascript值运算与显示的问题,本文将详细介绍,有需要的朋友可以参考下. t ...

  10. 关于javascript中的this关键字

    this是非常强大的一个关键字,但是如果你不了解它,可能很难正确的使用它. 下面我解释一下如果在事件处理中使用this. 首先我们讨论一下下面这个函数中的this关联到什么. function doS ...

随机推荐

  1. perl命令+关键字

    来源: http://www.cnblogs.com/itech/archive/2012/11/01/2749666.html http://www.garybeene.com/vb/tut-per ...

  2. 我眼中的C#3.0 摘自于网络:http://www.cnblogs.com/joinger/articles/1297237.html

    每次有新技术发布时,我们总能感受到两种截然不同的情绪: 一种是恐惧和抵抗,伴随着这种情绪的还有诸如"C# 2.0用的挺好的,为什么要在C# 3.0搞到那么复杂?"或者"我 ...

  3. 初次stack-overflow 提交答案

    初次在stack-overflow上面提交答案,首先编辑器非常好用,语法检查都有, 还有付费版的,更高级,更好用,nice. 付费版:https://www.grammarly.com/upgrade ...

  4. 10款免费Bootstrap后台模板演示及下载

    自从有了类似Bootstrap这样强大的前端框架之后,无论我们是做静态页面,还是做网站主题,着实方便很多.即便有很多类似的其他国产.海外的前端框架比较,Bootstrap用户量以及功能文档还是比较大的 ...

  5. 默认系统为UEFI启动的GPT分区的WIN7(8),如何安装VHD的UEFI WIN8(7)

    默认系统为UEFI启动的GPT分区的WIN7(8),如何安装VHD的UEFI WIN8(7) 情况A:如果默认系统为UEFI启动.GPT分区的WIN7,想安装个VHD的UEFI WIN8.1 1:系统 ...

  6. 河南多校大一训练赛 G 硬币

    题目链接:http://acm.hust.edu.cn/vjudge/contest/125004#problem/G 密码:acm Description 宇航员Bob有一天来到火星上,他有收集硬币 ...

  7. 转:Jmeter 用户思考时间(User think time),定时器,和代理服务器(proxy server)

    在负载测试中需要考虑的的一个重要要素是思考时间(think time), 也就是在两次成功的访问请求之间的暂停时间. 有多种情形挥发导致延迟的发生: 用户需要时间阅读文字内容,或者填表,或者查找正确的 ...

  8. 转:loadrunner关联及web_reg_save_param方法浅析

    一.什么是关联 关联(correlation):脚本回放过程中,客户端发出请求,通过关联函数所定义的左右边界值(也就是关联规则),在服务器所响应的内容中查找,得到相应的值,已变量的形式替换录制时的静态 ...

  9. 深入理解.net多线程(一)

    多线程开发要理解的几个基本概念:进程.应用程序域.对象上下文 进程:进程是一个操作系统级别的概念,用来描述一组资源和程序运行所必需的内存分配.简单的理解,可以认为进程就是一个运行程序.对于每一个被加载 ...

  10. 2017 ZSTU寒假排位赛 #1

    题目链接:https://vjudge.net/contest/147102#overview. A题:给出一堆的点,要找出两条垂直的直线,一条与x轴呈45度.-->使得所有的点到任意一条直线的 ...