Rumah > hujung hadapan web > tutorial js > 关于this的相关问题

关于this的相关问题

jacklove
Lepaskan: 2018-05-21 13:35:29
asal
1181 orang telah melayarinya

在学习中经常遇到this问题,本篇将会讲解其相关问题。

this作为全局对象window的几种情况

作为函数调用的this

作为内部嵌套函数的this

在setTimeout、setInteval中this仍然是全局变量window

this为非全局变量的几种情况

构造函数(构造函数就是通过函数生成一个新的对象,这时this指的为这个新对象)

做为对象方法调用,如:

var obj1 = {    name: 'Byron',    fn : function(){        console.log(this);
    }
};
obj1.fn(); // obj1var fn2 = obj1.fn;
fn2();  //此时this仍然指的是全局对象window
Salin selepas log masuk

DOM对象绑定事件this代表源DOM对象(低版本IE下有bug,也指向window)

使用bind函数,绑定原函数,此时this指的是传入bind的第一个参数。如:

var obj1 = {    name: 'Byron',    fn : function(){        console.log(this);
    }
};
obj1.fn(); //obj1var fn2 = obj1.fn;
Salin selepas log masuk
fn2();  //此时this仍然指的是全局对象windowvar fn3 = obj1.fn.bind(obj1);fn3();  //此时this指的为obj1(此方法比较灵活,可利用此方法将所要传送给this 的参数指定为bind的第一个对象)
apply和call设置this,如:
fn.call(context,num1,num2...);fn.apply(context,numArray)
Salin selepas log masuk

第一个参数为this对象,不同点是call接受参数列表,apply接受参数数组。

caller,如果一个函数f是在全局作用域内被调用的,则f.caller为null,相反,如果一个函数是在另外一个函数作用域内被调用的,则f.caller指向调用它的那个函数.可以简单的理解为caller指的是他的父函数。如:

function fn(){    console.log(fn.caller); 
    function fn2(){        console.log(fn2.caller)
    }
    fn2()
}
Salin selepas log masuk
fn();
callee,当函数被调用的时候arguments.callee(匿名函数的时候很好用,可以调用自身)
var i = 1;window.onclick = function(){    console.log(1);    if(i<5){        i++;        setTimeout(arguments.callee,200);    }}
Salin selepas log masuk

本篇讲解了this的相关问题,更多相关内容请关注php中文网。

相关推荐:

JS数组、字符串及数学函数

关于JS时间对象和递归问题

一些CSS样式基础知识

Atas ialah kandungan terperinci 关于this的相关问题. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan