javascript 匿名函数中this为什么是window对象?

JavaScript07

javascript 匿名函数中this为什么是window对象?,第1张

this在面向对象的编程语言里指的是当前对象。

1、在匿名函数中,因为匿名函数不是一个对象,所以在匿名函数内的中的当前对象应该是其父对象,没有自定义的父对象只能是其根对象Window。

2、解释实例如下:

<script type="text/javascript">

window.onload=function(){

alert(this)

}

</script>

结果弹出的应该为window对象,因为此时匿名函数不是对象,只是一个实践处理函数,所以this应该为当前对象即window对象。

匿名函数的this一般都是指向window的,这个不需要分析。

《javascript高级程序设计》这本书里的匿名函数这一章也有讲到,摘抄如下:

this对象是在运行时基于函数的执行环境绑定的:在全局函数中,this等于window,而当函数被作为某个对象的方法调用时,this等于那个对象。不过,匿名函数的执行环境具有全局性,因为其this对象通常指向window。

大家都知道,我们在用Vue的时候经常要用到this,例如要在方法中访问data中的变量,例如要在调用定义在methods中的方法等等。但有时候你发现像往常一样简单的用this.xxx会报出this的undefined。这是因为在某些情况下,this并不是和普通情况下指当前组件。下面我来总结一下我用this时遇到的一些问题

在匿名函数中想使用this来调用data或methods中的变量,方法时,会报出thi为undefined。

那么怎么解决呢?

可以看到这里还是能获取这个匿名函数外层的变量的count=0,那么我们只要用一个变量把this引用起来就好

那如果我们不想定义一个引用变量,那该如何解决——我们可以用箭头函数

其实箭头函数这里的this是指外层函数的this,因为箭头函数是没有定义this,当在箭头函数内部用到this后会从他的父级作用域寻找。他父级就是query()函数,在这函数里使用this是指向当前组件的,所以这个直接在这函数里定义的箭头函数也是如此。

有些场景下我们会结合匿名函数和箭头函数,用this的时候就要非常小心了。

就像这次我在实现一个 轮询查询订单状态 的功能时就用了这样的结构:

轮询第一次的时候直接执行,一共轮询五次,随后的四次轮询采用setTimeOut三秒一次,可以看到这里实际上使用axios请求的方法是被定义在一个变量为f的匿名函数里,而axios的回调函数使用箭头函数写的。因此里就不能用this了,因为如果在这里用了this,实际上是匿名函数的this,也就是undefined了。所以一般把this是定义为匿名函数外层,然后在里面引用。

Javascript的this真的是复杂,不像Java那样明显,平时还是得多注意一下,这玩意真的就是空指针问题一样困扰Js开发者。