美文网首页
JavaScript中this杂笔

JavaScript中this杂笔

作者: iMikasa_ | 来源:发表于2022-01-03 16:32 被阅读0次

在利用JavaScript开发的时候,经常遇见因为this引发的问题,很容易给我们程序员高兴死,所以我要记录一篇有关this的文章,好让朕遇见的时候不至于高兴死。

我们先了解一下this的使用场景呗...

我们直接使用this看看会返回个啥。

  • 浏览器环境下
this    //返回Window
this === window     //返回true

浏览器环境之中this就是代表当前的全局对象Window

  • Node命令行环境
this     //返回global
this === global       //返回true

Node环境之中this代表当前的全局对象global,利用Node运行js脚本文件时this代表的是空对象

根据我的理解,不论这个this出现在什么场合,他都总是返回一个对象

写个简单的例子,这谁都会

function f() {
  return '姓名:'+ this.name;
}

var A = {
  name: '张三',
  describe: f
};

var B = {
  name: '李四',
  describe: f
};

A.describe() // "姓名:张三"
B.describe() // "姓名:李四"

很好发现,这是哪个实例调用的,那个this就是那个实例。
我们现在再直接调用f()函数,函数内部会去找全局对象中挂载的name属性,如果没有就返回undefined.

接着我们测试个好玩的,在回调函数内测试这个this。

let obj = {};
obj.f = function(){
       console.log(this === obj); 
}
document.querySelector("h1").addEventListener("click",obj.f)

这样乍一看,调用函数的是obj对象,这个函数应该返回的是个true,但是我们点击发现,他返回的是false。原因是现在的this指向的并不是obj对象了,而是页面上的Dom对象。

我的解决办法是,如下

let obj = {};
obj.f = function(){
      console.log(this === obj);
}
let myfunc = obj.f.bind(obj)
document.querySelector("h1").addEventListener("click",myfunc)  

这样返回的就是true了,代码中用到了bind()函数了,这个以后再介绍吧。
大意就是给这个f函数绑定this对象就是obj...

其他我想嗦的东西

刚才我们测试来着,如果直接调用函数体内打印this的函数,他会返回全局对象,global Window,但是当我们给我们的js代码设置为严格模式'use strict'后,这个this就是undefined,如果函数内是如this.啥啥啥的就会报错的

以及箭头函数没有this

相关文章

  • JavaScript中this杂笔

    在利用JavaScript开发的时候,经常遇见因为this引发的问题,很容易给我们程序员高兴死,所以我要记录一篇有...

  • 杂笔

    最近几天,老是想起一个人。 一个从别人口中得知的,素不相识的人。 只知道她的QQ网名叫“小鱼”。 在没有微信的年代...

  • 杂笔/

    杂笔 与我最特别的日子/雪歌 雨,划破了天际,就这样肆孽的下着。似一个叛逆的少年,用美丽的花季在青葱的岁月...

  • 杂笔

    标准输出可能不会立即刷新。如果需要即时输出调试信息,请避免使用标准输出。测试发现,使用标准输出到屏幕时,如果加换行...

  • 杂笔

    最近九寨沟地震刷遍了我的各个网络社交平台,不过北方老家的朋友圈基本对此事相关甚少。 家在东北,人在昆明,所以每当西...

  • 杂笔

    “我不是没脾气,只是有点好脾气” “发脾气是因为不顺心” “不顺心其实是因为能力不够” 这样想想 算了 我还是好好...

  • 杂笔

    我丢失了笔,宛如你被夺去,此处骚痒,无计相对,镜池旁,呆望,满叶浮萍减去。 你脂腻的蜜指分明在向我诉说她的消瘦,我...

  • 《杂笔》

    有时候会念起往事,啰啰嗦嗦的有些像个老人。但老人却没有我这般唠叨,他们会烦厌后停下,我会说很多。也许是有些东西忘不...

  • 杂笔

    就这样不知不觉迷迷糊糊过了十几年,回想这些年感觉好多事情就像昨天发生一般,挥不去,忘不了。 只是突然想要记下十几年...

  • 杂笔

    当某一天你失去了方向感怎么办?其实我现在就处于失去方向感、感觉自己很差劲、 一直有心无力 ,我也想找到可以破解这种...

网友评论

      本文标题:JavaScript中this杂笔

      本文链接:https://www.haomeiwen.com/subject/ousxcrtx.html