zoukankan      html  css  js  c++  java
  • js中浅谈this对象(未补充完整)

    什么是this?

      1.javascript语言中,一切皆为对象(除了 undefined 和 null 之外),运行环境也是对象,所以函数都是在某个对象之中运行,this就是这个对象(环境)。

      2.this的指向是动态的。如果函数在全局作用域中,那么this就会指向全局环境;如果函数位于某个对象中,那么this就会指向该对象。

      3.与new关键字相同,this关键字总是返回一个对象

     

    首先,必须搞清楚在JS里面,函数的几种调用方式:

    • 普通函数调用

    • 作为方法来调用

    • 作为构造函数来调用

    • 使用apply/call方法来调用

    • Function.prototype.bind方法

    • es6箭头函数

    但是不管函数是按哪种方法来调用的,请记住一点:谁调用这个函数或方法,this关键字就指向谁

    this的使用场合

    1.全局环境(全局作用域)

          在全局作用域中使用this对象,它指向的就是顶层对象,也就是window对象。

        

    function person(){
            this.name="xl";
            console.log(this);
             console.log(this.name);
         }
         person();  //输出  window  xl 
    
        // 在这段代码中person函数作为普通函数调用,实际上person是作为全局对象window的一个方法来进行调用的,即window.person();
        //所以这个地方是window对象调用了person方法,那么person函数当中的this即指window,同时window还拥有了另外一个属性name,值为xl.
    
         var name="xl";
         function person(){
             console.log(this.name);
         }
         person(); //输出 xl
    
         //同样这个地方person作为window的方法来调用,在代码的一开始定义了一个全局变量name,值为xl,它相当于window的一个属性,即window.name="xl",
        又因为在调用person的时候this是指向window的,因此这里会输出xl.
    //在上面的代码中,普通函数的调用即是作为window对象的方法进行调用。显然this关键字指向了window对象.

       上面代码中,不管是不是在函数内部,只要在全局作用域下运行,this就是指向顶层对象window。

      2. 作为方法来调用:

        当函数被保存为一个对象的属性时,它就可称为这个对象的方法。当一个方法被调用 时,this被绑定到这个对象上。

        如果调用表达式包含一个提取属性的动作(. 或 []),那么它被称为方法调用;

      var name="XL";
           var person={
            name:"xl",
            showName:function(){
                console.log(this.name);
            }
        }
        person.showName();  //输出  xl
       // //这里是person对象调用showName方法,很显然this关键字是指向person对象的,所以会输出name
        
        var showNameA=person.showName;
        showNameA();    //输出  XL
        //这里将person.showName方法赋给showNameA变量,此时showNameA变量相当于window对象的一个属性,因此showNameA()执行的时候相当于window.showNameA(),即window对象调用showNameA这个方法,所以this关键字指向window
    //================================================================
    
        var personA={
            name:"xl",
            showName:function(){
                console.log(this.name);
            }
        }
        personA.showName();  //输出xl;这里是personA中调用showName,所以this指向parsonA
    
        var personB={
            name:"XL",
            sayName:personA.showName
        }
        
        personB.sayName();  //输出 XL
        //虽然showName方法是在personA这个对象中定义,但是调用的时候却是在personB这个对象中调用,因此this对象指向personB;

    3.   随时补充,暂时不会!

      

    疲惫的生活需要一个温柔的梦和一个很爱的人
  • 相关阅读:
    leetcode33. Search in Rotated Sorted Array
    pycharm 设置sublime text3 monokai主题
    django class Meta
    leetcode30, Substring With Concatenation Of All Words
    Sublime text3修改tab键为缩进为四个空格,
    sublime text3 python打开图像的问题
    安装上imesupport输入法依然不跟随的解决办法,
    sublime text3 的插件冲突弃用问题,
    sublime text3 BracketHighlighter括号匹配的设置
    windows 下wget的使用
  • 原文地址:https://www.cnblogs.com/zhouqingfeng/p/11404658.html
Copyright © 2011-2022 走看看