• “茴”字有四种写法,this也是一样


      说到这个地方又想起以前高中还是初中学的《孔乙己》这个梗,但是这里的this显然实用性比那个要大很多,哈哈。

      简单来说,this有四种应用场景,分别是在构造函数上、对象属性中、普通函数中、call和apply方法中。

      先来看第一种,构造函数:

    1 function Foo(name){
    2             this.name=name;
    3         }
    4 
    5         var f=new Foo();

      在这里,this指向的是新对象f。而在对象属性中,这又有了一点不同。

    1 var obj={
    2             a:"funny",
    3             b:function(){
    4                 console.log(this.a);
    5             }
    6         };
    7 
    8         obj.b();//打印出funny

      这里我们把b作为obj对象的一个属性来执行,执行的时候this就指向当前这个对象obj,所以在控制台会打印出funny;接下来看第三种情况,就那这个例子来说,我们稍微改动一下代码。

    1         var obj={
    2             a:"funny",
    3             b:function(){
    4                 console.log(this.a);
    5             }
    6         };
    7 
    8         var f1=obj.b;
    9         f1(); //打印出undefined

      在第九行中,我们执行f1发现根本取不到“funny”,而是打印出undefined。原因就是当我们这样作为一个普通函数执行的时候,this指向window对象的,而window对象下找不到a这个属性,于是就打印出undefined。顺便说一句,如果是找不到一个属性,会返回undefined;而找不到一个变量,则会返回“xxx is not defined”。

      最后一种情况,在call和apply中。其实我们可以把call和apply当成一种特殊的执行方法。可以叫它“能自定义this指向的执行方法”,这个名字听起来是不是有点长,但原理的确如此。就是说当我们直接来一个f1()的时候,它的this默认为window。要改变怎么办呢?就要来点特殊执行手段,在中间多插入一个单词---call或者apply。

      

    1         var obj={
    2             a:"funny",
    3             b:function(){
    4                 console.log(this.a);
    5             }
    6         };
    7 
    8         var f1=obj.b;
    9         f1.call({a:"serious"}); //改变了this的指向,指向这个新对象,打印出serious

      还是这段代码,不过我稍微改了下,把它的this的指向扭了一下,最终指到我自己写的{a:"serious"}这个对象,然后就可以把serious打印出来了。apply和call差不多,因为这里我只传了一个参数,所以没法演示。call-->第一个参数为this,后面为其他参数;apply-->第一个参数为this,后面为用数组包裹起来的其他参数。就这么点区别。

      应该还不错吧(`・ω・´)

      

  • 相关阅读:
    Perl 基础笔记: 使用 cpanm 安装 Perl 模块
    修改CPAN安装源
    JQUERY实现点击INPUT使光标移动到最后或指定位置
    新手入门Underscore.js 中文(template)
    深入浅出C/C++中的正则表达式库
    [libxml2]_[XML处理]_[使用libxml2的xpath特性修改xml文件内容]
    Mysql事务的隔离级别
    HBase基础知识摘要
    java如何实现一个Future
    遇到过的问题整理-大量页面监控问题
  • 原文地址:https://www.cnblogs.com/zhangnan35/p/8414241.html
Copyright © 2020-2023  润新知