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

相关推荐
C^h2 小时前
c++ string
开发语言·c++
raindayinrain2 小时前
c++高性能--原子操作,无锁编程,操作顺序
开发语言·c++·性能优化
学逆向的2 小时前
C++ 合并命名空间
开发语言·c++·网络安全
Zhao-Jichao2 小时前
VS2026 打包 C++ 程序生成 EXE,借助 Installer Project 扩展工具
开发语言·c++
她说可以呀3 小时前
Vue插槽
前端·javascript·vue.js
qq_448011163 小时前
Vue + Jinja2两套模版与法冲突造成undefinedError
前端·javascript·vue.js
学逆向的3 小时前
C 局部静态变量
c语言·开发语言·网络安全
大都督会赢的4 小时前
C++第一节课
开发语言·c++
“AI国潮设计-小江”4 小时前
【AIGC实战】Python+Stable Diffusion打造“英歌舞财神”IP,解锁“马到成功”等爆款情绪营销文案设计
开发语言·人工智能·python·prompt·aigc
小王C语言4 小时前
Qt常用控件:容器类控件,标题分组框、标签页(浏览器标签)
开发语言·qt