关于this,是很多前端面试必考的题目,有时候在网上看到这些题目,自己试了一下,额,还真的错了!在实际开发中,也会遇到 this 的问题(虽然一些类库会帮我们处理),例如在使用一些框架的时候,例如:knockout,有时候不明白为什么不直接使用this,而要把 this 作为参数传入。

接下来你谈谈我对它的理解,也作为一个笔记,方便以后参阅。有不对的地方,欢迎指出批评。

1. 不像C#,this一定是指向当前对象。js的this指向是不确定的,也就是说是可以动态改变的。call/apply 就是用于改变this指向的函数,这样设计可以让代码更加灵活,复用性更高。

2. this 一般情况下,都是指向函数的拥有者。这一点很重要!这一点很重要!这一点很重要!

这也是一道常见的面试题,如下代码:

<script type="text/javascript">
  var number = 1;
  var obj = {
   number: 2,
  showNumber: function(){
  this.number = 3;
  (function(){
  console.log(this.number);
  })();
  console.log(this.number);
  }
  };
  obj.showNumber();
</script>

由于showNumber方法的拥有者是obj,所以this.number=3; this 指向的就是 obj 的属性 number。同理,第二个 console.log 打印的也是属性 number。

为什么第二点说一般情况下this都是指向函数的拥有者,因为有特殊情况。函数自执行就是特殊情况,在函数自执行里,this 指向的是:window。所以第一个 console.log 打印的是 window 的属性 number。

所以要加一点:

3. 在函数自执行里,this 指向的是 window 对象。

扩展,关于this,还有一个地方比较让人模糊的是在 dom 事件里,通常有如下3种情况:

如下:

1. 使用标签属性注册事件,此时this 指向的是 window 对象。

<input id="test" type="button" value="按钮" onClick="test()"/>

function test(){alert(this)}

2. 对于1,要让 this 指向 input,可以将 this 作为参数传递。

3. 使用 addEventListener 等注册。此时this 也是指向 input。

document.getElementById("test").addEventListener("click",test);

一点关于this的理解的更多相关文章

  1. 一点对Promise的理解与总结

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/10959411.html,多谢,=.=~ axios用多了就开始疑惑它里面到底是个啥,虽然总被告知 ...

  2. SVM(支持向量机)的一点理解

    最近有被问到SVM的问题,不懂装懂,羞愧不已.百度有很多深入浅出介绍SVM的文章,我就不赘述了,这里写一点自己肤浅的理解. SVM的核心思想是把求解低维空间上的高维分类器转化为求解高维函数空间上的线性 ...

  3. Python - 001 - 类与实例间属性的理解

    Python是个很灵活的语言,光看它的类和实例间属性的访问机制就可以看出这一点,不过这一点还真的不好理解,做了些测试之后我的理解是这样的: 实例在访问class属性时,先检索自己的names, 如果有 ...

  4. 读完了csapp(中文名:深入理解计算机系统)

    上个星期最终把csapp看完了. 我买的是中文版的,由于除了貌似评价不错以外,由于涉及到些自己不了解的底层东西,怕是看英文会云里雾里.如今看来,大概不能算是个长处,可是的确可以加快我的看书速度,否则一 ...

  5. 对SVM的个人理解

    对SVM的个人理解 之前以为SVM很强大很神秘,自己了解了之后发现原理并不难,不过,“大师的功力在于将idea使用数学定义它,使用物理描述它”,这一点在看SVM的数学部分的时候已经深刻的体会到了,最小 ...

  6. c/c++性能优化--- cache优化的一点杂谈

    之前写了一篇关于c/c++优化的一点建议,被各种拍砖和吐槽,有赞成的有反对的,还有中立的,网友对那篇博客的的评论和吐槽,我一个都没有删掉,包括一些具有攻击性的言论.笔者有幸阅读过IBM某个项目的框架代 ...

  7. 认为C/C++很难理解、找工作面试笔试,快看看这本书!

    假设你是C/C++谁刚开始学习,看这本书.因为也许你读其他的书还不如不看.一定要选择一本好书. 假设你正在准备工作,请认真看这本书,由于这本书会教会你工作中必备的知识,相信你即将面临的语法类题目不会超 ...

  8. java方法的多态性理解

    1.什么是java的多态 浏览了别人博客中的一些介绍多态的文章,发现大家的描述有点不一样,主要区别在于是否把方法的重写算做多态.一种我比较认同的说法如下: 多态分为两种 a. 编译时多态:方法的重载: ...

  9. 深入理解 JavaScript 事件循环(二)— task and microtask

    引言 microtask 这一名词是 JS 中比较新的概念,几乎所有人都是在学习 ES6 的 Promise 时才接触这一新概念,我也不例外.当我刚开始学习 Promise 的时候,对其中回调函数的执 ...

随机推荐

  1. Bzoj 4591: [Shoi2015]超能粒子炮·改 数论,Lucas定理,排列组合

    4591: [Shoi2015]超能粒子炮·改 Time Limit: 10 Sec  Memory Limit: 256 MBSubmit: 178  Solved: 70[Submit][Stat ...

  2. 【转】 bash简介及通配符、扩展通配符 shopt -s extglob

    http://www.rhce.cc/?p=1005 当我们执行一些命令的时候,很多的命令是由bash提供的.如果我们想知道某个命令是否是由bash内置的命令的话,我们可以使用type bash内置命 ...

  3. XMPP的Stanzas

    客户端需要使用JID作为身份标石 : [user "@"]domain["/"resource]加域名可以区别重名的用户user,resource可以区分用户登 ...

  4. python os.path模块--转载

    os.path.abspath(path) #返回绝对路径 os.path.basename(path) #返回文件名 os.path.commonprefix(list) #返回list(多个路径) ...

  5. WinForm中如何判断关闭事件来源于用户点击右上角的“关闭”按钮

    在C#的WinForm程序中,有的时候需要判定关闭请求从哪里发出来的.比如是用户点击了右上角的“关闭”按钮,还是调用了WinForm.Close()方法.最典型的是要知道点击右上角的“关闭”按钮发出的 ...

  6. WinForm程序启动控制台窗口Console

    本文转载:http://blog.csdn.net/oyi319/article/details/5753311 2.WinForm程序和控制台窗口Console 如果你调试过SharpDevelop ...

  7. jeasyUI属性列表

    属性分为CSS片段和JS片段. CSS类定义:1.div easyui-window        生成一个window窗口样式.      属性如下:                   1)mod ...

  8. 数据库中DDL、DML、DCL和TCP概念

    1.DDL(Data Definition Language)数据库定义语言statements are used to define the database structure or schema ...

  9. PCL入门—点云操作 定义变量 显示点云 存储

    // 定义相关变量 pcl::PointCloud<pcl::PointXYZ>::Ptr cloud_ptr (new pcl::PointCloud<pcl::PointXYZ& ...

  10. [ES6] ES6 Parameter Object Destructuring with Required Values

    Not only can you provide default values when using ES6 parameter object destructuring, but you can a ...