An evaluation question of Ali

Title:

		const timeout = ms => new Promise((resolve, reject) => {
			setTimeout(() => {
				resolve();
			}, ms);
		});

		const ajax1 = () => timeout(2000).then(() => {
			console.log('1');
			return 1;
		});

		const ajax2 = () => timeout(1000).then(() => {
			console.log('2');
			return 2;
		});

		const ajax3 = () => timeout(2000).then(() => {
			console.log('3');
			return 3;
		});

		const mergePromise = ajaxArray => {
			// Implement your code here
			// ;


		}

		mergePromise([ajax1, ajax2, ajax3]).then(data => {

			console.log('done');
			console.log(data); // data is [1, 2, 3]
		});

		// Separate output
		// 1
		// 2
		// 3
		// done
		// [1, 2, 3]

As a novice, I was confused and didn't solve it in half an hour. I scribbled something.

After thinking for a few hours, my answer is that I think it should meet the needs:

<!DOCTYPE html>
<html>
<head>
	<title>666</title>
</head>
<body>
	<script type="text/javascript">
		const timeout = ms => new Promise((resolve, reject) => {
			setTimeout(() => {
				resolve();
			}, ms);
		});

		const ajax1 = () => timeout(2000).then(() => {
			console.log('1');
			return 1;
		});

		const ajax2 = () => timeout(1000).then(() => {
			console.log('2');
			return 2;
		});

		const ajax3 = () => timeout(2000).then(() => {
			console.log('3');
			return 3;
		});

		const mergePromise = ajaxArray => {
			// Implement your code here
			// ;
			var _result = [];
			var _exec = "(data) => {_result.push(data); resolve(_result);}";
			for (var i = ajaxArray.length - 1; i >= 0; i--) {
				if(i != 0)	{
					_exec = "(data) => {_result.push(data);ajaxArray[" + i + "]().then(" + _exec + ")}";
				}
				else {
					_exec = "ajaxArray[0]().then(" + _exec + ")";
				} 
			}
			return Promise.all([new Promise((resolve, reject) => {eval(_exec)}).then(data=>{return data;})]).then(data => {return data[0]})

		}

		mergePromise([ajax1, ajax2, ajax3]).then(data => {

			console.log('done');
			console.log(data); // data is [1, 2, 3]
		});

		// Separate output
		// 1
		// 2
		// 3
		// done
		// [1, 2, 3]
	</script>

</body>
</html>

What we learned from the Internet:

The meaning of = >

(x) => x + 6

Amount to

function(x){
    return x + 6;
};

Promise is a solution for asynchronous programming, which is more reasonable and powerful than traditional solutions (callback functions and events).

Promise.all waits for all to complete and returns the execution results in the order of parameters, which are passed to then as parameters.

var promise1 = Promise.resolve(3);
var promise2 = 42;
var promise3 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 3000, 'foo');
});

Promise.all([promise1, promise2, promise3]).then(function(values) {
  console.log(values);
});
console.log("666")
// expected output: Array [3, 42, "foo"]

The instantiated Promise has three states:

Fulfilled: has resolved, which indicates a successful solution. At this time, onFulfilled will be called
Rejected: has rejected, indicating that the solution failed. At this time, onRejected will be called
Pending: unresolve d, indicating the status to be resolved, neither resolve nor reject. This is the initial state of the promise object after it is created

Using Promise.all returns a Promise object. When the asynchronous operation to be executed is not finished, the Promise state is Pending. When the processing is finished, the state turns to Fulfilled, which ensures that the console.log(data) must be executed after ajax3.
```
mergePromise([ajax1, ajax2, ajax3]).then(data => {

			console.log('done');
			console.log(data); // data is [1, 2, 3]
		});
```
Don't spray! Welcome to exchange!

Posted by php_dev_101 on Fri, 31 Jan 2020 08:23:31 -0800

Programmer Group

An evaluation question of Ali

What we learned from the Internet:

Hot Keywords