async怎么读,关于Javascript中defer和async的区别总结
async怎么读,关于Javascript中defer和async的区别总结详细介绍
本文目录一览： 关于Javascript中defer和async的区别总结
1. 在网络读取（脚本下载）方面，`defer`和`async`都展现了异步的特性，与HTML解析相比，它们能够让脚本下载不阻塞页面的其他渲染过程。
2. 二者的主要区别在于脚本下载完成后何时执行。其中，`defer`更贴合我们对应用脚本加载与执行的需求。具体来说，`defer`是即刻下载但延迟执行，当后续文档元素加载时，脚本也在异步状态下被加载。然而，脚本的执行必须等到所有元素解析完毕、DOMContentLoaded事件触发之前才能进行。
3. 关于`defer`的另一重要点是，它是按照脚本的加载顺序来执行脚本的。这确保了如果页面中有多个`defer`脚本，它们将按照加载的顺序依次执行。
4. 相比之下，标记为`async`的脚本并不遵循特定的执行顺序。对于`async`来说，脚本的加载与执行是紧密相连的。无论声明的顺序如何，只要脚本加载完成，它就会立即执行。这意味着`async`并不保证按照指定顺序执行脚本，这也带来了更大的灵活性。
5. 尽管`async`对于依赖性较强的应用脚本用处不大，因为它忽略了甚至是最基本的顺序执行依赖，但对于那些不依赖任何其他脚本或不被任何其他脚本依赖的独立脚本来说，`async`却是非常适用的。它能够使这些脚本在页面加载过程中尽快地执行，而不受其他脚本的影响。
总的来说，无论是`defer`还是`async`，都是为了优化网页性能和脚本执行顺序而设计的特性。它们各有适用的场景和优势，开发人员需要根据具体的应用需求来选择使用哪一种。
怎样优化nodeAsyncAwait异步编程
**优化Node.js的Async/Await异步编程及注意事项**
一、异步编程的优化利器
在JavaScript编程中，异步操作一直是一个令人头疼的问题。从早期的回调函数到现代的Promise、Generator以及现在的Async/Await，每次技术的进步都为解决这一问题提供了新的方案。而Async/Await的出现，被许多人认为是异步编程的“终极解决方案”。
二、Async/Await的基本用法
Async函数返回一个Promise对象，我们可以使用`then`方法添加回调函数。当函数执行时，一旦遇到`await`就会暂停执行，等待触发的异步操作完成后再继续执行函数体内的后续语句。
例如：
```javascript
var sleep = function(time) {
return new Promise(function(resolve) {
setTimeout(function() { resolve(); }, time);
});
};
var start = async function() {
console.log('start');
await sleep(3000); // 暂停3秒
console.log('end'); // 3秒后输出
start();
```
执行上述代码，控制台会先输出“start”，等待约3秒后输出“end”。
三、Async/Await使用注意事项
1. **await的使用范围**：`await`命令只能用在`async`函数之中。如果用在普通函数中，会报错。
```javascript
// 错误示例：await不能在普通函数中使用
function dbFuc(db) {
let docs = [{}, {}, {}];
docs.forEach(function(doc) {
await db.post(doc); // 这里会报错，因为await不在async函数中
});
}
```
2. **await的作用**：`await`表示在此等待Promise的返回结果后再继续执行。当Promise完成时，它的结果会被赋值给`await`后面的表达式。
var sleep = function(time) { // ... }; // 如上例所示的sleep函数
var start = async function() {
let result = await sleep(3000); // 等待sleep Promise完成，并将结果赋值给result变量
console.log(result); // 输出'ok'（假设Promise正常解决）
3. **await与Promise的关系**：`await`后面应跟着一个Promise对象。对于同步执行的代码，不需要使用`await`修饰。此外，`await`只能用于原生JavaScript语法中，如在`forEEach`结构中使用`await`是不行的，应使用原生的for循环语法。
// 错误示例：在forEach中使用await无法正常工作
async function dbFuc(db) { // ... } // 如上例所示的dbFuc函数无法正确使用await在forEach中。
若需并发执行多个请求，可以使用`Promise.all()`方法。
async function dbFuc(db) { // ... } // 正确使用Promise.all并发执行多个请求的示例。
4. **错误处理**：既然`.then()`和`.catch()`不再需要显式编写，我们可以使用标准的try-catch语法来捕捉错误。这大大简化了错误处理的代码。