this 指向
定义:
=> this 是一个使用再作用域内部的关键字
=> 全局很少用, 大部分是在函数内部使用
指向:
=> 全局使用: window
=> 函数使用: **不管函数怎么定义, 不管函数在哪定义, 只看函数的调用(箭头函数除外)**
-> 普通调用(直接调用/全局调用)
+ 函数名(): this -> window
-> 对象调用
+ xxx.函数名(): this -> 点前面是谁就是谁
-> 定时器处理函数
+ setTimeout(function () {}, 0): this -> window
+ setInterval(function () {}, 0): this -> window
-> 事件处理函数
+ xxx.onclick = function () {}: this: 事件源(绑定再谁身上的事件)
+ xxx.addEventListener('', function () {}): this: 事件源
-> 自执行函数
+ (function () {})(): this -> window
示例1:普通调用
function fn() {
console.log(this)
}
fn() // 普通调用 this -> window
示例2:对象调用
function fn() {
console.log(this)
}
var obj = {
// 把 fn 存储的地址赋值给了 obj 的 f 成员
// 从现在开始 obj.f 和 全局变量 fn 指向同一个函数空间
f: fn,
name: '我是 obj 对象'
}
obj.f() // 对象调用 this -> obj
示例3:定时器调用
function fn() {
console.log(this)
}
fn() // 普通调用 this -> window
var obj = {
// 把 fn 存储的地址赋值给了 obj 的 f 成员
// 从现在开始 obj.f 和 全局变量 fn 指向同一个函数空间
f: fn,
name: '我是 obj 对象'
}
obj.f() // 对象调用 this -> obj
// 把 fn 函数当作定时器处理函数使用
setTimeout(fn, 0) // 定时器处理函数 this -> window
setTimeout(obj.f, 0) // 定时器处理函数 this -> window
示例4:事件处理函数
function fn() {
console.log(this)
}
fn() // 普通调用 this -> window
var obj = {
// 把 fn 存储的地址赋值给了 obj 的 f 成员
// 从现在开始 obj.f 和 全局变量 fn 指向同一个函数空间
f: fn,
name: '我是 obj 对象'
}
obj.f() // 对象调用 this -> obj
var div = document.querySelector('div')
// 当点击 div 的时候, 执行 obj.f 这个函数
// div.onclick = obj.f // 事件处理函数 this -> 事件源
div.addEventListener('click', obj.f) // 事件处理函数 this -> 事件源 (div)
示例5:各种复杂环境下的调用
function fn() {
console.log(this)
}
fn() // window
setTimeout(function () {
fn() // window
}, 0)
var div = document.querySelector('div')
div.onclick = function () {
function f() {
console.log(this)
}
f() // window
}
var obj = {
name: '我是 obj 对象',
fn: function () {
console.log(this)
function fun() {
console.log(this)
}
fun() // window
}
}
obj.fn() // this -> obj
//把 obj 里面 fn 成员存储的函数地址赋值给了全局变量 f
//全局变量 f 和 obj.fn 指向同一个函数空间
var f = obj.fn
f() // this -> window
原文地址:https://www.jb51.cc/wenti/3281960.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。