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的高级用法,感谢大家的阅读!

相关推荐
codeejun1 小时前
每日一Go-73、云原生成本优化 —— 资源限制 & 指标驱动扩容
开发语言·云原生·golang
888CC++1 小时前
如何在 C 语言中进行程序调试?
前端·javascript·算法
就叫_这个吧1 小时前
Java注解、元注解、自定义注解定义及应用
java·开发语言·注解
Sam_Deep_Thinking2 小时前
聊聊Java中的of
java·开发语言·架构
kyriewen3 小时前
我招了一个“Prompt工程师”来写前端,结果项目差点崩了
前端·javascript·面试
小新1104 小时前
从零开始 Vue.js
前端·javascript·vue.js
Delicate4 小时前
JavaScript的“变脸”艺术:类型转换戏法大揭秘
javascript
前端Hardy4 小时前
21.8 万周下载!这个 React 表格组件,10 行代码就能跑起来
前端·javascript·后端
陈_杨4 小时前
鸿蒙APP开发-带你走进胶片录的拍摄记录管理
前端·javascript
陈_杨4 小时前
鸿蒙APP开发-带你走进胶片录的相机控制
前端·javascript