v3+ts慢慢学习路之三【methods方法中的this】

备战了几个月的软考终于结束了，我胡汉三又回来了

先来一张官方描述，特别注重看【注意】

本着有问题就要问的原则：
1、为什么不能使用箭头函数？
2、不使用箭头函数的情况下，this到底指向什么？

解答一：为什么不能使用箭头函数？

• 我们在methods中要使用data返回的对象数据，那么这个this必须有值，并且应该可以通过this获取到data对象中的数据
• 所以我们的this不指向window，因为window中没有我们需要的data对象数据，如果我们换成箭头函数，那么箭头的函数this是会在自己上层作用域来找，最终刚好找到script作用域中的this，所以就是window，因此不能用箭头函数

this的查找规则 是怎样的呢？总共有四种规则，【箭头函数不遵循这四种规则】
四种规则的优先级如下：
new绑定 > 显示绑定（bind）> 隐式绑定 > 默认绑定
超出这四种规则的，比如下面代码

// 超出this绑定规则之外---1
	function foo() {
	  console.log(this);
	}
	
	var obj = {
	  name: "godfery"
	}
	
	foo.call(obj); // obj对象
	foo.call(null); // window
	foo.call(undefined); // window
	
	var bar = foo.bind(null);
	bar(); // window
	
	function foo() {
	  console.log(this);
	}
// 超出this绑定规则之外---2
	var obj1 = {
	  name: "obj1",
	  foo: foo
	}; 
	
	var obj2 = {
	  name: "obj2"
	}
	
	obj1.foo(); // obj1对象
	(obj2.foo = obj1.foo)();  // window

解答二：this到底指向什么？通过看源码就可以了解，vue会对methods中的方法绑定this