关于JS中的this指向问题

全局代码中调用this

全局代码中调用this,this都指向window对象,如果是nodejs 中this指向global

方法内部调用this

在方法内部调用this并不能马上获取this的指向,具体要看当前方法是如何调用的

|---------|------------------------------------------|----------------|
| 调用方式 | 调用示例 | this指向 |
| 通过new调用 | const obj = new Method() | this 指向obj |
| 直接调用 | function obj() { console.log(this) } | this指向window |
| 通过对象调用 | obj.fun = function() {console.log(this)} | this指向调用对象 obj |
| 通过call | fun.call(this, ...args) | 用户手动设置 |
| 通过apply | fun.apply(this, [...args]) | 用户手动设置 |
[ ]

调用示例:👇

javascript 复制代码
const User = function() {
    console.log(this) // 指向 User {}
}
const user = new User()
javascript 复制代码
function user() {
    console.log(this) // 指向 window
}
user()
javascript 复制代码
const user = {
    name: '小妹',
    age: 18,
    sayHello: function() {
        console.log(this) // 指向user 
    }
}

user.hello()
javascript 复制代码
const user = {
    name: '小妹',
    age: 18,
    sayHello: function() {
        console.log(this) // 指向window
    }
}

user.hello.call(this)
user.hello.apply(this)
相关推荐
melonbo12 分钟前
桥接模式C++
开发语言·c++·设计模式·桥接模式
羊锦磊29 分钟前
[ HTML 前端 ] 语法介绍和HBuilderX安装
java·开发语言·前端·html
春时似衿里30 分钟前
解决“Win7共享文件夹其他电脑网络无法发现共享电脑名称”的问题
开发语言·电脑·php
&白帝&35 分钟前
Uniapp 自定义头部导航栏
前端·javascript·uni-app
掘金安东尼36 分钟前
TypeScript条件类型与infer构建类型安全的fetch
前端·javascript·typescript
羊锦磊4 小时前
[ Mybatis 多表关联查询 ] resultMap
java·开发语言·数据库·mysql·mybatis
ZeroToOneDev6 小时前
Java(泛型和JUnit)
java·开发语言·笔记
许野平7 小时前
Rust:构造函数 new() 如何进行错误处理?
开发语言·后端·rust
暖木生晖7 小时前
flex-wrap子元素是否换行
javascript·css·css3·flex