关于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)
相关推荐
nananaij17 分钟前
【Python进阶篇 面向对象程序设计(3) 继承】
开发语言·python·神经网络·pycharm
初遇你时动了情17 分钟前
腾讯地图 vue3 使用 封装 地图组件
javascript·vue.js·腾讯地图
dssxyz21 分钟前
uniapp打包微信小程序主包过大问题_uniapp 微信小程序时主包太大和vendor.js过大
javascript·微信小程序·uni-app
阿蒙Amon27 分钟前
为什么 12 版仍封神?《C# 高级编程》:从.NET 5 到实战架构,进阶者绕不开的必修课
开发语言·c#
无小道29 分钟前
c++-引用(包括完美转发,移动构造,万能引用)
c语言·开发语言·汇编·c++
爱莉希雅&&&37 分钟前
技术面试题,HR面试题
开发语言·学习·面试
开开心心_Every1 小时前
便捷的Office批量转PDF工具
开发语言·人工智能·r语言·pdf·c#·音视频·symfony
ohMyGod_1233 小时前
React16,17,18,19新特性更新对比
前端·javascript·react.js
@大迁世界3 小时前
第1章 React组件开发基础
前端·javascript·react.js·前端框架·ecmascript
一瓣橙子3 小时前
7.7日 实验03-Spark批处理开发(2)
开发语言·javascript·ajax