芝士蒸梨(三):JavaScript的this指向
程序员文章站
2022-06-23 12:28:29
JavaScript的this指向代码案例...
芝士蒸梨(三):JavaScript的this指向
核心:谁调用函数,this就指向谁
-
普通函数调用:
this指向window
let a = "ych";
function af( ) {
alert( this.a );
}
af( );// undefined
var b = "ych";
function bf( ) {
alert( this.b );
}
bf( );// ych
window.c = "ych";
function cf( ) {
alert( this.c );
}
cf( );// ych
-
对象函数调用:
this指向调用函数的对象
let obj1={
a:111
};
let obj2={
a:222,
fn:function(){
alert(this.a);
}
};
obj2.fn(); // 222
obj1.fn=obj2.fn; // obj1首先创建fn,再将obj2函数体传入
obj1.fn(); // 111,this指向调用者 obj1
- 构造函数调用
let Obj = function() {
this.name = 'ych';
}
let obj = new Obj();
console.log(obj.name); // ych
- 箭头函数调用
window.a = 222;
let obj={
a:111,
fn1:function(){
setTimeout(()=>{console.log(this.a)}); // this指向obj
},
fn2:function(){
setTimeout(function(){console.log(this.a)}); // this指向window
}
};
obj.fn1(); // 111
obj.fn2(); // 222
- call / apply
主要用途:改变this指向,方法借用
- call:接受参数不固定,第一个是函数体内this的指向,之后是依次传入的参数
- apply:接受两个参数,第一个是函数体内this的指向,第二个是一个集合对象
let fn=function(a,b,c){ console.log(a,b,c); }
let arr=[1,2,3];
fn.call(window, arr[0],arr[1],arr[0]); // 1 2 1
fn.call(window, arr,arr[1]); // [1,2,3] 2 undefined
fn.apply(window, arr); // 1 2 3
let obj1={
a:222
};
let obj2={
a:111,
fn:function(){
alert(this.a);
}
}
obj2.fn.call(obj1); // 222
本文地址:https://blog.csdn.net/weixin_46363226/article/details/107460583
上一篇: b站收藏夹怎么排序?b站收藏夹排序教程