js中this的六种模式

this的指向取决于函数调用方式,共六种绑定模式:1. 全局环境中this指向window(浏览器)或global(Node.js);2. 独立调用时非严格模式指向全局对象,严格模式为undefined;3. 作为对象方法调用时this指向调用者;4. 构造函数中this指向新创建的实例;5. 显式绑定通过call、apply、bind指定this值;6. 箭头函数的this继承外层作用域,不可被显式改变。关键在于调用方式而非定义位置。

js中this的六种模式

在 JavaScript 中,this 的指向并不是固定不变的,它的值取决于函数是如何被调用的。理解 this 的指向是掌握 JS 核心机制的关键之一。以下是 this 的六种常见绑定模式:

1. 全局环境中的 this

在全局执行环境中(浏览器中),无论是否严格模式,this 都指向全局对象。

浏览器中,this 指向 window Node.js 环境中,this 指向 global例子:

console.log(this === window); // true(浏览器中)

2. 函数独立调用

当一个普通函数被直接调用时,this 的指向取决于是否启用严格模式。

非严格模式下:this 指向全局对象(window) 严格模式下(use strict):this 为 undefined例子:

function foo() {  console.log(this);}foo(); // 非严格模式:window;严格模式:undefined

3. 对象方法中的 this

当函数作为对象的方法被调用时,this 指向该对象。

谁调用了方法,this 就指向谁例子:

const obj = {  name: 'Alice',  greet() {    console.log(this.name);  }};obj.greet(); // 输出 'Alice',this 指向 obj

4. 构造函数中的 this

使用 new 调用函数时,this 指向新创建的实例对象。

构造函数内部的 this 代表即将创建的新对象 new 操作会创建一个新对象并将其绑定到 this例子:

function Person(name) {  this.name = name;}const p = new Person('Bob');console.log(p.name); // 'Bob'

5. 显式绑定(call、apply、bind)

通过 call、apply 或 bind 方法可以显式指定 this 的指向。

call(arg, …args):立即调用,参数逐个传入 apply(arg, [args]):立即调用,参数为数组 bind(arg):返回新函数,this 固定为指定对象例子:

function sayHi() {  console.log(this.name);}const user = { name: 'Tom' };sayHi.call(user); // 'Tom'

6. 箭头函数中的 this

箭头函数没有自己的 this,它的 this 继承自外层作用域(词法作用域)。

不会被 call、apply、bind 改变 始终指向定义时所在上下文的 this例子:

const obj = {  name: 'Lucy',  regularFunc: function() {    const arrowFunc = () => {      console.log(this.name); // 'Lucy'    };    arrowFunc();  }};obj.regularFunc(); // 箭头函数的 this 指向外层函数的 this

基本上就这些。掌握这六种模式,能帮你准确判断 this 在各种场景下的指向。关键是看函数如何被调用,而不是如何定义。不复杂但容易忽略细节。

以上就是js中this的六种模式的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1537775.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
解决 React 输入框连续输入焦点丢失问题:优化组件渲染策略
上一篇 2025年12月21日 04:25:37
可靠的AWS SDK JS S3请求超时处理策略
下一篇 2025年12月21日 04:25:55

相关推荐

  • VSCode如何实现代码热重载 VSCode实时预览开发的高效配置方案

    使用live server扩展实现静态文件的实时预览,保存后浏览器自动刷新;2. 利用现代前端框架(如react、vue)内置的开发服务器(如vite、webpack dev server)实现hmr热模块替换,修改代码后仅更新变动模块而不刷新页面;3. 结合browsersync等工具实现多设备同…

    2026年9月24日
    000
  • 外媒测试《消逝的光芒:困兽》PC性能:运行表现相当优秀

    外媒测试《消逝的光芒:困兽》PC性能:运行表现相当优秀外媒测试《消逝的光芒:困兽》PC性能:运行表现相当优秀外媒测试《消逝的光芒:困兽》PC性能:运行表现相当优秀外媒测试《消逝的光芒:困兽》PC性能:运行表现相当优秀

    来入手《消逝的光芒:困兽》吧!现享金币优惠叠加专属优惠券折上折,标准版仅需200.9元(共节省47.1元);豪华版233.2元(总计立减54.8元)。 由Techland打造的《消逝的光芒》系列新作《消逝的光芒:困兽》已正式上线。本作背景设定在曾经风景如画、如今却尸横遍野的河狸谷。玩家将在此组建临时…

    2026年9月24日 用户投稿
    000
  • mysql临时表如何使用_PHP中操作mysql临时表的具体步骤

    MySQL临时表仅在当前会话可见,连接关闭后自动删除,适合中间数据处理。使用PHP操作时,先通过mysqli或PDO建立数据库连接,再执行CREATE TEMPORARY TABLE语句创建临时表,随后可像普通表一样进行INSERT、SELECT及JOIN等操作。临时表可与永久表同名且优先被使用,支…

    2026年9月24日
    000
  • UC浏览器怎么查看和清除LocalStorage数据 UC浏览器LocalStorage数据管理方法

    可通过隐私设置清除或开发者工具查看LocalStorage。①在UC浏览器设置中选择“隐私与安全”→“清除浏览数据”,勾选“Cookie及其他网站数据”即可批量删除LocalStorage;②打开uc://inspect启用开发者工具,通过电脑Chrome远程调试查看具体键值对;③root设备后使用…

    2026年9月24日
    200
  • Java语法基础中static关键字可以修饰哪些内容

    static关键字用于定义类成员,包括静态变量(如计数器)、静态方法(如工具方法)、静态代码块(类加载时执行)和静态内部类(不依赖外部类实例),均属于类而非对象,通过类名访问,提升成员至类级别实现共享与提前使用。 static 关键字在 Java 中主要用于定义与类相关而非与对象实例相关的成员。它不…

    2026年9月24日
    100
  • mysql中*是什么意思 mysql星号通配符解析

    在 mysql 中,星号()最常用于 select 语句中代表所有列,但应谨慎使用。1)它方便查看所有数据,但可能返回不必要的数据,影响性能。2)使用可能降低代码可维护性,建议明确列出所需列。3)在like操作符中,不是通配符,需用regexp。4)在视图中使用可能导致定义失效。5)可结合limit…

    2026年9月24日
    000
  • 抖音怎么下载视频?抖音怎么提取别人的视频

    抖音作为一个热门的短视频社交平台,凭借其多样化的短视频内容吸引了众多用户。部分用户在浏览抖音视频时,希望能将其保存下来以供后续观看。那么,如何在抖音上下载视频呢?接下来,本文将详细介绍几种下载抖音视频的方法以及相关的注意事项。 一、抖音视频下载方法 使用抖音官方提供的下载功能 抖音自身具备下载功能,…

    2026年9月24日
    400
  • google浏览器怎么把网页保存为PDF_google浏览器网页保存为PDF方法

    使用Chrome将网页保存为PDF,首先按Ctrl+P进入打印界面,选择“另存为PDF”并调整设置后保存;也可通过F12打开开发者工具,截取指定元素或完整页面截图后转为PDF;还可安装“Save as PDF”等扩展程序实现更高质量的导出。 如果您希望将当前浏览的网页完整保存以便离线查看或分享,Go…

    2026年9月24日
    000
  • windows怎么关闭cortana进程_彻底关闭小娜(cortana)后台进程的方法

    1、可通过任务管理器结束Cortana进程并禁用其启动项;2、修改注册表或组策略可永久关闭;3、重命名系统目录文件夹可阻止其运行。 如果您发现Windows系统中Cortana(小娜)后台进程占用资源或影响系统性能,可能是该服务在后台持续运行。以下是彻底关闭Cortana进程的操作步骤: 本文运行环…

    2026年9月24日
    800
  • 苹果过时产品名单更新,M5 iPad Pro 开箱视频流出

    苹果过时产品名单更新,M5 iPad Pro 开箱视频流出苹果过时产品名单更新,M5 iPad Pro 开箱视频流出苹果过时产品名单更新,M5 iPad Pro 开箱视频流出苹果过时产品名单更新,M5 iPad Pro 开箱视频流出

    日前,苹果已将 iphone 11 pro max 和 apple watch series 3 的所有型号列入“过时产品”(vintage product)行列。 根据苹果的规定,一款产品在停止销售满 5 年后,可能会被归为“过时产品”。不过,这一分类并不会显著影响售后服务——苹果仍会继续为这些设…

    2026年9月24日 用户投稿
    600
  • Java语法基础中如何导入其他包中的类

    使用import关键字可导入其他包中的类,如import java.util.ArrayList;2. 通过import java.util.*可导入整个包;3. 不导入时可用全限定名访问类,但不推荐;4. 类名冲突时需使用全限定名区分,如java.sql.Date。 在Java中使用其他包中的类,…

    2026年9月24日
    1100
  • win8键盘部分按键失灵_Win8键盘按键修复

    win8键盘部分按键失灵_Win8键盘按键修复win8键盘部分按键失灵_Win8键盘按键修复win8键盘部分按键失灵_Win8键盘按键修复win8键盘部分按键失灵_Win8键盘按键修复

    首先尝试重启键盘驱动,通过组合键或设备管理器更新/回滚驱动,检查并关闭筛选键设置,最后重启电脑以解决Windows 8键盘部分按键失灵问题。 如果您在使用Windows 8系统时遇到键盘部分按键无法输入的情况,可能是由于驱动异常、系统设置冲突或临时软件故障导致。以下是多种恢复键盘正常功能的方法。 本…

    2026年9月24日 用户投稿
    600
  • uc浏览器如何清除指定的网站数据_UC浏览器定点清除网站Cookie与缓存

    可针对特定网站清理缓存或Cookie解决UC浏览器访问异常。1、进入设置→隐私与安全→管理网站数据,搜索目标网站并清除其数据;2、使用无痕浏览模式访问网站,避免数据残留;3、通过文件管理器手动删除UC浏览器缓存目录下对应域名的缓存文件夹。 如果您在使用UC浏览器访问某些网站时遇到加载异常、登录状态失…

    2026年9月24日
    000
  • MAC系统怎么开启防火墙_MAC开启防火墙教程

    1、建议在Mac系统中开启防火墙以提升网络安全,可通过“系统设置”中的“网络-防火墙”选项启用;2、高级用户可使用终端命令sudo /usr/libexec/ApplicationFirewall/socketfilterfw –setglobalstate on开启服务;3、启用后可在…

    2026年9月24日
    100
  • VSCode的扩展设置是全局的还是局部的?

    VSCode扩展设置默认全局生效,存储于用户配置文件中,但部分扩展如ESLint、Prettier和Python支持项目级局部配置,通过在项目根目录的.vscode/settings.json文件中定义,可覆盖全局设置;在设置界面中,齿轮图标表示可被工作区覆盖,锁图标表示仅限全局修改,用户可根据需求…

    2026年9月24日
    200
  • laravel怎么配置Octane并选择Swoole或RoadRunner_laravel Octane Swoole/RoadRunner配置方法

    Laravel Octane通过Swoole或RoadRunner提升应用性能,需安装扩展包并发布配置文件;选择Swoole需安装PHP扩展并设置driver为’swoole’,启动服务时可加–watch实现热重载;选择RoadRunner则自动安装二进制文件,配…

    2026年9月24日
    100
  • 如何在iPhone8设置密码?为老款iPhone设置安全锁的完整指南

    答案:在iPhone 8上设置密码需进入“设置”→“触控 ID 与密码”→“打开密码”,并选择6位、4位、自定义数字或字母数字密码以提升安全性,推荐使用复杂密码并开启触控 ID;如需更改密码,进入相同菜单选择“更改密码”并重新输入新密码,若要关闭密码,可点击“关闭密码”但会降低安全性;若忘记密码,唯…

    2026年9月24日
    100
  • Java Map.entrySet遍历性能优化

    使用增强for循环遍历Map.entrySet()更高效,避免显式声明Iterator;提前缓存key和value减少重复调用;优先选用HashMap提升性能;大数据量可考虑parallelStream并行处理,但需权衡开销。 在Java中,Map.entrySet() 是遍历键值对最常用的方式之一…

    2026年9月24日
    100
  • win10开机后黑屏只有鼠标怎么办_win10黑屏无桌面修复方案

    首先重启Windows资源管理器,若无效则更新显卡驱动,进入安全模式禁用启动项与服务,运行sfc和DISM修复系统文件,并检查User Profile Service等关键服务状态。 如果您成功启动Windows 10系统,但桌面无法正常加载,仅显示黑色屏幕和可移动的鼠标光标,这通常是由于系统关键进…

    2026年9月24日
    600
  • 讯维解决KVM鼠标不同步

    讯维解决KVM鼠标不同步讯维解决KVM鼠标不同步讯维解决KVM鼠标不同步讯维解决KVM鼠标不同步

    使用网络kvm时,常遇到本地鼠标与远程界面光标位置不一致的问题,即鼠标不同步现象,严重影响操作流畅性。可通过优化鼠标同步设置、更新驱动程序或选用兼容性更强的设备来有效改善。 1、配置运行Windows 2000操作系统的服务器环境 2、调整鼠标相关参数 3、点击开始菜单,进入控制面板,选择“鼠标”进…

    2026年9月24日 用户投稿
    900

发表回复

登录后才能评论
关注微信