js中this指向问题

一.全局环境下的this,在严格模式下,this会绑定到undified,在非严格模式下绑定到window上

function f1(){
	console.info(this)
}
function f2(){
	'use strict'
	console.info(this)
}
f1()   //输出window
f2()   //输出undified

二.上下文中调用的this,指向最后调用它的对象

const person={
	name:'Lucas',
	brother:{
		name:'Mike',
		fn:function(){
			return this.name
		}
	}
}
person.brother.fn()    ===>输出"Mike"

三.通过bind,call,apply改变this指向,三者区别bind,call传入单一参数,apply传入的是数组

const foo={
	name:'lucas',
	logName:function(){
		console.info(this.name)
	}
}
const bar={
	name:"mike"
}
console.info(foo.logName.call(bar))   //输出mike
console.info(foo.logName.bind(bar))   //输出ƒ (){console.info(this.name)}   bind不会执行相关函数体,而是返回一个新的函数
console.info(foo.logName.apply(bar))  //输出mike

四.构造函数中的this,指向new出来的对象

function foo(){
	this.bar="Lucas"
}
const instance=new foo()
console.info(instance.bar)   //指向instance,输出Lucas

五.箭头函数中的this指向.this指向由外层作用域决定.

const foo={
	fn:function(){
		setTimeout(function(){
			console.info(this)   //输出undified
		})
	}
}
console.info(foo.fn())   //输出window

六.this的优先级
1.显示绑定优先级比隐式绑定优先级要高

function foo(a){
	console.info(this.a)
}
const obj1={
	a:1,
	foo:foo
}
const obj2={
	a:2,
	foo:foo
}
obj1.foo.call(obj2)  //显示绑定,输出2
obj2.foo.call(obj1)  //显示绑定,输出1
obj1.foo()    //隐式绑定 输出1
obj2.foo()	  //隐式绑定 输出2

2.new绑定的优先级比显示的bind绑定更高

function foo4(a){
	this.a=a
}
const obj1={}
var bar1=foo4.bind(obj1)
bar1(2)
console.info(obj1.a)   //输出2
var baz=new bar1()
console.info(baz.a)   //输出undified

//注:foo4.bind(obj1)这句将this绑定为obj1,当再次作为构造函数new调用时,返回的实例已经与obj1解绑.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值