关于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)
相关推荐
jiaguangqingpanda4 小时前
Day22-20260118
java·开发语言
闲蛋小超人笑嘻嘻4 小时前
Vue 插槽:从基础到进阶
前端·javascript·vue.js
摘星编程4 小时前
React Native for OpenHarmony 实战:SearchBar 搜索栏详解
javascript·react native·react.js
Ulyanov4 小时前
战场地形生成与多源数据集成
开发语言·python·算法·tkinter·pyside·pyvista·gui开发
风生u4 小时前
bpmn 的理解和元素
java·开发语言·工作流·bpmn
C+-C资深大佬4 小时前
C++数据类型
开发语言·c++·算法
ID_180079054735 小时前
日本乐天商品详情API接口的请求构造与参数说明
开发语言·python·pandas
派大鑫wink5 小时前
【Day34】Servlet 进阶:会话管理(Cookie vs Session)
java·开发语言·学习方法
猫天意5 小时前
【深度学习小课堂】| torch | 升维打击还是原位拼接?深度解码 PyTorch 中 stack 与 cat 的几何奥义
开发语言·人工智能·pytorch·深度学习·神经网络·yolo·机器学习
crossaspeed5 小时前
Java-线程池(八股)
java·开发语言