jquery参数传递-如何在Javascript中按顺序进行多个异步执行

也想出现在这里？点击联系我~

立即下单

进入商城

进不了网站？换个网络试试！

直接调用（异步调用异步）

function fn1() {
	setTimeout(() => {
		console.log('fn1执行')
		fn2('fn1传递过去的参数')
	}, 1000)
}
function fn2(data) {
	setTimeout(() => {
		console.log('fn2执行', data)
		fn3('fn2传递过去的参数')
	}, 1000)
}
function fn3(data) {
	setTimeout(() => {
		console.log('fn3执行', data)
	}, 1000)
}
fn1()

执行结果如下：

我们发现这些方法似乎都是可以实现的jquery参数传递jquery参数传递，而且一旦代码大小增加，可读性就会增加。

承诺法

function fn1() {
	return new Promise((resolve, reject) => {
		console.log('fn1执行')
		setTimeout(() => {
			console.log('fn1结束')
			resolve('fn1传递过去的参数')
		}, 1000)
	})
}
function fn2(data) {
	return new Promise((resolve, reject) => {
		console.log('fn2执行，接收的参数', data)
		setTimeout(() => {
			resolve('fn2传递过去的参数')
		}, 1000)
	})
}
function fn3(data) {
	return new Promise((resolve, reject) => {
		console.log('fn3执行，接收的参数', data)
		setTimeout(() => {
			resolve('fn3传递过去的参数')
		}, 1000)
	})
}
fn1().then(fn2).then(fn3).then(res => {
	console.log('最后一个', res)
})

构建器方法

生成器是一个可以返回迭代器的函数。 这也是一个函数。 与普通函数相比，多了一个*. 函数体中可以使用yield关键字。 该函数在每次yield之后都会暂停，直到生成了这个对象，调用接下来的next()，并且每次调用next时，yieId都会被执行一次，然后暂停。

function* main() {
	const res1 = yield fn1('开始')
	const res2 = yield fn2(res1)
	const res3 = yield fn3(res2)
	console.log(res3, '全部执行完毕')
}
const task = main()
task.next()
function fn1(data) {
	setTimeout(() => {
		console.log('fn1执行', data)
		task.next('fn1执行完毕')
	}, 1000)
}
function fn2(data) {
	setTimeout(() => {
		console.log('fn2执行', data)
		task.next('fn2执行完毕')
	}, 1000)
}
function fn3(data) {
	setTimeout(() => {
		console.log('fn3执行', data)
		task.next('fn3执行完毕')
	}, 1000)
}
console.log('我是最开始同步执行的')