JavaScript中的this指向问题

js中的this指向记住一个原则:一般情况下(箭头函数除外)this是在执行时才能确认,定义时没有办法确认。
下面这段代码会是输出什么呢?

var name = 'zhangsan';
var obj = {
    name: 'lisi',
    getName: function () {
        console.log(this.name)
    }
};
obj.getName();
obj.getName.call({name:'lili'})
var fn1 = obj.getName;
fn();

结果lisi lili zhangsan
由上我们可以看出this是在定义的时候才能确认,当然这是在一般情况下,稍后我们说在箭头函数中的情况。
1. 普通函数中

	function fn(){
		console.log(this)  //window
	}

我们可以理解成在全局作用域中执行的函数,window.fn也是返回的fn函数

2. 在定义的对象中

var obj = {
    name: 'lisi',
    getName: function () {
        console.log(this.name)
    }
};
obj.getName();

这个答案其实上面也已经给出了,此时的this指向被调用的对象obj,因此答案是lisi

3. 在call和apply中
call和apply作用是一样的,只是用法稍微不同,这里用call来举例子,call和apply强制性的改变了this的指向,传入的参数是谁,那么this就指向谁。

var obj = {
    name: 'lisi',
    getName: function () {
        console.log(this.name)
    }
};
var b = {
    name: 'xiaoxia'
};
obj.getName.call(b); 

so,答案是xiaoxia
4.在箭头函数中,this是指向定义时函数外部的对象。

function GetThis() {
    this.name = 'wuha'
    setTimeout(() => {
        console.log(this.name);

    } , 1000)
}
var a = new GetThis(); //wuha

如果是不用箭头函数,setInterval和setTimeout都是属于window对象上的方法,那么this就是指向window了,我们把上面的代码改改,在来举个例子?。

function GetThis() {
    this.name = 'wuha'
    setTimeout(function () {
        console.log(this);

    } , 1000)
}
var a = new GetThis(); //window

so,我们开头说在一般情况下,this是在执行时定义的,在箭头函数中,this是继承来至上下文的。

参考文献:http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html
参考文献:https://blog.csdn.net/xu4321083/article/details/79753800

  • 3
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值