JavaScript中this的理解

来源:互联网 发布:最好的建筑设计软件 编辑:程序博客网 时间:2024/04/30 01:12

写在前面

    这篇文章主要参考以下两篇文章学会js的this和js中this彻底理解
    首先,本文讨论的情况都是在一班情况下,并非strict mode,下面进入正题,先熟悉几条原则,后面会有具体实例

几条原则

  1. js中this在函数定义的时候是确定不了的,只有在函数运行的时候才能确定
  2. 如果一个函数中有this,但是它没有被上一级的对象所调用,那么this指向的就是window
  3. 如果一个函数中有this,这个函数有被上一级的对象所调用,那么this指向的就是上一级的对象。
  4. 如果一个函数中有this,这个函数中包含多个对象,尽管这个函数是被最外层的对象所调用,this指向的也只是它上一级的对象
  5. js中function也是对象,window是全局变量

js中call方法

    看以下代码(弹出hello world)

        function hello(con){            alert(this+" "+con);        }        hello.call("hello","world");

    分析一下call()的用法
        1. 把第二个到左后一个参数当做函数执行时传入的参数
        2. 把函数执行时的this指向第一个参数
        3. 执行函数
    js执行函数的时候会默认执行以上的操作,即执行函数操作fun()相当于执行fun.call(window,p1..)

实例

        function a(){            var user = "gray";            alert(this.user); //undefined            alert(this); //Window        }        a();        //a();相当于window.a(),window中并没有定义user,因此是未定义
        var a= {            user:"gray",            fn:function(){                alert(this.user);//gray            }        };        a.fn();        //相当于window.a.fn();这里用到了第三条原则,fn被上一级对象a调用,因此this指向的对象a
        var a= {            user:"gray",            fn:function(){                alert(this.user);//undefined            }        };        var b = a.fn;        b();        //这里b只是指向a.fn,并没有执行,而this是在执行时才能确定指向的,因此真正执行的b()相当于window.b();this指向window

遇到return

        function fun(){            this.user = "gray";            return 1;        }        var f = new fun;        alert(f.user);//gray
        function fun(){            this.user = "gray";            return {};        }        var f = new fun;        alert(f.user);//undefined        //如果返回值是一个对象,那么this指向的就是那个返回的对象,如果返回值不是一个对象那么this还是指向函数的实例。
0 0
原创粉丝点击