JavaScript-this指向问题
this指向
1.script中的this指向
指向:window
<script>
console.log(this)
</script>
2.全局变量,全局方法,普通函数this指向需要看调用的环境
都省略了一个 windowthis指向全局 window
window.function myFun() {
console.log(this);
}
myFun();
var fun = 2;
===> window.fun =2;
在html中调用函数-window
<button onclick="myFun()"></button>
function myFun() {
console.log(this);
}
在html中定义一个元素,js中调用,this指向元素本身
<!-- html 内容 -->
<div id="divs"></div>
function myFun() {
console.log(this);
}
divs.myFun()
3.setInterval 中的this指向
指向:window
setInterval(function() {
var a = 1
console.log(a);
console.log(this);
},1000)
相当于 ===>
window.setInterval(function() {
var a = 1
console.log(a);
console.log(this);
},1000)
4.箭头函数
指向:作用域的上一层的this
var obj = {
naem : "momo",
fun() {
setInterval( () => {
console.log(this.name);
},200)
}
}
obj.fun();
5.对象函数调用
指向:哪个函数调用就指向哪个函数
var obj = {
fun : function() {
console.log(this ,"++++++++++");
}
}
obj.fun();
6.构造函数
指向:实例化对象
function Person(){
console.log(this,"++++++")
}
var p = new Person();
console.log(p)
7.对象中的this指向
指向:这里的this指向obj(谁调用this所在的函数,那么this就指向谁。)
var obj = {
name:'张三',
fn:function(){
console.log("你好,我叫"+this.name);
}
}
8.apply()、call()以及bind() 中的this
call()—中的this指向的是第一个参数
function say(a,b) {
console.log(this,a+b);
}
say(5,2);
say.call({name : "momo",age : 18},3,5)
apply()—中的this指向的是第一个参数
function say(a,b) {
console.log(this,a+b);
}
say(5,2);
say.apply({name : "momo",age : 18},[3.5])
bind()—可以返回一个新的函数方法,this指向可以定义,第一个参数
function say(a,b) {
console.log(this,a+b);
}
say(5,2);
var sa = say.bind({name : "momo",age : 18});
sa();
var sa = say.bind({name : "momo",age : 18},10);
sa(5);
var sa = say.bind({name : "momo",age : 18},10,5);
sa();
转载请注明原文地址:https://ipadbbs.8miu.com/read-52171.html