本文主要是介绍javascript-this指向问题，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

this指向问题

1: 普通函数调用,this指向window

 function a() { // 严格模式下  this为undefined
     console.log(this) // window
 }
 在node.js中运行的话,this指向global全局对象
 

2: 谁调用指向谁

 let obj = {
  name: '张三',
  age: 10，
  fn3() {
      console.log(this)
  }
}

obj.fn3() // this指向obj

扩展
 let obj = {
  name: '张三',
  age: 10，
  fn3() {
      console.log(this)
  }
}
let obj1 = obj.fn3
obj1() // window ,此时this指向的是window

3. 构造函数中this指向实例化的对象

let Animal = function() {
  console.log("this",this);
}

var animal = new Animal() //Animal {}

4.箭头函数的this，捕获上下文的this

var name = '李四'
let obj2 = {
  name: '张三',
  age: 18,
  action:()=>{
    console.log("this",this.name);
  }
}
obj2.action() // 李四

5.call和apply bind 可以改变this的指向

 let obj = {
  name: '张三',
  age: 10，

}
function f3() {
    console.log(this)
}
 fn3.apply(obj) // obj // call 和 bind类似
 只不过 call 传递的参数是以逗号分隔的
 bind需要再次调用
 

6.定时器的this指向window

// 定时器中的this指向window
setTimeout(function() {
  console.log("this",this); // window
})

7. 回调的this指向window

let fn5 = function(callback) {
  callback()
}
function callback() {
  console.log("this",this); // window
}
fn5(callback)

let p = new Promise((resolve,reject)=>{
  resolve(1)
})
p.then((res)=>{
 console.log("this",this); // window
})

8 箭头函数和普通函数的区别

 1: 箭头函数的this指向上下文的this
 2: 箭头函数是函数表达式的简写，没有函数提升
 3: 箭头函数没有自己的arguments，使用rest剩余参数代替
 4: 箭头函数没有自己的原型，不可以做为构造函数
 5：箭头函数没有yield属性，也就不能做为生成器generate来使用
 6：箭头函数不可以通过call apply 和bind改变this指向

这篇关于javascript-this指向问题的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！