当前位置: 首页 > news >正文

this指向

(1)在全局环境中的this——window
无论是否在严格模式下,在全局执行环境中(在任何函数体外部)this 都指向全局对象。

      "use strict"console.log(this); //windowconsole.log(this===window);//true

(2)在函数中的this——window
在函数内部,this的值取决于函数被调用的方式。   

     function f() {console.log(this); //windowconsole.log(this===window);//true}f()console.log(f()===window.f()); //true

因为定义的函数在全局作用域下定义的 

(3)函数在严格模式下——undefined

 function f() {"use strict"console.log(this); //undefinedconsole.log(this === window); //false}f()

上面的f是直接调用的指向undefined 

      function f() {"use strict"console.log(this); //windowconsole.log(this === window); //true}window.f()

有一些浏览器最初在支持严格模式时没有正确实现这个功能,于是它们错误地返回了window对象。

 (4)对象中的this——指向调用者

    let obj = {fn: function () {console.log(this);}}obj.fn() //指向obj这个对象


(5)栗子①

    function fun() {console.log(this.name);}let obj = {name: '思思',fn: fun}var name = "七七"obj.fn()  //思思fun()    //七七

obj.fn() 是obj 调用的所以去找obj里面的name 

fun是window调用的所以去找全局里面的this.name

(6)栗子②

    var obj1 = {name: '七七',f: function () {console.log('姓名:' + this.name);}}var obj2 = {name: '思思'}obj2.f = obj1.fobj1.f() //姓名:七七obj2.f() //姓名:思思

把obj1.赋值给obj2.f  obj2也有了f 方法 

(7)栗子③

      function foo() {console.log(this.a);}var obj2 = {a:2,fn:foo}var obj1={a:1,o1:obj2}obj1.o1.fn() //2

 obj1里面的o1是obj2  obj2里的fn是foo函数   在obj2里面调用的拿到obj2中的a

(8)事件绑定中的this 

 <button onclick="Hclick()">点击事件</button>
<script>function Hclick() {console.log(this);}
</script>

 由于还是在当前window环境下运行的还是指向window

  <button onclick="console.log(this)">点击事件</button>

运行在节点对象中 指向当前dom

(9)动态绑定

<button>动态绑定</button>
<script>let btn=  document.getElementsByTagName('button')[0].onclick=function(){console.log(this);    }
</script>

指向当前dom

(10)addEventlistenr——当前dom

     let btn = document.getElementsByTagName('button')[0].addEventListener('click',function () { console.log(this); })

指向当前dom <button>动态绑定</button>   

    let btn = document.getElementsByTagName('button')[0].addEventListener('click',()=>{console.log(this);})

换成箭头函数后 this指向当前作用域下的上级作用域的this    window 

(11)构造函数中的this——当前实例化对象

   function Pro() { this.x='1'this.y=function(){ console.log(this);}}var p = new Pro()p.y()

通过构造函数创建了一个新的实例对象  所以当前的this指向新的实例对象

(12)定时器中的this——window  

   setInterval(function () {console.log(this)  },1000)

this指向当前window

小扩展

       var MyClass = function () {this.name = 1;}var myClass = new MyClass();console.log('myClass:', myClass);

当有了返回值以后

        var MyClass = function () {this.name = 1;return {name: 2}}var myClass = new MyClass();console.log('myClass:', myClass);

会把return的内容放在构造函数中 
 

相关文章:

this指向

&#xff08;1&#xff09;在全局环境中的this——window 无论是否在严格模式下&#xff0c;在全局执行环境中&#xff08;在任何函数体外部&#xff09;this 都指向全局对象。 "use strict"console.log(this); //windowconsole.log(thiswindow);//true &#xff08…...

安卓小游戏:小板弹球

安卓小游戏&#xff1a;小板弹球 前言 这个是通过自定义View实现小游戏的第三篇&#xff0c;是小时候玩的那种五块钱的游戏机上的&#xff0c;和俄罗斯方块很像&#xff0c;小时候觉得很有意思&#xff0c;就模仿了一下。 需求 这里的逻辑就是板能把球弹起来&#xff0c;球…...

7、单行函数

文章目录1 函数的理解1.1 什么是函数1.2 不同DBMS函数的差异1.3 MySQL的内置函数及分类2 数值函数2.1 基本函数2.2 角度与弧度互换函数2.3 三角函数2.4 指数与对数2.5 进制间的转换3 字符串函数4 日期和时间函数4.1 获取日期、时间4.2 日期与时间戳的转换4.3 获取月份、星期、星…...

华为机试题:HJ56 完全数计算(python)

文章目录博主精品专栏导航知识点详解1、input()&#xff1a;获取控制台&#xff08;任意形式&#xff09;的输入。输出均为字符串类型。1.1、input() 与 list(input()) 的区别、及其相互转换方法2、print() &#xff1a;打印输出。3、整型int() &#xff1a;将指定进制&#xf…...

opencv——傅里叶变换、低通与高通滤波及直方图等操作

1、傅里叶变换a、傅里叶变换原理时域分析&#xff1a;以时间为参照进行分析。频域分析&#xff1a;相当于上帝视角一样&#xff0c;看事物层次更高&#xff0c;时域的运动在频域来看就是静止的。eg&#xff1a;投球——时域分析&#xff1a;第1分钟投了3分&#xff0c;第2分钟投…...

【NGINX入门指北】 进阶篇

nginx 进阶篇 文章目录nginx 进阶篇一、Nginx Proxy 服务器1、代理原理2、proxy代理3、proxy缓存一、Nginx Proxy 服务器 1、代理原理 正向代理 内网客户机通过代理访问互联网&#xff0c;通常要设置代理服务器地址和端口。 反向代理 外网用户通过代理访问内网服务器&…...

Python中关于@修饰符、yeild关键词、next()函数的基本功能简述

关于修饰符&#xff1a;其实就是将修饰符下面的函数当成参数传给它上面的函数。 def a(x):print(a)adef b():print(b) 其效果等价为&#xff1a; def a(x):print(a)def b():print(b)a(b())有个记忆诀窍&#xff0c;的下面哪个函数最近&#xff0c;谁就是儿子&#xff0c;谁就…...

结合Coverity扫描Spring Boot项目进行Path Manipulation漏洞修复

本篇介绍使用Coverity 扫描基于Spring Boot 项目中的Path Manipulation 漏洞, 进而解决风险,并且可以通过扫描。 什么样的代码会被扫描有路径操纵风险? 在Spring Boot 项目中, 实验了如下的场景: 1. Control 中 file path 作为参数传递的会被扫描,单纯服务方法不会 场…...

【FFMPEG源码分析】从ffplay源码摸清ffmpeg框架(一)

ffplay入口 ffmpeg\fftools\ffplay.c int main(int argc, char **argv) {/*******************start 动态库加载/网络初始化等**************/int flags;VideoState *is;init_dynload();av_log_set_flags(AV_LOG_SKIP_REPEATED);parse_loglevel(argc, argv, options);/* regis…...

C++蓝桥杯 基础练习,高精度加法,输入两个整数a和b,输出这两个整数的和。a和b都不超过100位。

C蓝桥杯 基础练习&#xff0c;高精度加法 问题描述 输入两个整数a和b&#xff0c;输出这两个整数的和。a和b都不超过100位。 算法描述 由于a和b都比较大&#xff0c;所以不能直接使用语言中的标准数据类型来存储。对于这种问题&#xff0c;一般使用数组来处理。   定义一…...

MySQL面试题:SQL语句的基本语法

MySQL目录一、数据库入门1. 数据管理技术的三个阶段2. 关系型数据库与非关系型数据库3. 四大非关系型数据库a. 基于列的数据库&#xff08;column-oriented&#xff09;b. 键值对存储&#xff08;Key-Value Stores&#xff09;c. 文档存储&#xff08;Document Stores&#xff…...

Fluid-数据编排能力原理解析

前言本文对Fluid基础功能-数据编排能力进行原理解析。其中涉及到Fluid架构和k8s csi driver相关知识。建议先了解相关概念&#xff0c;为了便于理解&#xff0c;本文使用JuiceFS作为后端runtime引擎。原理概述Fuild数据编排能力&#xff0c;主要是在云原生环境中&#xff0c;能…...

并发线程、锁、ThreadLocal

并发编程并发编程Java内存模型&#xff08;JMM&#xff09;并发编程核心问题—可见性、原子性、有序性volatile关键字原子性原子类CAS(Compare-And-Swap 比较并交换)ABA问题Java中的锁乐观锁和悲观锁可重入锁读写锁分段锁自旋锁共享锁/独占锁公平锁/非公平锁偏向锁/轻量级锁/重…...

CMMI-结项管理

结项管理&#xff08;ProjectClosing Management, PCM&#xff09;是指在项目开发工作结束后&#xff0c;对项目的有形资产和无形资产进行清算&#xff1b;对项目进行综合评估&#xff1b;总结经验教训等。结项管理过程域是SPP模型的重要组成部分。本规范阐述了结项管理的规程&…...

网络通信协议是什么?

网络通信基本模式 常见的通信模式有如下2种形式&#xff1a;Client-Server(CS) 、 Browser/Server(BS) 实现网络编程关键的三要素 IP地址&#xff1a;设备在网络中的地址&#xff0c;是唯一的标识。 端口&#xff1a;应用程序在设备中唯一的标识。 协议: 数据在网络中传输的…...

阶段5:Java分布式与微服务实战

目录 第33-34周 Spring Cloud电商实战 一、Eureka-server模块开发 1、引入依赖 2、配置文件 3、启动注解 一、Eureka-server模块开发 第33-34周 Spring Cloud电商实战 一、Eureka-server模块开发 1、引入依赖 父项目依赖&#xff1a;cloud-mall-practice springboot的…...

我的创作纪念日

目录 机缘 收获 日常 憧憬 机缘 其实本来从大一上学期后半段(2017)就开始谢谢零星的博客&#xff0c;只不过当时是自己用hexo搭建了一个小网站&#xff0c;还整了个域名&#xff1a;jiayoudangdang.top&#xff0c;虽然这个早就过期&#xff1b; 后来发现了CSDN&#xff…...

Qml学习——动态加载控件

最近在学习Qml&#xff0c;但对Qml的各种用法都不太熟悉&#xff0c;总是会搞忘&#xff0c;所以写几篇文章对学习过程中的遇到的东西做一个记录。 学习参考视频&#xff1a;https://www.bilibili.com/video/BV1Ay4y1W7xd?p1&vd_source0b527ff208c63f0b1150450fd7023fd8 目…...

设计模式之职责链模式

什么是职责链模式 职责链模式是避免请求发送者与接受者耦合在一起&#xff0c;让多个对象都可以接受到请求&#xff0c;从而将这些对象连接成一条链&#xff0c;并且沿着这条链传递请求&#xff0c;直到有对象处理为止。     职责链模式包含以下几个角色&#xff1a;    …...

MySQL入门篇-MySQL 8.0 延迟复制

备注:测试数据库版本为MySQL 8.0 这个blog我们来聊聊MySQL 延迟复制 概述 MySQL的复制一般都很快&#xff0c;虽然有时候因为 网络原因、大事务等原因造成延迟&#xff0c;但是这个无法人为控制。 生产中可能会存在主库误操作&#xff0c;导致数据被删除了&#xff0c;Oracl…...

接口测试中缓存处理策略

在接口测试中&#xff0c;缓存处理策略是一个关键环节&#xff0c;直接影响测试结果的准确性和可靠性。合理的缓存处理策略能够确保测试环境的一致性&#xff0c;避免因缓存数据导致的测试偏差。以下是接口测试中常见的缓存处理策略及其详细说明&#xff1a; 一、缓存处理的核…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制&#xff0c;因此这个了16进制的数据既可以翻译成为这个机器码&#xff0c;也可以翻译成为这个国标码&#xff0c;所以这个时候很容易会出现这个歧义的情况&#xff1b; 因此&#xff0c;我们的这个国…...

css实现圆环展示百分比,根据值动态展示所占比例

代码如下 <view class""><view class"circle-chart"><view v-if"!!num" class"pie-item" :style"{background: conic-gradient(var(--one-color) 0%,#E9E6F1 ${num}%),}"></view><view v-else …...

[ICLR 2022]How Much Can CLIP Benefit Vision-and-Language Tasks?

论文网址&#xff1a;pdf 英文是纯手打的&#xff01;论文原文的summarizing and paraphrasing。可能会出现难以避免的拼写错误和语法错误&#xff0c;若有发现欢迎评论指正&#xff01;文章偏向于笔记&#xff0c;谨慎食用 目录 1. 心得 2. 论文逐段精读 2.1. Abstract 2…...

如何在看板中有效管理突发紧急任务

在看板中有效管理突发紧急任务需要&#xff1a;设立专门的紧急任务通道、重新调整任务优先级、保持适度的WIP&#xff08;Work-in-Progress&#xff09;弹性、优化任务处理流程、提高团队应对突发情况的敏捷性。其中&#xff0c;设立专门的紧急任务通道尤为重要&#xff0c;这能…...

srs linux

下载编译运行 git clone https:///ossrs/srs.git ./configure --h265on make 编译完成后即可启动SRS # 启动 ./objs/srs -c conf/srs.conf # 查看日志 tail -n 30 -f ./objs/srs.log 开放端口 默认RTMP接收推流端口是1935&#xff0c;SRS管理页面端口是8080&#xff0c;可…...

新能源汽车智慧充电桩管理方案:新能源充电桩散热问题及消防安全监管方案

随着新能源汽车的快速普及&#xff0c;充电桩作为核心配套设施&#xff0c;其安全性与可靠性备受关注。然而&#xff0c;在高温、高负荷运行环境下&#xff0c;充电桩的散热问题与消防安全隐患日益凸显&#xff0c;成为制约行业发展的关键瓶颈。 如何通过智慧化管理手段优化散…...

unix/linux,sudo,其发展历程详细时间线、由来、历史背景

sudo 的诞生和演化,本身就是一部 Unix/Linux 系统管理哲学变迁的微缩史。来,让我们拨开时间的迷雾,一同探寻 sudo 那波澜壮阔(也颇为实用主义)的发展历程。 历史背景:su的时代与困境 ( 20 世纪 70 年代 - 80 年代初) 在 sudo 出现之前,Unix 系统管理员和需要特权操作的…...

LangChain知识库管理后端接口:数据库操作详解—— 构建本地知识库系统的基础《二》

这段 Python 代码是一个完整的 知识库数据库操作模块&#xff0c;用于对本地知识库系统中的知识库进行增删改查&#xff08;CRUD&#xff09;操作。它基于 SQLAlchemy ORM 框架 和一个自定义的装饰器 with_session 实现数据库会话管理。 &#x1f4d8; 一、整体功能概述 该模块…...

免费PDF转图片工具

免费PDF转图片工具 一款简单易用的PDF转图片工具&#xff0c;可以将PDF文件快速转换为高质量PNG图片。无需安装复杂的软件&#xff0c;也不需要在线上传文件&#xff0c;保护您的隐私。 工具截图 主要特点 &#x1f680; 快速转换&#xff1a;本地转换&#xff0c;无需等待上…...