JavaScript学习

  在学习小程序期间,没有了解JavaScript,回来补充

1.异步编程

  同步按照代码顺序执行,异步不按照代码顺序执行,异步的执行效率更高,简单来说:一步就是从主线程发射一个子线程来完成任务。

1.1 什么时候用异步编程

  通常用子线程来完成一些可能消耗时间足够长以至于被用户察觉的事情,如读取一个大文件或者发出一个网络请求。因为子线程独立于主线程,所以及时出现阻塞也不会影响到主线程的运行。但是子线程有个局限:一旦发射了以后就会与主线程失去同步,我们无法确定它的结束,如果结束之后需要处理一些事情,比如处理来自服务器的信息,我们是无法将它合并到主线程的。所以,JavaScript中的异步操作函数往往通过回调函数来实现异步任务的结果处理。

1.2 回调函数

  回调函数就是一个函数,它是在启动一个异步任务时候告诉它:等你完成了这个任务之后要干什么。这样一来主线程几乎不用关心异步任务状态。详情链接

2.JavaSricpt Promist

  由于 Promise 是 ES6 新增加的,苹果的 Safari 10 和 Windows 的 Edge 14 版本以上浏览器才开始支持 ES6 特性。在微信小程序开发中,请求request我们就可以采用这个函数。

2.1 构造Promise

现在新建一个Proise对象:

1
2
3
new Promise(function (resolve, reject) {
// 要做的事情...
});

我们之前遇到的异步任务都是一次异步,如果需要多次调用异步函数呢?例如,如果我想分三次输出字符串,第一次间隔 1 秒,第二次间隔 4 秒,第三次间隔 3 秒:

1
2
3
4
5
6
7
8
9
setTimeout(function () {
console.log("First");
setTimeout(function () {
console.log("Second");
setTimeout(function () {
console.log("Third");
}, 3000);
}, 4000);
}, 1000);

以上代码非常冗杂,可以使用Promise进行优化:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
new Promise(function (resolve, reject) {
setTimeout(function () {
console.log("First");
resolve();
}, 1000);
})
.then(function () {
return new Promise(function (resolve, reject) {
setTimeout(function () {
console.log("Second");
resolve();
}, 4000);
});
})
.then(function () {
setTimeout(function () {
console.log("Third");
}, 3000);
});
Promise 将嵌套格式的代码变成了顺序格式的代码。