zoukankan      html  css  js  c++  java
  • JavaScript中this的指向

    在函数执行时,this 总是指向调用该函数的对象。要判断 this 的指向,其实就是判断 this 所在的函数属于谁。

    • 有所属对象的时候指向该对象
    • 没有所属对象的时候指向全局即:window
    • 用new实例化出新对象后就指向新对象
    • 通过apply,call或bind可以改变this指向

    函数有所属对象时:指向所属对象

    复制代码
    1 var myObject = {
    2         value: 100
    3     };
    4     myObject.getValue = function () { 
    5         console.log(this.value); 
    6         // 输出 100  // 输出 { value: 100, getValue: [Function]}, // 其实就是 myObject 对象本身 console.log(this);  
    7         return this.value;
    8     }; 
    9     console.log(myObject.getValue()); // => 100
    复制代码

    getValue() 属于对象 myObject,并由 myOjbect 进行 . 调用,因此 this 指向对象 myObject。

    函数没有所属对象:指向全局对象window

    复制代码
    var myObject = {
            value: 100
        };
        myObject.getValue = function () { 
            var foo = function () {  
                    console.log(this.value) // => undefined  console.log(this);// 输出全局对象 global 
                };  
                foo();  
                return this.value;
        }; 
        console.log(myObject.getValue()); // => 100
    复制代码

    在上述例子中,foo函数虽然定义在 getValue 的函数体内,但实际上它既不属于 getValue 也不属于 myObject。foo 并没有被绑定在任何对象上,所以当调用时,它的 this 指针指向了window。

    new实例化后:指向新对象

    var SomeClass = function(){ 
            this.value = 100;
        };
        var myCreate = new SomeClass(); 
        console.log(myCreate.value); // 输出100

    通过apply,call或bind:指向绑定的对象

    复制代码
    var myObject = {
            value: 100
        }; 
        var foo = function(){ 
                console.log(this);
            }; 
            foo(); // 全局变量 global
            foo.apply(myObject); // { value: 100 }
            foo.apply();//参数为空的时候默认指向全局
            foo.call(myObject); // { value: 100 } 
            var newFoo = foo.bind(myObject);
            newFoo(); // { value: 100 }
  • 相关阅读:
    VS 对话框控件的Tab顺序问题
    基于OpenGL三维软件开发
    OpenGL 中的三维纹理操作
    VC 在桌面上绘制一些图形
    VC/MFC如何添加启动界面
    Cordova or Xamarin 用.net开发IOS和Android程序
    ASP.NET Web API
    软件项目如何选型
    CIO的职责、条件及价值
    Oracle日期周详解IW
  • 原文地址:https://www.cnblogs.com/fanshaokun/p/6429504.html
Copyright © 2011-2022 走看看