JS异步操作解决方案

异步操作的四种方法：
1.异步回调函数
2.事件监听
3.发布/订阅
4.Promises对象

解决异步问题的操作

一.回调函数

这是异步编程最基本的方法。
假定有两个函数f1和f2，后者需要用到前者的执行结果。

function f1() {
  // ...
}
function f2() {
  // ...
}
f1();
f2();

上面代码的问题在于，如果f1是很耗时的任务（异步操作），f2会立即执行，不会等到f1结束再执行。这时，可以考虑改写f1，把f2写成f1的回调函数。

function f1(callback) {
  // ...
  callback();
}
function f2() {
  // ...
}
f1(f2);

但事件循环这会产生一个问题，我们来举个例子。

var c;
var a;
function f1(callback){
　　setTimeout(function () {
		var a = 2;
　　}, 2000);
}
function f2(){
	c = a + 1;
	console.log(c);
}
f1();
f2();	//NaN

函数f2需要用到f1中的操作结果进行运算，由于f1中存在异步所以会优先执行f2,导致f2中无法获取a的值，结果输出NaN。下面我们用回调函数改进一下。

var c;
var a;
function f1(callback){
　　setTimeout(function () {
		var a = 2;
		callback(a)
　　}, 2000);
}
function f2(N){
	c = N + 1;
	console.log(c);
}
f1(f2);	//3

值得注意的是，回调函数本身不会引起异步，他是解决异步问题的基本方法
异步函数包括（注册事件、setTimeout、ajax、promise）

二.事件监听

	<div class="_div">
		<input type="button" id="myButton" value="click">
	</div>

	$("._div").on("click",function(){//父元素
		console.log(222);//第二
	})
	$("#myButton").on("click",function(){//子元素
		setTimeout(function B() {
			console.log("BBB");//第三
	  	}, 0)
	  	console.log(111);//第一
	}); 

setTimeout和setInterval区别 ++i和i++区别

setTimeout 延时;倒计时;
interval 间隔;幕间休息;（数学）区间 n

var i = 1;

var a = setTimeout(function(){//一秒后仅执行一次
	console.log("执行一次")
},1000);

var b = setInterval(function(){//每隔0.5秒执行一次
	// console.log(++i);
	// 等价于
	// console.log(i=i+1);
	
	console.log(i++);
},500)

console.log(a)//1 计数器编号
console.log(b)//2 计数器编号
clearTimeout(a);//清除编号为1的setTimeout定时器
clearInterval(b);//清除编号为2的setInterval定时器

setTimeout在 for/while循环中，不会等待延时时间。

for (var int = 0; int < 10; int++) {
		setTimeout(function(){alert("kewen nihao!")}, 2000);
}

按照正常理解，那肯定是等2秒，弹一次框。 实际则不然，for循环会执行完所有的循环体，然后2秒后一下子弹出10次弹框。这表示循环体内不会等待setTimeout的延时。

解决方案：采用setInterval来实现每次循环延时2秒执行。

var times = 0;
var a = setInterval(function(){
	times += 1
	console.log("hahaha");
	debugger
	if(times == 10){
		clearInterval(a)
	}
},1000)；