Skip to content

Latest commit

 

History

History
97 lines (78 loc) · 3.25 KB

14.this指向.md

File metadata and controls

97 lines (78 loc) · 3.25 KB
Raw

this指向

头条一面

请分别写出下面题目的答案。

function Foo() {
    getName = function() {
        console.log(1);
    };
    return this;
}
Foo.getName = function() {
    console.log(2);
};
Foo.prototype.getName = function() {
    console.log(3);
};
var getName = function() {
    console.log(4);
};

function getName() {
    console.log(5);
}

//请写出以下输出结果：
Foo.getName();      //-> 2    Foo对象上的getName() ，这里不会是3，因为只有Foo的实例对象才会是3，Foo上面是没有3的
getName();          //-> 4    window上的getName，console.log(5)的那个函数提升后，在console.log(4)的那里被重新赋值
Foo().getName();    //-> 1    在Foo函数中，getName是全局的getName，覆盖后输出 1（当前的这个函数在调用的时候才会执行里面的语句）
getName();          //-> 1    window中getName();
new Foo.getName();  //-> 2    Foo后面不带括号而直接 '.'，那么点的优先级会比new的高，所以把 Foo.getName 作为构造函数
new Foo().getName();//-> 3    此时是Foo的实例，原型上会有输出3这个方法

函数表达式和函数声明的区分（函数提升比变量提升的优先级高）

函数在运行的瞬间，生成一个活动对象（Active Object），简称AO

  • 参考博客：https://www.cnblogs.com/libin-1/p/6101185.html
  • 分析参数 函数接收形式参数，添加到AO的属性，并且这个时候值为undefine,例如AO.age=undefine 接收实参，添加到AO的属性，覆盖之前的undefine
  • 分析变量声明，如var age;或var age=23; 如果上一步分析参数中AO还没有age属性，则添加AO属性为undefine，即AO.age=undefine 如果AO上面已经有age属性了，则不作任何修改
  • 分析函数的声明，如果有function age(){} 把函数赋给AO.age ,覆盖上一步分析的值

箭头函数中的this 判断

箭头函数里面的this是继承它作用域父级的this， 即声明箭头函数处的this

let a = {
  b: function() {
    console.log(this)
  },
  c: () => {
    console.log(this)
  }
}

a.b()   // a： 普通函数的this是在调用的时候决定的
a.c()   // window：箭头函数的this看外层的是否有函数， 如果有，外层函数的this就是内部箭头函数的this，如果没有，则this是window。

let d = a.b
d()     // window

this判断 下面输出为多少？

var name1 = 1;

function test() {
	let name1 = 'kin';
	let a = {
		name1: 'jack',
		fn: () => {
      var name1 = 'black'
      console.log(this.name1)       // 看当前外部，有函数，外层的this就是内部的this，没有的话就是window(JS只有全局作用域和函数作用域)
    }
  }
	return a;
}

test().fn() // ?

答案： 输出1

因为fn处绑定的是箭头函数，箭头函数并不创建this，它只会从自己的作用域链的上一层继承this。这里它的上一层是test()，非严格模式下test中this值为window。

  • 在非严格模式下，由于this必须是一个对象，所以就默认为指向全局对象window，在严格模式下this为undefined
  • 如果在绑定fn的时候使用了function，那么答案会是 'jack'
  • 如果第一行的 var 改为了 let，那么答案会是 undefind， 因为let不会挂到window上