面试题:说说你对 JS 中 this 指向的了解

面试题:说说你对 JS 中 this 指向的了解

JS 的代码执行环境分为严格模式和非严格模式,可以通过 use strict 打开严格模式,此时 JS 在语法检查上会更加严格。要讨论 JS 中的 this 指向问题,也要分为严格模式和非严格模式进行讨论。这里先讨论非严格模式下的 this 指向,然后再讨论严格模式下的不同之处,未谈到的地方默认与严格模式相同。

非严格模式下的 this 指向

  1. 函数独立调用:此时函数中的 this 指向全局对象(浏览器环境是 window,Node.js 环境是 globalThis

  2. 函数作为对象的方法调用:此时函数中的 this 指向该对象。

  3. 函数通过 callapply 调用callapply 方法可以用于直接调用函数,同时指定 this 和传入参数。

    如果 callapply 传入的表示 this 的参数不是对象(原始值),其会被隐式转换为对应的包装对象。

    const obj = new Object();
    fun_name.call(obj, param1, param2,...); // 调用 fun_name 函数,同时指定 this 为 obj,传入多个参数
    fun_name.call(obj, [parm1, param2, ...]); // 调用 fun_name 函数,同时指定 this 为 obj,传入一个数组参数
    
  4. 调用经 bind 生成的函数bind 方法可以生成一个新的函数,同时指定新函数的 this

    如果 bind 传入的表示 this 的参数不是对象(nullundefined),其会被隐式转换为全局对象 windowglobalThis

    const obj = new Object();
    const new_fun = fun_name.bind(obj); // 生成一个新函数,同时指定新函数中的 this
    new_fun();
    
  5. 调用 new 构造函数:此时构造函数中的 this 指向创建的新对象。

  6. 箭头函数调用:箭头函数没有自己的 this,其使用 this 时会捕获其声明位置的上下文中的 this

  7. 时间处理函数调用:此时函数中的 this 通常指向触发事件的 DOM 元素。

注意:这里的函数默认是非箭头函数。

严格模式下的 this 指向

  1. 函数独立调用: 此时 this 指向 undefined
  2. callapplybind 相关的函数调用:如果 callapplybind 传入的表示 this 的参数不是对象(nullundefined),其会仍会保持为原始值。(该是啥就是啥)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/22431.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

VRRP简介

一、VRRP 定义概念 VRRP “Virtual Router Redundancy Protocol”即虚拟路由器冗余协议。 一种将多个物理路由器组合成一个虚拟路由器的协议。为了提供网关的冗余备份,提高网络的可靠性。虚拟路由器拥有虚拟 IP 地址和虚拟 MAC 地址。虚拟信息作为终端设备访问网络…

Nextjs使用教程

一.手动创建项目 建议看这个中文网站文档,这个里面的案例配置都是手动的,也可以往下看我这个博客一步步操作 1.在目录下执行下面命令,初始化package.json文件 npm init -y2.安装react相关包以及next包 yarn add next react react-dom // 或者 npm install --save next react…

使用Python操作Redis

大家好,在当今的互联网时代,随着数据量和用户量的爆发式增长,对于数据存储和处理的需求也日益增加。Redis作为一种高性能的键值存储数据库,以其快速的读写速度、丰富的数据结构支持和灵活的应用场景而备受青睐。本文将介绍Redis数…

猫头虎分享已解决Bug || Error: ‘fetch‘ is not defined

原创作者: 猫头虎 作者微信号: Libin9iOak 作者公众号: 猫头虎技术团队 更新日期: 2024年6月6日 博主猫头虎的技术世界 🌟 欢迎来到猫头虎的博客 — 探索技术的无限可能! 专栏链接: &…

独立游戏之路 -- 上架TapTap步骤和注意事项

个人开发者游戏上架TapTap上架步骤和注意事项 一、TapTap 介绍二、独立游戏上架 TapTap 的步骤2.1 创建游戏2.2 提交游戏审核2.3 TapTap 平台上发布。 三、注意事项3.1 关于备案3.2 遵守 TapTap 的规定3.3 保证游戏质量 四、常见问题4.1 隐私政策问题4.2 先发布还是先优化&…

C语言学习--链式结构

结构体的应用: //数据结构与算法 数据结构 ---- 指的是 数据的组织形式 数组 --- 数据结构 数组特点 连续性,有序性,单一性 数据操作(访问)时的特点 -------------------…

Ubuntu24.04记录网易邮箱大师的安装

邮箱大师下载 官网自行下载,下载后文件名“mail.deb" https://dashi.163.com/ 安装发现缺少依赖 #mermaid-svg-8wqpqFSBVOPD7NGP {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-8wqpqFSBVOPD7NGP …

PIVOT函数-动态列

一、需求说明 原始表&#xff1a; select * from pathogen_pro; 将pm_name的值转成对应的列&#xff0c;效果如下 二、PIVOT函数说明 PIVOT(<聚合函数>([聚合列值]) FOR [行转列前的列名] IN([行转列后的列名1],[行转列后的列名2],[行转列后的列名3],.......[行转列后…

Julia编程11:变量作用域 Scope of Variables

There are two main types of scopes in Julia, global* scope* and local* scope*. Julia有全局变量作用域和局部变量作用域&#xff0c;函数或者一些结构体、循环体如for等是否内部是局部环境可以参照下表。 ConstructScope typeAllowed withinmodule, baremoduleglobalglo…

.Net 基于.Net8开发的一个Asp.Net Core Webapi后端框架

1.项目结构 该项目是基于.net8开发的Asp.Net Core WebApi后端服务,集成了Efcore,Autofac,Jwt,AutoMapper,Serilog,Quartz,MiniExcel等组件。该框架简单易上手&#xff0c;没有额外的学习成本; 该项目采用了多层结构设计&#xff0c;有利于解耦&#xff0c;包含公共层&#xff0…

Linux入门学习指南

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…

MySQL数据库整体知识点简述

目录 第一章&#xff1a;数据库系统概述 第二章&#xff1a;信息与数据模型 第3章 关系模型与关系规范化理论 第四章——数据库设计方法 第六-七章——MySQL存储引擎与数据库操作管理 第九章——索引 第10章——视图 第11章——MySQL存储过程与函数 第12章——MySQL 触…

【SIPMRCP】freeswitch中的transfer和bridge有什么区别

在FreeSWITCH中&#xff0c;transfer和bridge是两个用于处理通话的不同概念&#xff0c;它们之间的主要区别体现在功能和用途上。以下是关于这两个概念的清晰解释和区别&#xff1a; transfer&#xff08;转移&#xff09; 功能&#xff1a;transfer主要用于将通话从一个目标…

IIS7整合Tomcat9服务器,并搭建ASP+PHP+JSP完整运行环境

本文以Windows Vista系统为例&#xff0c;详细讲解IIS7整合Tomcat服务器&#xff0c;同时支持ASPPHPJSP三种Web动态网页技术的方法。 Vista系统自带的IIS版本为7.0&#xff0c;能安装的IE浏览器的最高版本为IE9。IE9也是Vue2前端框架支持的最低浏览器版本。 【准备工作】 去微…

【TB作品】msp430g2553单片机,读取GY-30光强,串口发送

硬件 //GY-30 //SCL–P1.4 //SDA–P1.5 //VCC–3.3V //GND–GND //ADDR–不接 部分程序 #include <msp430.h> #include "gy30.h"void Send_Byte(char data) {while (!(IFG2 & UCA0TXIFG)); // USCI_A0 TX buffer ready?UCA0TXBUF data…

蓝桥杯物联网竞赛_STM32L071_20_用printf将数据显示在OLED上

需求&#xff1a; 第十五届国赛确实有点变态&#xff0c;显示部分大概有6个所以需要大量将sprintf与OLED_ShowString配合使用才能显示相应格式的数据&#xff0c;所以我在想能不能简化一下这一部分直接用写好的printf语句将数据显示到显示屏上呢&#xff1f; 代码&#xff1a…

树--搜索二叉树

现有一棵结点数目为n的二叉树&#xff0c;采用二叉链表的形式存储。对于每个结点均有指向左右孩子的两个指针域&#xff0c;而结点为n的二叉树一共有n-1条有效分支路径。那么&#xff0c;则二叉链表中存在2n-(n-1)n1个空指针域。那么&#xff0c;这些空指针造成了空间浪费。 例…

【TB作品】msp430g2553单片机,秒表,LCD1602,Proteus仿真

功能 秒表 动图&#xff1a; 部分代码 这段代码是用C语言编写的&#xff0c;用于在基于德州仪器MSP430微控制器的平台上实现一个简易的电子秒表功能。 #include <msp430.h> #include "LCD.h"unsigned int second 0; unsigned int millisecond10…

【HarmonyOS】应用振动效果实现

一、问题背景&#xff1a; 应用在强提醒场景下&#xff0c;一般会有马达振动的效果&#xff0c;提示用户注意力的关注。 比如消息提醒&#xff0c;扫码提示&#xff0c;删除键确认提示等。 针对高定制化或者固定的振动方式&#xff0c;我们需要有不同的方案实现&#xff0c;马…

php项目加密源码

软件简介 压缩包里有多少个php就会被加密多少个PHP、php无需安装任何插件。源码全开源 如果上传的压缩包里有子文件夹&#xff08;子文件夹里的php文件也会被加密&#xff09;&#xff0c;加密后的压缩包需要先修复一下&#xff0c;步骤&#xff1a;打开压缩包 》 工具 》 修…