this的指向问题

this的指向问题

  1. 若果一个函数中有this,但是它没有被上级对象所调用,那么this的指向是window
    (在js不是严格型的情况下)
  2. 若一个函数中有this,这个函数有被上一 级对象所调用,那么this的指向就是上一级
    对象
  3. 若一个函数中有this,这个函数中包含多个对象,尽管这个函数是被外层的对象所调用,this的指向也只是它上一级的对象。

    知识点补充:

  • 在严格版中的默认的this不再是window,而是undefined。

  • new操作符会改变函数this的指向问题,虽然我们上面讲解过了,但是并没有深入的讨论这个问题,网上也很少说,所以在这里有必要说一下。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    //this最终指向的是调用它的对象
    function a(){
    var user="陈";
    console.log(this.user);//undefinded
    console.log(this);//window
    }
    a();//window对象在调用他
    //证明上述观点
    function a(){
    var user="陈";
    console.log(this.user);//undefined
    console.log(this);//window
    }
    window.a();
    //this的指向在函数创建的时候是决定不了的,在调用的时候才能决定
    var o={
    user:"陈",
    fn:function(){
    console.log(this.user);
    }
    }
    o.fn();//陈
    //与上面例子作比较
    var o={
    user:"陈",
    fn:function(){
    console.log(this.user);
    }
    }
    window.o.fn();//陈
    //this对象的指向问题
    var o={
    a:10,
    b:{
    a:12,
    fn:function(){
    console.log(this.a);//12
    }
    }
    }
    o.b.fn();
    //直接调用它的内层对象
    var o={
    a:10,
    b:{
    //a:12,
    fn:function(){
    console.log(this.a);
    }
    }
    }
    o.b.fn();//undefined
    //特殊情况
    var o={
    a:10,
    b:{
    a:12,
    fn:function(){
    console.log(this.a);//undefined
    console.log(this);//window
    }
    }
    }
    var j=o.b.fn;
    j();//注意this的指向是最后调用它的 对象,也就是看它执行的时候是谁调用的
    //证明上述观点
    var o={
    a:10,
    b:{
    a:12,
    fn:function(){
    console.log(this.a);//undefined
    console.log(this);//window
    }
    }
    }
    var j=o.b.fn;
    window.j();
    //构造函数版的this
    function Fn(){
    this.user="陈";
    }
    var a=new Fn();
    //a是new出来的一个对象实例
    console.log(a.user);//陈
    //当this碰到return的时候
    function fn(){
    this.user="陈";
    return {};
    }
    var a=new fn;
    console.log(a.user);//undefined
    //再看一个
    function fn(){
    this.user='陈';
    return function(){};
    }
    var a=new fn;
    console.log(a.user);//undefined
    //返回数字
    function fn()
    {
    this.user = '追';
    return 1;
    }
    var a = new fn;
    console.log(a.user); //追
    //返回undefined
    function fn()
    {
    this.user = '追';
    return undefined;
    }
    var a = new fn;
    console.log(a.user); //追
    // 如果返回值是一个对象,那么this指向的就是那个返回的对象,如果返回值不是一个对象那么this还是指向函数的实例。
    //还有一点就是虽然null也是对象,但是在这里this还是指向那个函数的实例,
    //因为null比较特殊
    function fn()
    {
    this.user = '追';
    return null;
    }
    var a = new fn;
    console.log(a.user); //追
文章目录
  1. 1. this的指向问题
|