JS中this关键字的解释

this关键字
每一个行为发生的时候,肯定会有一个发生这个行为的主体。比如说吃饭这个方法,它是由上帝来定义的,世界上所有的人来执行。吃饭这个行为发生的时候,主体就是在吃饭的这个人,也就是要有人执行吃饭这个行为。用中文来表达就是张三吃饭或、李四吃饭,用编程语言来表达则是张三.吃饭()、李四.吃饭()。有时候我们需要在一个行为(方法)里,能确定执行这个行为的人是谁,或者说我们需要知道是那个对象执行了这个方法,更具体的说我要能知道是谁在吃饭。
在中文里有第一人称“我”,这个我放在吃饭这个行为了,就表示吃饭的那个人。张三吃饭,则张三吃饭行为中的那个我,就是张三,李四吃饭,则这个吃饭行为里的我就是李四。

操作方法

  • 01

    在编程语言里,同样也有“我”的概念,那就是this关键字。每一个定义的方法里,都会有一个this关键字,这个this关键不是由在那儿定义的来决定的,而是由谁来执行的决定的。这是判断this关键表示什么的重要原则。比如: 张三.吃饭();//这个吃饭里的this就是张三这个对象 也就是判断点(.)前面的对象是谁,那这个this就是谁。 但有的方法是直接执行的,前面没有点,就更没有执行的对象了,那this关键是谁呢?像alert方法,直接执行的,那alert方法里的this是谁呢?凡是可以象alert这样直接运行的方法,都是全局方法(全局方法叫函数),全局方法的执行,都相当于前面省略掉了window.,也就是说alert()相当于window.alert(),那这样直接运行的方法里的this关键字,肯定就是window了。

  • 02

    ²  再强调一次:方法里的this表示的是那个对象,是由谁来执行决定的。和在那儿定义的没有关系。 补充:this表示的对象,是这个方法活动的“上下文”。“上下文”是那些计算机前辈在翻译这个词的时候,脑子抽了一下,就把context翻译成这么一个中国人看不懂的新词汇了。所谓的“上下文”, 也就是表示当前的这些代码的活动范围,当前的活动(代码的执行)在那个对象上发生的意思。吃饭这个活动,是在张三这个对象上发生的,则张三是吃饭的上下文。在body里去查找所有的div元素,则body是这个查找活动的上下文。那这个this,就是这个方法运行的活动范围了。 方法里this当前这个方法运行的上下文,但上下文不仅限于this(就是个体与整体的区别)。 第二种风格的this关键字解释 this关键字 每一个方法或函数都会有一个this对象,this对象是方法(或函数)在执行时的那个环境,也可以说是这个函数在那个作用域下运行的。 说的更通俗一点:this就相当于咱们平时说话时候说的“我”,“我家”的概念。就是说当一个方法在运行的时候,它是属于谁的。它在运行的时候它的家是谁家。 this的概念比较抽象,是讲课的时候的难点也是重点。 关于this的具体表示那个对象,和函数的运行方式(或调用方式)有关。在JavaScript中一共有四种调用模式:方法调用模式(对象属性模式)、函数调用模式(就是普通的函数执行)、构造调用模式(应该叫实例上的方法模式更好)和apply调用模式。

  • 03

    一、当它为一个对象上的方法的时候,this是当前这个对象。 方法调用模式(或称:对象属性模式) 先了解一个概念:方法和函数的区别。方法和函数本质一样,形式不同而已。看下例: function fn(){alert(this)}这样就是定义了一个函数,当:fn()的时候,叫这个函数运行。同样是上面这个fn函数,如果把它赋值给一个对象的属性,就成了方法了,看下面的例子。 var obj=new Object();//先定义一个对象obj obj.objFn=fn;那现在的obj.objFn就是方法了,但其实objFn和fn指向的是同一个内存地址。但fn是直接定义的,就是函数,而objFn是obj这个对象上的一个属性,则objFn就是方法了。方法和函数本质上是一样的,只是在不同的情况下的叫法不同。 但当fn运行的时候,弹出的是window(任何函数被调用,this都表示window);而objFn运行的时候,弹出的是object,因为当它做为一个方法运行的时候,this关键字表示的是objFn这个属性所属的这个对象obj。也就是说,在这种情况下,this表示obj。 再啰嗦一遍:当函数成为一个对象的属性的值的时候,这个函数里的this指向当前这个对象(这时候函数就变成了方法)    再啰嗦第三遍:当一个函数被保存为对象的一个属性时,我们称它为一个方法。当一个方法被调用时,this被绑定到该对象。方法可以使用this去访问对象,所以它能从对象中取值或修改对象。this到对象的绑定发生在调用的时候。这个“超级”迟绑定使得函数可以对this高度复用。通过this可取得它们所属对象的上下文的方法称为公共方法。

  • 04

    二、函数调用模式当函数并非一个对象的属性时,那么它被当做一个函数来调用。此模式下this绑定到全局对象。通过在对象内将this赋值给that,可以使函数模式下调用that来访问指定对象。 (就是上面解释的函数方式)三、类的实例上的方法中的this指向当前的实例 例如: function Person(){ } Person.prototype.cry=function (){alert(this)} var rose=new Person(); rose.cry();//现在这个cry就被称做方法,这个方法里的this就表示rose这个实例。 详细的讲解,请见《面向对象和设计模式》的课堂讲解和视频 ④使用call和apply方法强制改变this关键字(附在面向对象一章的讲解里) 测试题: 题目一:var name = "The Window"; var object = { name : "My Object", getNameFunc : function(){ return function(){ return this.name; }; } }; alert(object.getNameFunc()()); //The Window 解析:object.getNameFunc后面跟了两对括号。先运行object.getNameFunc(),这个方法运行后返回了一个函数,就是这个方法里面定义的那个匿名函数,然后再让这个匿名函数运行。 可以分解成以下步骤: var fn= object.getNameFunc();//object.getNameFunc这个方法里的this是表示object这个对象,但它返回的是一个函数,返回的这个函数里的这个this则表示window了 fn();//当返回的这个函数运行的时候,this表示是window这个对象 和上一题目类似的题: function a(){ alert(this); } var arr = [1,2,3]; arr.f = a; arr.f();//会输出什么 解析:把a函数赋给arr的属性f,则f就成为arr这个对象上的方法了,它运行的时候就表示arr这个数组对象。 如果直接这样:a();  则这时候的this表示的是window这个对象

(0)

相关推荐

  • js中的map 遍历方法

    js中的map方法 1)定义:map方法是通过循环的方式一个一个项的处理原来的数组,并返回新的数组,同时,不会改变原数组的值 2)格式:array1.map(function(item, index, ...

  • iOS7在Safari网页中查找关键字的小技巧

    iOS7的Safari与旧版相比,界面和操作上都有很大不同。特别是直接在网页中搜索单词和查找关键字,在iOS7中轻微的改变也容易让人一头雾水。今天小编就向大家着重介绍在Safari网页中查找关键字的小 ...

  • Android Studio代码中的关键字怎么设置颜色?

    工欲善其事必先利其器,在使用Android Studio开发安卓程序时,首先要将Android Studio的各种环境配置好,配置成我们喜欢的风格,这样我们在开发过程中就会很顺手了.代码中的关键字在我 ...

  • 如何打开电脑版QQ中的关键字推荐表情功能

    电脑版QQ软件被很多人使用,用来聊天,传输文件等,有的用户在使用该软件时,为了增加聊天的乐趣,因此想要打开关键字推荐表情功能,但是却不知道如何打开,那么小编就来为大家介绍一下吧.具体如下:1. 第一步 ...

  • js中鼠标滑过显示内容,移出隐藏内容效果

    在做网页的时候这是经常会遇到的一个效果,鼠标滑过一个div的时候内容显示,鼠标移出div的时候内容隐藏.其实这在js中是个非常简单的效果,很好实现,下面我来给大家敲下代码看是如何一步步实现的,大家按照 ...

  • JS中 == 与 === 的区别?

    js代码中 == 与 === 的区别. 操作方法 01 今天聊聊js中 == 与 === 的区别? 02 1)."==="叫做严格运算符,"=="叫做相等运算符 ...

  • 如何在js中动态引入或加载js文件?

    一个网页加载时,js文件一般是通过html中的标签加载的,但有时也会有通过js代码动态引入js文件的需求.下面介绍具体做法. 原理 01 在js中动态引入js文件的核心原理是使用js在html界面上增 ...

  • js中substring和substr用法与区别

    javascript字符串操作获取子串的方法有好几种,本篇主要介绍substring和substr用法与区别 操作方法 01 在开始之前,先回顾下js中下标(数组元素/字符串中字符下标): 下标总是从 ...

  • javascript(js)中怎么对数组值从小到大的排序?

    在编写前端代码时经常会使用到javascript的数组,那么我们怎么来操作呢? 操作方法 01 首先创建一个js的数组,其中里面的值大小是不按顺序的: 02 接下来我们就用js的方法来进行从小到大的排 ...