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

相关推荐
JienDa20 分钟前
JienDa聊PHP:算命平台实战中主流PHP框架的协同架构方略
开发语言·架构·php
爱写代码的小朋友39 分钟前
21天学通Python全栈开发实战指南
开发语言·python
苦荞米39 分钟前
异步方法-C#中坑最大最深的功能
开发语言·c#
软件测试曦曦43 分钟前
使用Python接口自动化测试post请求和get请求,获取请求返回值
开发语言·自动化测试·软件测试·python·功能测试·程序人生·职场和发展
p***s911 小时前
Windows安装Rust环境(详细教程)
开发语言·windows·rust
慧慧吖@1 小时前
关于在本地去模拟生产环境检测页面内容注意事项
前端·javascript·vue.js
卡比巴拉—林1 小时前
Python print()函数详讲
开发语言·python
黄团团1 小时前
Vue2整合Electron开发桌面级应用以及打包发布(提供Gitee源码)
前端·javascript·vue.js·elementui·electron
奶思图米球1 小时前
Python多环境管理
开发语言·python
JienDa1 小时前
JienDa聊PHP:基于协同架构的PHP主流框架优势整合与劣势补救策略
开发语言·架构·php