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

相关推荐
多加点辣也没关系12 小时前
JavaScript|第4章:类型转换
开发语言·javascript
聪慧的水蜜桃12 小时前
【YFIOs】用C#开发硬件之设备上云
开发语言·c#
yqcoder12 小时前
httpOnly 是什么,又有什么用?
开发语言·前端·javascript
烬羽13 小时前
还在手动拼路径、写回调地狱?一文吃透 Node.js 的 path 和 fs
javascript·程序员·node.js
mONESY13 小时前
LangChain JS 高性能并行执行解析、工具调用底层封装
javascript
wuqingshun31415913 小时前
重写equals而不重写hashCode,会出什么问题?
java·开发语言
飞猪~13 小时前
LangChain python 版本 第一集
开发语言·python·langchain
迅速的自行车14 小时前
从一段模板说起
前端·javascript·vue.js
YIAN14 小时前
LangChain JS 工具调用实战:基于 DeepSeek-V4-Flash 实现本地文件读取 AI 代码助手(完整可运行源码)
javascript·langchain·前端框架
尼斯湖皮皮怪14 小时前
iceCoder 记忆系统深度分析
前端·javascript