js this

42 阅读2分钟

this

前言

之前只是浅浅的理解了this,最近在笔试中发现考this指向的不少,而我还是有一些不明确的点,因此再来细致的补一下。

this的基本原则

一个就是:

this永远指向一个对象

这个对象可能是window,调用函数的对象,等等。

而根据环境的不同,调用函数的位置的不同,this指向的对象可能不一样

this的指向

var name = "mio"
function work() {
    // console.log(this);
    console.log(this.name);
}

let obj = {
    name: "huizai",
    fun: work
}


obj.fun()

work()

// 浏览器下是: 
//    huizai
//    mio

// 而node环境下是:
//    huizai
//    underfined

这里浏览器环境 下全局对象是window,而node环境下是global,上面的案例如果把var name ="mio"改成let nam="mio"在浏览器内同样是读取不到mio的。

但是这个案例主要是说明不同的对象执行函数,this是不一样的。且一定是最后一个调用函数的对象是this的指向,比如链式调用就看最后是哪一个对象调用了函数。

其他特殊情况:

  1. 如果是node.onclick=(this...)这种形式的事件,this指向node,其他事件一般指向window。
  2. 构造函数,会将构造函数内的this指向创造的对象,返回执行代码
  3. 延时函数:setInterval('obj.fun()',1000);setInterval(obj.fun(),1000);不一样,前者是传入代码,到时候还是obj调用fun,而后者将函数传入,1s之后由window执行函数。
  4. call,apply将函数的this指向传入的对象,他们两个的区别就是对象后面的参数不同,call是...rest,apply是一个数组,以及bind,bind单次使用和call一样,但是bind可以多次传参。这是因为bind会返回一个函数,而call和apply直接执行。

总结

本次文章的难点在于--------------------------------

结语

本次的文章到这里就结束啦!♥♥♥读者大大们认为写的不错的话点个赞再走哦 ♥♥♥

每天一个知识点,每天都在进步!♥♥