代码拉取完成,页面将自动刷新
srcset="/files/16864/clock-demo-200px.png 1x, /files/16797/clock-demo-400px.png 2x"
,background-image: -webkit-image-set( url(xxx) 1x, url(xxx) 2x, url(xxx) 600dpi);
createDocumentFragment
,createdocumentfragment()方法创建了一虚拟的节点对象,节点对象包含所有属性和方法。因为js是单线程,为了避免I/O阻塞,则存在事件循环机制;js为什么是单线程:避免问题变复杂,比如两个线程同时操作一个dom,浏览器就不知道以哪个线程为准。
每执行完一轮宏任务和微任务就叫做一轮事件,如此往复便是事件循环;
一轮事件循环,会执行一次宏任务,以及所有的微任务
setTimeout(() => {
console.log('settimeout');
})
Promise.resolve().then(() => {
console.log('promise1');
Promise.resolve().then(() => {
console.log('promise2');
Promise.resolve().then(() => {
console.log('promise3');
})
})
})
console.log('main');
// 输出:mian promise1 promise2 promise3 settimeout
I/O中先进先出
// 第一个先进I/O
setTimeout(() => {
Promise.resolve().then(() => {
console.log('promise');
})
})
Promise.resolve().then(() => {
// 第二个进I/O
setTimeout(() => {
console.log('settimeout');
})
})
console.log('main');
// 输出:mian promise settimeout
任务队列分为:同步任务、异步任务,避免异步任务阻塞;如遇到异步任务,则会添加到I/O(异步等待)中
宏任务队列有多个,微任务队列只有一个
如果有新的异步宏任务,则会创建新的宏任务队列,然后宏任务队列会包含一个微任务队列
以上每项为事件循环的一个阶段,这6个阶段称为一轮事件循环。
I/O -> poll -> check -> timers
const fs = require('fs');
const path = require('path');
function someAsync(callback) {
// 假设花费两毫秒
fs.readFile(__dirname + '/' + __filename, callback);
}
const timeoutScheduled = Date.now();
let fileReadTime = 0;
setTimeout(() => {
const delay = Date.now() - timeoutScheduled;
console.log('setTimeout: ' + delay + 'ms have passed since i was scheduled');
console.log('fileReadTime', fileReadTime - timeoutScheduled);
}, 10)
someAsync(function () {
fileReadTime = Date.now();
while (Date.now() - fileReadTime < 20) {
}
})
// 输出:
// setTimeout: 22ms have passed since i was scheduled
// fileReadTime 2
// I/O -> poll -> timers
/*
1、setTimeout-callback、someAsync-callback进入I/O;
2、当到达2ms,将someAsync-callback添加进poll,此时会阻塞poll;
3、当到达22ms,会将setTimeout-callback添加进timers,再执行
注意:因为poll的阻塞,导致setTimeout-callback原本应该在10ms后执行,结果却是22ms后执行
*/
setTimeout(() => {
console.log('timeout');
})
setImmediate(() => {
console.log('immed');
})
// 以上执行顺序不确定
fs.readFile('./test.js', () => {
setTimeout(() => {
console.log('timeout');
})
setImmediate(() => {
console.log('immed');
})
})
// 以上执行顺序:immed -> timeout
/*
解释:
1、因为在nodejs中setTimeout(callback, 0) === setTimeout(callback, 1),
而浏览器setTimeout(callback, 0) === setTimeout(callback, 4);
因为0ms是同步的;
2、然后因为event loop启动也是需要时间的,所以有时候耗时1ms,有时候不需要1ms
*/
process.nextTick
不在event loop任何阶段执行,而是在各个阶段切换的中间执行,即进入下一阶段前执行
const fs = require('fs');
fs.readFile('./test.js', () => {
setTimeout(() => {
console.log('setTimeout');
})
setImmediate(() => {
console.log('setImmediate');
process.nextTick(() => {
console.log('nextTick3');
})
})
process.nextTick(() => {
console.log('nextTick1');
})
process.nextTick(() => {
console.log('nextTick2');
})
})
// nextTick1 nextTick2 setImmediate nextTick3 setTimeout
// poll(fs.readFile) -> nextTick1、nextTick2 ->check(setImmediate) -> nextTick3 -> timers(setTimeout)
定义:闭包是指有权访问另一个函数作用域中变量的函数。
产生:内部的函数存在外部作用域的引用就会导致闭包。
过程:
作用:
应用:
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。