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

相关推荐
云游云记1 分钟前
php Composer 使用全攻略
开发语言·php·composer
独自破碎E11 分钟前
LCR004-只出现一次的数字II
java·开发语言
剑锋所指,所向披靡!13 分钟前
STL之sting容器
开发语言·c++
Henry Zhu12314 分钟前
Qt Model/View架构详解(六):综合实战项目(下)
开发语言·qt·架构
Liuqz200919 分钟前
Go 安装与配置
开发语言·后端·golang
2301_7657031420 分钟前
动态库热加载技术
开发语言·c++·算法
Chan1622 分钟前
《Redis设计与实现》| 常用数据类型与AOF、RDB持久化
java·开发语言·redis·spring·面试·java-ee
KeroroLX23 分钟前
uniapp项目中使用echarts
javascript·uni-app·echarts
一条咸鱼_SaltyFish25 分钟前
零失败零超卖:一种基于Redis的强一致性热点库存扣减方案
开发语言·数据库·redis·缓存·一致性·读后感
Ulyanov42 分钟前
基于Impress.js的3D概念地图设计与实现
开发语言·前端·javascript·3d·ecmascript