<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!-- this 如果没有被调用的话 是没有指向谁这一说的 -->
<button id='btn'>点我</button>
<!-- 1、this 指的是调用当前方法(函数)的那个对象,也就是说函数在谁那被调用,this就指的是谁。 -->
<script>
var oBtn = document.getElementById('btn');
// oBtn.onclick = function(){
// console.log(this); // oBtn
// }
// 很容易看出,函数是在按钮对象被点击的时候调用,所以 this 指的是 obtn
// 2 当函数里面嵌套函数的时候,嵌套的那个函数里面的this指的是window, 不要过分深究这个原因,因为这是JS的一个特性。
// oBtn.onclick = function () {
// console.log(this); // 这里还是 oBtn
// fn();
// }
// function fn(){
// console.log(this) // window
// }
// 3 、对于上述情况,当我们需要 fn 里面的 this 指向按钮的时候怎么办呢,这个时候有两种方法。
// 1) 将this作为参数传函数去
// 2) 将this保存起来赋给另一个变量
// 来看两个例子:
//---------------------------------------------------------
// 方法一
// oBtn.onclick = function () {
// console.log(this); // oBtn
// fn(this);
// }
// function fn(obj) {
// console.log(obj) // oBtn
// }
//---------------------------------------------------------
// 方法二
var _that =null;
oBtn.onclick = function () {
console.log(this); // oBtn
_that = this;
fn();
}
function fn() {
console.log(_that) // oBtn
}
</script>
</body>
</html>
js 中 this 的指向问题
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- 刚刚学习js的朋友可能和我一样,看到代码中的this总是一脸懵逼,不知道this到底指向谁。经过一段时间的了解,我...
- this的指向 1.直接调用,指向window 2.在函数里调用,指向window 3.在构造函数里用new调用,...