You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
setTimeout(function(){
console.log("this will be exectued after 1 second!");
},1000);
var start = new Date()
setTimeout(function(){
var end = new Date()
console.log(end - start)
},500)
while(new Date - start<1000){
}
因为 while 循环会持续一秒,线程繁忙,结果是大于等于 1000 的数字,可能会稍有不同,这是因为 setTimeout 很不精准。不过,这个数字至少是1000,因为setTimeout回调在while循环结束之前不可能被触发。
js 异步编程
参考
了解
Javascript语言的执行环境是”单线程”(single thread)。
所谓”单线程”:就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。这种模式的好处是实现起来比较简单,执行环境相对单纯;坏处是只要有一个任务耗时很长,后面的任务都必须排队等着,会拖延整个程序的执行。常见的浏览器无响应(假死),往往就是因为某一段Javascript代码长时间运行(比如死循环),导致整个页面卡在这个地方,其他任务无法执行。为了解决这个问题,Javascript语言将任务的执行模式分成两种:同步(Synchronous)和异步(Asynchronous)。
“同步模式” :就是上一段的模式,后一个任务等待前一个任务结束,然后再执行,程序的执行顺序与任务的排列顺序是一致的、同步的;”异步模式”则完全不同,每一个任务有一个或多个回调函数(callback),前一个任务结束后,不是执行后一个任务,而是执行回调函数,后一个任务则是不等前一个任务结束就执行,所以程序的执行顺序与任务的排列顺序是不一致的、异步的。
“异步模式”:非常重要。在浏览器端,耗时很长的操作都应该异步执行,避免浏览器失去响应,最好的例子就是Ajax操作。在服务器端,”异步模式”甚至是唯一的模式,因为执行环境是单线程的,如果允许同步执行所有http请求,服务器性能会急剧下降,很快就会失去响应。
js 运行机制
上图中,主线程运行的时候,产生堆(heap)和栈(stack),栈中的代码调用各种外部API,它们在"任务队列"中加入各种事件(click,load,done)。只要栈中的代码执行完毕,主线程就会去读取"任务队列",依次执行那些事件所对应的回调函数。
异步编程方式
回调函数 callback
回调函数多次回调后,代码可读性严重受阻。
回调地域
setTimeout 延时异步
因为 while 循环会持续一秒,线程繁忙,结果是大于等于 1000 的数字,可能会稍有不同,这是因为 setTimeout 很不精准。不过,这个数字至少是1000,因为setTimeout回调在while循环结束之前不可能被触发。
之所以会这样,全是因为 任务队列 的存在。
任务队列
类事件监听(jQuery)
这种方法的优点是比较容易理解,可以绑定多个事件,每个事件可以指定多个回调函数,JS 和 浏览器提供的原生方法基本都是基于事件触发机制的,耦合度很低,不过事件不能得到流程控制。
事件监听升级——设计模式 发布+订阅
jQuery.subscribe
这种方法的性质与”事件监听”类似,但是明显优于后者。因为我们可以通过查看”消息中心”,了解存在多少信号、每个信号有多少订阅者,从而监控程序的运行。
高阶函数(泛函数)
这种方法解耦程度很低,但是当参数过多时程序可读性非常不友好。地域回调
Promise对象
promise You-Dont-Know-JS
简单说,它的思想是,每一个异步任务返回一个Promise对象,该对象有一个then方法,允许指定回调函数。比如,f1的回调函数f2,可以写成: f1().then(f2);
Generator
Generator
ES6 引入的 Generator 可以理解为可在运行中转移控制权给其他代码,并在需要的时候返回继续执行的函数;利用 Generator 可以实现协程的功能。
所谓的协程,意思是多个线程互相协作,完成异步任务。
async/await
async
异步类库
promise 规范
xhr
script 标签
如果同时使用 defer 和 async ,async 会覆盖掉 defer 。
event loop 补充
一道面试题引发的“大事件”
The text was updated successfully, but these errors were encountered: