一次搞定js中的this指向

一次搞定js中的this指向

js中this的指向是在运行时会变动的

这句话严谨的说是有问题的。

this这个关键词,在java中的解释是引用当前类的实例变量。这里有两个关键词当前类实例变量,说白了this当前执行方法的调用者

比如

const a = {
  say() {
    console.log(this === a);
  }
}
a.say(); // true
复制代码

再比如

class A {
  constructor() {
    this.name = "A";
  }
  say() {
    console.log(this.name);
  }
}
const a = new A();
a.say(); // "A"
const b = {
  name: "B",
  say: a.say
}

b.say(); // "B"
复制代码

但有时,我们会遇到下面?的情况

function sayThis() {
  // TODO
  console.log(this);
}
sayThis();
复制代码

一个方法,没有直接调用者。。。。

这种情况的时候,代码的效果就是这样的

function sayThis() {
  // TODO
  console.log(this);
}
this.sayThis();
复制代码

如果一个函数没有显式的调用者,那么,这个函数的调用者就是此函数执行的作用域中的this

所以,归根结底,this当前执行方法的调用者

?

?

?

?

?

?

?

你以为这样就结束了?Too young too simple

js中还有三个显式绑定this的方法,bindapplycall当使用这些方法指定执行函数的this时,那this基本上就是指定的了

基本上?有特殊情况吗?

有!!!!?

箭头函数

const sayThis = () => {
    console.log(this)
}
复制代码

上面的代码用babel编译之后

var _this = this;
var sayThis = function () {
    console.log(_this);
};
复制代码

很容易理解箭头函数中this的指向

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/100937.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 搭建本地私有pip源「建议收藏」

    搭建本地私有pip源「建议收藏」目的1、用于内网内的pip安装2、整理个人使用的python第三方库3、个人开发公用库搭建环境1、centos72、python2/python3搭建步骤(python2相同)1、安装python3.7下载地址:https://www.python.org/ftp/python/3.7.9/Python-3.7.9.tar.xz解压tar-xvJfPython-3.7.2.tar.xz创建编译安装目录mkdir/usr/local/python3

    2022年5月18日
    129
  • 完美解决pycharm安装第三方库失败的问题[通俗易懂]

    完美解决pycharm安装第三方库失败的问题[通俗易懂]使用pycharm安装第三库的流程1.点击wenjian1.

    2022年8月25日
    4
  • javascript activexobject_activex控件

    javascript activexobject_activex控件一、什么是ActiveX控件?    ActiveX控件广泛用于Internet。它们可以通过提供视频、动画内容等来增加浏览的乐趣。不过,这些程序可能出问题或者向您提供不需要的内容。在某些情况下,这些程序可被用来以您不允许的方式从计算机收集信息、破坏您的计算机上的数据、在未经您同意的情况下在您的计算机上安装软件或者允许他人远程控制您的计算机。一般软件需要用户单独下载然后执行

    2022年10月14日
    2
  • Vue生命周期(11个钩子函数)「建议收藏」

    Vue生命周期生命周期初识生命周期详解(八个钩子函数)生命周期生命周期:Vue是一个构造函数,当执行执行这个函数时,相当于初始化vue实例;在创建实例过程中,需要设置数据监听,编译模板,将实例挂载到DOM上,数据更新能够让DOM也更新,在这个初始化,又会不同阶段默认调用一些函数执行,这些函数就是生命周期的钩子函数;生命周期钩子函数生命周期钩子函数,让够让咱们…

    2022年4月6日
    145
  • Caliburn.Micro Bootstrapper及IOC容器配置

    Caliburn.Micro Bootstrapper及IOC容器配置如果想深入学习Caliburn.Micro,Bootstrapper和IOC容器配置是重中之重,一定要弄清楚,否则很难理解CM的工作方式。配置Bootstrapper的意义如果在Boostrapper中不进行任何配置的话,Bootstrapper会首先把Bootstrapper所在程序集加载到AssemblySource.Instance中。而我们在Bootstrapper中只在Displa…

    2022年7月20日
    13
  • mysql数据库select语句用法_mysql数据库select查询语句简单用法「建议收藏」

    mysql数据库select语句用法_mysql数据库select查询语句简单用法「建议收藏」mysqlselect简单用法1、select语句可以用回车分隔$sql=”select*fromarticlewhereid=1″和$sql=”select*fromarticlewhereid=1″,都可以得到正确的结果,但有时分开写或许能更明了一点,特别是当sql语句比较长时2、批量查询数据可以用in来实现$sql=”select*fromarticlewher…

    2022年5月3日
    56

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号