您当前的位置:首页 > 互联网教程

javascript中函数this的问题

发布时间:2025-05-23 07:15:28    发布人:远客网络

javascript中函数this的问题

一、javascript中函数this的问题

1、js有点特殊。不但要看上下文,还要看谁调用的,怎么调用。

2、因为js是动态语言,既有面向对象特性,又有函数式特性。它可以将一个object属性和方法随时修改,同时声明的出的类本身不但是类,可以被继承和实例化,而且就是一个对象,特别是还有prototype这个属性,比较复杂。

3、建议你百度一下 js中this的用法,

4、首先写在html标签中传入的this是指html元素,比如

5、对应处理函数function fa(object){}

6、如果这个函数里还有this,就是指window对象。

7、(所有声明的函数默认是绑定在window对象上的,而window对象可以省略。)

8、如function fa(object){this.x=1}

9、等同于自动绑定:window.fa=function(object){this.x=1}

10、但如果这个函数是绑定在另外一个对象上的,比如

二、JS基础系列-聊聊this

面向对象编程中,我们经常要和this打交道。而对于函数中this到底指向哪里,对刚开始接触JavaScript的我们,经常会分不清楚。

我们必须明确的是函数中this的指向不是固定的,和函数执行时的环境有关,简单的说,我们可以理解函数中this指向的是当前调用该函数的对象,所以我们也针对以下几种情况来消化下这种说话。

在浏览器时执行该代码时,打印出来的都是window对象。

因为作为函数调用时,默认是被认为在全局对象中调用该函数(nodejs环境中是global对象)注:不是在当前函数所处的作用域对象

有一点需要注意的是,箭头函数(我们等等再特殊讲下)

代码执行时,答应出来的是obj对象,name值是obj,这是满足我们的预期:函数目前就是作为obj的方法被调用,所以调用该函数的对象是obj。

这种情况我们很容易消化,但是换了一种情况就另当别论,如

这个时候打印出来的window对象,name值是test[what][what]

原来这个时候fn指向的是一个函数(不是指向 obj执行logThis这个行为),fn调用就是调用一个函数,也就是第一种情况,所以上面的例子就如下:

这个时候打印出来的是我们新生成的people对象。

因为构造函数执行的过程我们可以简单理解为

2、该对象原型对象指向构造函数的prototype对象(People.prototype)

3、通过新生成的对象调用构造函数(可以简单理解为People.call(this))

这个时候打印的我们可能因为都是window对象,然而结果打脸了,第一个打印的是window对象,第二个打印的是obj对象[发怒]

原来箭头函数,不会生成新的this指向,箭头函数在哪个环境执行,指向的就是当前环境的this对象,也就是第二种情况下,this指向的obj.logThis()执行时的this指向(前面我们提到的是obj对象)

this的指针默认指向就是上面提到的4种,但是总有需求,我们想要自定义this指向,这个时候apply,call,bind这3个方法就排的上用场

这三个方法都是函数对象自身的方法,第一个参数支持传入的是函数调用时设置的this对象,如

这个时候第一个打印的是window对象(看1说明),第二个打印的是obj对象(我们通过传参的方法明确说明函数执行是的this对象是obj)

三、js-改变this指向的几种方法

javaScript为我们专门提供了一些函数方法来帮我们更优雅的处理函数内部 this的指向问题,常用的有 bind()、call()、apply()三种方法

call()方法调用一个对象。简单理解为调用函数的方式,但是它可以改变函数的 this指向。

fun.call(thisArg, arg1, arg2,...)

thisArg:在 fun函数运行时指定的 this值

返回值就是函数的返回值,因为它就是调用函数

因此当我们想改变 this指向,同时想调用这个函数的时候,可以使用 call,比如继承

fun.apply(thisArg, [argsArray])

thisArg:在fun函数运行时指定的 this值

argsArray:传递的值,必须包含在数组里面

apply主要跟数组有关系,比如使用 Math.max()求数组的最大值

bind()方法不会调用函数。但是能改变函数内部this指向

fun.bind(thisArg, arg1, arg2,...)

thisArg:在 fun函数运行时指定的 this值

返回由指定的 this值和初始化参数改造的原函数拷贝

因此当我们只是想改变 this指向,并且不想调用这个函数的时候,可以使用 bind

1.call和 apply会调用函数,并且改变函数内部this指向.

2.call和 apply传递的参数不一样, call传递参数 aru1, aru2..形式 apply必须数组形式[arg]

3.bind不会调用函数,可以改变函数内部this指向.

2.apply经常跟数组有关系.比如借助于数学对象实现数组最大值最小值

3.bind不调用函数,但是还想改变this指向.比如改变定时器内部的this指向。