博客
关于我
javaScript函数中关于this的指向问题
阅读量:326 次
发布时间:2019-03-04

本文共 1490 字,大约阅读时间需要 4 分钟。

一、this是什么?

在编程中,特别是在JavaScript中,this是一个非常重要的概念。它是函数调用时自动创建的作用域对象,具体指向取决于函数的调用方式。默认情况下,如果没有明确指定this的值,JavaScript会将其指向全局对象window。

二、this的指向

this的指向在不同的场景下会发生变化,理解这些场景对编写高质量的JavaScript代码至关重要。以下是一些常见的情况:

  • 方法中的this:在方法中,this表示该方法所属的对象。例如:
  • var obj = {     a: 1,    b: function(){       console.log(this.a); // 1    }  };

    当调用obj.b()时,this会指向obj对象。

  • 全局函数中的this:如果你在全局作用域中定义了一个函数,且没有使用new关键字调用,那么this会指向全局对象window。例如:
  • function fn(){     console.log(this); // window  } fn();
  • 构造函数中的this:使用new关键字创建的对象,this会指向新创建的对象实例。例如:
  • function Fn(){     this.a = '123';  } var obj = new Fn();

    在这种情况下,obj是一个Fn实例,this在构造函数中指向obj。

  • 严格模式下的this:在JavaScript的严格模式下,如果没有明确指定this的值,this会被设置为undefined,而不是window。需要注意的是,严格模式是在函数的开始时使用"use strict"声明的。
  • 事件处理中的this:在事件处理中,this通常指向触发事件的元素对象。例如,在HTML事件中:
  • 当用户点击按钮时,this会指向按钮元素。

  • 函数内部的this:在函数内部,this的值会根据函数的调用方式而变化。例如,在函数fn()中,若fn()被作为方法调用,this会指向该方法所属的对象;若fn()被作为函数直接调用,this会指向全局对象window。
  • 三、this的特殊情况

    在某些情况下,this的指向可能会有所不同,需要特别注意。以下是一些常见的特殊情况:

    • 返回对象作为函数的返回值:当函数返回一个对象时,该对象会成为新的this值。例如:
    • function fn(){     return { name: '张三' };  }

      在这种情况下,调用fn()后得到的结果是一个对象,this会指向该对象。

    • 返回非对象值作为函数返回值:如果函数返回一个非对象值(如数字、字符串等),则this会指向函数的调用者。
    • 构造函数中的返回值:构造函数如果不返回任何值,或者返回一个非对象值,那么新创建的对象的this会指向该实例。如果构造函数返回一个对象,则this会指向返回的对象。例如:
    • function Fn(){     this.a = 123;    return null;  } var obj = new Fn();

      在这种情况下,obj的this会指向Fn的实例,但由于返回值是null,obj的a属性会是undefined。

      四、总结

      通过以上分析可以看出,this的指向是一个非常灵活的概念,它根据函数的调用方式和上下文而变化。在编写JavaScript代码时,明确this的指向可以帮助我们更好地理解代码的执行流程,并避免一些常见的错误。记住,理解this的指向是成为一名优秀的JavaScript开发者的一部分必备技能。

转载地址:http://akqh.baihongyu.com/

你可能感兴趣的文章
物理层
查看>>
内建函数
查看>>
C/C++分文件编写
查看>>
80x86指令系统-1-数据传送指令
查看>>
C语言+easyX图形库的推箱子实现
查看>>
结构体内存偏移量
查看>>
应用程序与dll的静态库通信
查看>>
反汇编-流程控制语句-2-循环控制语句分析
查看>>
调试vs2019代码的流程
查看>>
游戏外挂基础-概述
查看>>
脱壳与加壳-加壳-6-代码实现加密导入表
查看>>
Typora配置PicGo时,提示Failed to fetch
查看>>
Windows 7 安装 .NET 5 / .NET Core 3.1 环境的方法和依赖文件
查看>>
ASP.NET Core 使用 URL Rewrite 中间件实现 HTTP 重定向到 HTTPS
查看>>
ASP.NET CORE MVC 实现减号分隔(Kebab case)样式的 URL
查看>>
SQL优化 MySQL版 -分析explain SQL执行计划与笛卡尔积
查看>>
python的map函数
查看>>
bcolz的新操作
查看>>
Linux的s、t、i、a权限(转)
查看>>
zmq的send
查看>>