`

关于javascript里面的this关键字的意义

 
阅读更多

本文是翻译的繁体文章,而且还不完整,尽量读原文吧:https://software.intel.com/zh-cn/blogs/2013/10/09/javascript-this

 

注意:搞过java,c#和c++的人千万不能照搬以前的知识

this是执行上下文的一个属性,而不是变量对象的一个属性或者说是代表类的当前实例。再白话一点,看调用的上下文环境是什么才能决定this在执行的那一刻到底代表什么。

 

一、this指向调用该函数的对象

语法:

对象.方法名(); //这种情况下函数或者方法内的this代表这个对象

 

示例:

var obj = {
    x: 20,
    f: function(){ console.log(this.x); }
};

obj.f(); //调用f函数的时候,点前面的对象是obj,因此f函数内的this指向obj,输出结果是20

obj.innerobj = {
    x: 30,
    f: function(){ console.log(this.x); }
}

obj.innerobj.f(); //由于调用f函数时,点前面的对象是obj.innerobj,因此f函数内的this指向innerobj,输出结果是30

 

二、this指向全局对象

语法:

函数名称([参数]);//函数内的this关键字指向默认浏览器的window对象

 

示例:

var x = 10;
var f = function(){
    console.log(this.x);
};

f(); //由于调用f函数时,没有指明[对象.]的形式,因此f函数内的this在执行时指向全局对象,即window,因此输出10

 

深入理解示例1:

var x = 10;
var obj = {
    x: 20,
    f: function(){
        console.log(this.x);
        var foo = function(){ console.log(this.x); }
        foo(); // (2)
    }
};

obj.f();  // (1)

 

如果你认为上面的代码应该输出20,20的话就还是没有转换为js的思考方式考虑问题(还是java的思路呢),记住是谁调用或者说谁执行就是谁的,(1)位置的代码是obj.f()调用的,第一次的console.log(this.x)的时候this就是obj,因此输出20,第二次的(2)位置的代码是没有指明调用对象是谁,就是直接用foo()调用的,属于全局对象调用方式,则foo函数里面的this.x指向window.x,所以输出10。

要是想输出20,20应该怎么写呢?得把指向obj的this存起来,然后在后面的代码里面去使用,示例如下:

var x = 10;
var obj = {
    x: 20,
    f: function(){
        console.log(this.x);
        var me=this;
        var foo = function(){ console.log(me.x); }
        foo(); // (2)
    }
};

obj.f();  // (1)

 

另外一个示例:

var x = 10;
var obj = {
    x: 20,
    f: function(){ console.log(this.x); }
};

obj.f(); // (1)

var fOut = obj.f;
fOut(); //(2)

var obj2 = {
    x: 30,
    f: obj.f
}

obj2.f(); // (3)

 

(1)位置的代码是obj.去调用的,所以执行的时候this代表obj,输出20

(2)位置的代码是全局调用的方式,没有指明是哪个对象,那么执行的时候this指向window,输出10

(3)位置的代码是obj2.去调用的,执行的时候this代表obj2,输出30

 

 

分享到:
评论

相关推荐

    JavaScript中this关键字使用方法详解

    在JavaScript编程语言中,`this`关键字是一个至关重要的概念,它常常引发初学者的困惑,因为它的值在不同的上下文中可能会有所不同。`this`关键字主要用来引用对象的上下文,或者说是当前执行环境中的对象。在本文中...

    跟我学习javascript的this关键字

    在JavaScript中,`this`关键字是一个经常被讨论的话题,因为它在不同的上下文中具有不同的含义。`this`关键字是动态绑定的,也称为运行期绑定,这意味着它会根据函数调用的方式和所在的上下文来改变其指向。这种动态...

    深入理解JavaScript中的this关键字

    JavaScript中的`this`关键字是编程过程中经常会遇到的一个关键概念,尤其在面向对象编程中起着至关重要的作用。`this`的值取决于它被调用时的上下文,而不是定义时的位置,这使得它有时会显得有些复杂。在这个深入...

    精通JavaScript的this关键字_.docx

    JavaScript中的`this`关键字是一个非常重要的概念,它在编程中起着至关重要的作用,尤其是在对象方法的上下文中。`this`关键字的用法类似于自然语言中的代词,它用来引用当前执行上下文的对象,帮助开发者避免命名...

    PPK 谈 JavaScript 的 this 关键字 [翻译]

    JavaScript的 this 总指向所运行的函数“自己本身”。也就是说,它是一种指向函数对象的方法。在页面中定义 doSomething() 函数,自己本身是指页面。也就是说,是指 JavaScript 的 window 对象(全局对象)。而 ...

    详解JavaScript中this关键字的用法_.docx

    在JavaScript中,`this`关键字是一个非常重要的概念,它指的是当前执行上下文中的对象。`this`的值取决于函数的调用方式,而不是定义方式。下面我们将详细探讨在不同场景下`this`的用法。 1. **全局作用域中调用...

    关于javascript中this关键字(翻译+自我理解)

    首先,让我们了解JavaScript中的this关键字。在JavaScript中,this的指向不像其他一些面向对象的编程语言中那样固定,而是依赖于函数的调用方式。在传统的面向对象语言中,this关键字通常指代当前对象,但在...

    图解JavaScript中的this关键字

    其中JavaScript 中的 this 关键字,就是一个比较容易混乱的概念,在不同的场景下,this会化身不同的对象。有一种观点认为,只有正确掌握了 JavaScript 中的 this 关键字,才算是迈入了 JavaScript 这门语言的门槛。...

    如何使用Javascript中的this关键字

    在JavaScript中,`this`关键字是一个非常重要的概念,它用于引用函数执行时的上下文对象。`this`的值取决于函数被调用的方式,而不是函数定义的位置。在不同的场景下,`this`的指向会发生变化,这使得它成为...

    深入解析JavaScript编程中的this关键字使用

    JavaScript中的`this`关键字是一个非常核心的概念,它用于在函数执行时引用当前上下文的对象。在JavaScript中,`this`的值取决于函数被调用的方式,而不是函数定义的位置。理解`this`的工作原理对于深入掌握...

    javascript的this关键字详解

    以下是关于`this`关键字的详细解释: 1. **全局环境中的this** 在全局环境中,`this`通常指向全局对象,在浏览器中这个全局对象是`window`。例如: ```javascript console.log(this === window); // true var a = ...

    关于js里的this关键字的理解

    在JavaScript编程中,`this`关键字是一个非常重要的概念,它代表着函数的上下文,即函数执行时的主体。由于JavaScript的函数是一等公民,可以作为变量传递、作为对象的属性,也可以被其它函数作为参数传递,因此`...

    js原生态函数中使用jQuery中的 $(this)无效的解决方法.docx

    在JavaScript开发中,使用jQuery的$(this)对象需要遵守JavaScript中this关键字的使用规则。通过使用变量来存储当前函数的this对象,我们可以正确地使用$(this)对象。在开发中,我们需要注意this关键字的使用规则,以...

    javascript中的关键字

    - **上下文敏感**:某些关键字(如`class`)在不同版本的JavaScript中具有不同的意义或被保留为未来使用。 了解JavaScript的关键字对于编程至关重要,可以帮助开发者避免错误地使用这些关键字作为变量名或其他...

    Javascript之this关键字深入解析

    首先,我先抛出一个定论:”在Javascript中,This关键字永远都指向函数(方法)的所有者”。 函数 代码如下:function introduce() { alert(“Hello, I am Laruence\r\n”);}对于这个函数,this关键字指向谁呢...

Global site tag (gtag.js) - Google Analytics