JavaScript面试总结:轻松搞定this问题_极悦注册
专注Java教育14年 全国咨询/投诉热线:444-1124-454
极悦LOGO图
始于2009,口口相传的Java黄埔军校
首页 学习攻略 Java学习 JavaScript面试总结:轻松搞定this问题

JavaScript面试总结:轻松搞定this问题

更新时间:2019-12-09 16:25:57 来源:极悦 浏览2063次

 

  如果大家接触到的编程语言足够多,就会发现几乎在大部分编程语言里边都有this关键字,恐怕最难理解的要属于JavaScript中的this了。

79 拷贝.jpg

  不同的环境this不同,不同的对象this不同。

  你曾经有没有被面试中的this问题难倒过?今天知了堂的蛋糕哥哥给大家带来this的面试干货,结合案例让你轻松解决面试中的this问题。

  什么是this

  this是js的一个关键字,它指代的是一个对象的引用。

  当一个函数被调用时,会创建一个执行上下文,此执行上下文会记录这个函数在哪里被调用(调用栈)、函数的调用方法、传入的参数等信息。而this就是记录这个函数在哪里被调用的,在哪里被调用,这个函数里的this就指向谁。 所以,this指向取决于函数的调用方式。

  this关键字的作用

  this 提供了一种更优雅的方式来隐式“传递”一个对象引用,代码设计将更利于复用。

  总结 简单的话:this返回的当前函数被调用的那个对象 。

  this的使用场景

  1.全局使用 this === window(严格模式下IIFEthis为undefined)

  2.函数当中 在全局调用这个fn() this === window

  3.在方法当中使用 this === 调用当前这个函数的所在的对象

  4.构造函数,this指向的是 new 创建出来的实例对象

  5.通过 bind,call,apply 操作符来显示的设置 this的指向

  6.ES6的箭头函数,没有自己的this,父作用域的this

  常见面试题分享

  1.面试题一

  var name = "window"

  var obj = {

  name:"my Object",

  getName:function(){

  console.log(this.name);

  return function(){

  return this.name

  }

  }

  }

  var fun = obj.getName(); //输出?

  fun()//输出?

 

  答案:第一个输出的my Object,第二个输出的是window,小伙伴们答对了么?

 

  详解:

  首先第一个很好解释,getName方法是obj调用的,所以根据使用场景3,方法谁调用,this执行谁。 关键是第二个,调用了getName后返回一个匿名函数,把这个函数的引用赋值给了fun,然后fun在window环境下被调用,所以根据场景2,此时的this为window(有小伙伴是不是想到闭包呢?跟闭包一点关系都没有哟~)

  var x = 3;

  var foo = {

  x: 2,

  baz: {

  x: 1,

  bar: function() {

  return this.x;

  }

  }

  }

  var go = foo.baz.bar;

  foo.baz.bar()//输出?

  go()//输出?

  答案:第一个输出1,第二个输出3(.运算符优先级要高于())。

  如果你答对了,恭喜你基本掌握了this的调用。

  其实在开发中,并不会去写像面试那么绕的东西。面试题是为了更深入的洞悉应聘者的掌握情况,所以也有很大的参考意义!  

35 拷贝.jpg

       以上就是极悦注册机构小编介绍的“JavaScript面试总结:轻松搞定this问题”的内容,希望对大家有帮助,如有疑问,请在线咨询,有专业老师随时为你服务。

 

相关推荐

(初级到高级)

 

提交申请后,顾问老师会电话与您沟通安排学习

免费课程推荐 >>
技术文档推荐 >>