zoukankan      html  css  js  c++  java
  • JavaScript之this学习心得

    this在运行时绑定,并不是在编写时绑定,它的上下文取决于函数调用的各种条件。this既不指向自身,也不指向函数的词法作用域。this是在函数被调用时发生的绑定,指向什么完全取决于函数在哪里被调用。

    this绑定规则 

    1. 默认绑定:this绑定在函数调用的位置。只在非严格模式下,才能绑定到调用位置,严格模式下与调用位置无关。 

    function foo(){
      console.log(this.a); 
    }
    var a = 2;
    foo(); // 2

    2. 隐式绑定:this绑定需要考虑调用位置是否有上下文对象,或者说是否被某个对象拥有或者包含。this绑定到函数引用的上下文对象上。

    function foo(){
        console.log(this.a); 
    }
    var obj1 = {
        a:1,
        foo:foo
    };
    var obj2 = {
        a:2,
        obj1:obj1
    };
    obj2..obj1.foo(); // 1

    注:对象属性引用链中只有最顶层或者说最后一层会影响调用位置。 

    隐式丢失:被隐式绑定的对象会丢失,然后采用默认绑定,从而把this绑定到全局对象或undefined上,取决于是否是严格模式。其根源是函数对象传递是传的引用,不是复制,与中间经过的各种历程无关,只是与初始定义有关 。

    function foo(){
        console.log(this.a); 
    }
    var obj = {
        a:0,
        foo:foo
    };
    var bar = obj.foo; // 函数别名
    var a = "global";
    bar(); // "global"

    3. 显式绑定:使用函数的call()/apply()方法进行this绑定。它们的第一个参数是一个对象,会把这个对象绑定到this。

    function foo(){
        console.log(this.a); 
    }
    var obj = {
        a:0,
    };
    foo.call(obj); // 0

    call(obj,var1,var2,···),apply(obj,[var1,var2,···]) 
    4. new绑定:使用new调用函数(构造函数调用),将this绑定到新构建的对象上。

    function foo(){
        this.a = a; 
    }
    var bar = new foo(0);
    console.log(bar.a);  // 0

    new操作的执行过程:

    1. 创建一个全新的对象;
    2. 新对象被执行[[原型]]连接;
    3. 新对象绑定到函数调用的this;
    4. 若函数没有返回其他对象,那么new表达式中的函数调用会自动返回这个新对象。 

    this绑定判断流程 

    1. 由new调用?绑定到新建的对象; 
    2. 由call/apply/bind调用?绑定到指定的对象; 
    3. 由上下文对象调用?绑定到那个上下文对象; 
    4. 默认:在严格模式下绑定到undefined,否则绑定到全局对象。
  • 相关阅读:
    OpenGL模板缓冲区与模板测试
    u3d调用c++ dll的DllNotFoundExceion 问题
    u3d调用自己的dll
    使用 idea 的Bookmarks(书签)功能
    maven 相关问题
    项目
    使用 vi/vim 时,粘贴进新创建文件或空文件的首行内容丢失的解决方法
    Thread.sleep还是TimeUnit.SECONDS.sleep
    搭建 Guacamole 并解决各种坑和创建不了虚拟驱动器导致无法实现文件传输的方法
    properJavaRDP 跑通本地远程桌面
  • 原文地址:https://www.cnblogs.com/syfwhu/p/5557637.html
Copyright © 2011-2022 走看看