JS- 函数、回调函数、函数this指向

一. 函数
1. 什么是函数？
   实现特定功能的n条语句的封装体
   只有函数是可以执行的，其他类型的数据不能执行
2. 为什么要用函数？
   提高代码复用
   便于阅读交流
3. 如何定义函数？
function fn1() { ... }   // 函数声明
var fn2 = function() { ... }   //  函数表达式
4. 如何让调用函数？
test()：直接调用；
obj.test(): 通过对象调用；
new test(): 通过new调用；
test.call/apply(obj): 临时让test成为obj的方法进行调用；
var obj = { };
function test2 () {
  this.xxx = ' abc'
}
test2.call(obj);   // 可以让一个函数成为指定任意对象的方法进行调用 
console.log（obj.xxx）// 用来验证到底是不是obj调用的

二、回调函数
1. 什么是回调函数？
 (1). 自己定义
 (2). 没有调用
 (3). 但最终执行
2. 常见的回调函数
(1). dom事件回调函数
(2). 定时器回调函数
(3). ajax请求回调函数
(4). 生命周期回调函数
看2个常见的回调函数例子吧：

三. this指向

1. this是什么？
任何函数本质上都是通过某个对象来调用，如果没有直接指定就是window；
所有函数内部都有一个变量this；
它的值是调用函数的当前对象；
2. 如何确定this的值？
test():  直接调用就是window,
p.test(): p,
new test(): 新创建的对象,
p.call(obj):  obj
看个例子吧：

---------------------------------------------------------------------------------------------------------------------------------
普通函数对比箭头函数的this指向：
下面的例子摘抄至(49条消息) 箭头函数的this指向问题_平平无奇小码农qwq的博客-CSDN博客这位博主的文章，在此我也写一下，首先看个例子：

const obj = {
  aaa() {
    setTimeout(function () {
      console.log(this);
    }, 0);   // window

    setTimeout(() => {
      console.log(this);
    }, 0);  // {aaa:f}
  },
};
obj.aaa();

第一个setTimeout函数里面写的普通函数打印的this指向的是window，第二个setTimeout里面写的箭头函数指向的是obj，这是为什么呢？
setTimeout中的普通函数的this指向的是window, setTimeout中的function你可以理解为callback,

function callback(){} 
setTimeout(callback,2000);

setTimout中的执行伪代码可以理解为：

function setTimeout(fn,delay);

可以看到，他是直接调用fn(),前面没有给任何对象绑定在一起，所以根据JavaScript的规则，它属于默认绑定，自然就是window了。
箭头函数的中this：是最近作用域中的this。也就是说往外层作用域中，一层一层往外找，直到有this的定义出现。上例中箭头函数中的this往外找，发现了函数aaa，aaa中的this指向的是obj，所以第二个setTimeout中箭头函数中指向的this是obj。
再看一个稍微复杂的例子：

const obj = {
	aaa() {
		setTimeout(function () { //  1
		
			setTimeout(function () { //  1.1
				console.log(this);  // window
			}, 0);
			
			setTimeout(() => {  //  1.2
				console.log(this);  // window
			}, 0);
			
            console.log(this);  // window
		}, 0);
		
		setTimeout(() => { //  2
		
			setTimeout(function () {  //  2.1
				console.log(this);  // window
			}, 0);
			
			setTimeout(() => {  //  2.2
				console.log(this);  // obj  {aaa:f}
			}, 0);
			
            console.log(this);  // obj {aaa:f}
		}, 0);
	},
};
obj.aaa();

解释：settimeout中的普通函数的this指向的都是window，所以 1.1 和 2.1 中的this指向window是毫无疑问的。然后通过最开始的例子我们知道 1 的this指向的是window，所以1.2 中的this往上找，找到了 1 中的this，指向的window，所以 1.2 中的this指向的是window。通过最开始的例子我们也知道， 2 中的this指向的是obj，那么 2.2 中的this往上找，找到了 2 中的this，指向的obj，所以 2.2 中的this指向的是obj。