JS初步了解this

什么是环境对象?
环境对象:指的是函数内部特殊的变量this ,它代表着当前函数运行时所处的环境

作用:弄清楚this的指向,可以让我们代码更简洁
在普通函数中:

javascript 复制代码
    // 每个函数里面都有this 普通函数的this指向window
    function fun() {
        console.log(this) //指向window
    }
    // 相当于window.fun()
    fun()

如果我们使用事件呢?这个this又指向谁?

函数调用方式不同,this指代的对象也不同

javascript 复制代码
    let btn = document.querySelector("button")
    btn.onclick = function() {
        console.log(this) //指向btn按钮
    }

记住一句话: 谁调用,this就指向谁

在以前的时候,如果我们想点击按钮之后,按钮变颜色

javascript 复制代码
btn.style.color = "red"

现在我们有了this之后,我们点了谁,自己变颜色

javascript 复制代码
this.style.color = "red"


本篇文章初步的介绍了一下this,日后会写关于this的高级用法,感谢大家的阅读!

相关推荐
八解毒剂13 分钟前
【计组】中央处理器CPU
java·开发语言·计算机组成原理
FakeOccupational1 小时前
【电路笔记 信号】DBPSK 波形查找表+脉冲成形(升余弦+根升余弦滤波)
开发语言·笔记
打工仔折腾 AI1 小时前
工业场景下时序库与实时计算一体化架构选型实践对比
java·开发语言·后端·python·性能优化·架构·ai agent 实战
ZealSinger1 小时前
Java虚拟线程上线后瓶颈转移到哪看三层
java·开发语言·firefox
星栈2 小时前
pnpm 12 升级实测
前端·javascript
Ai-_Man2 小时前
您您这可以把Microsofat Copilot的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。AI导出鸭
javascript·人工智能·ai·小程序·电脑·copilot
weixin_440730503 小时前
函数return、参数、参数组、递归函数、高阶函数等小结
开发语言·python
sugarzhangnotes3 小时前
【无标题】
开发语言·人工智能·python
geovindu3 小时前
rust: Composite Pattern
开发语言·后端·设计模式·rust·组合模式
周杰偷奶茶5 小时前
【Java】数组的定义和使用(附管理系统实战案例)
java·开发语言