国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

前端原理_異步與單線程

NoraXie / 2174人閱讀

摘要：單線程什么是單線程語言的執(zhí)行環(huán)境是單線程所謂單線程，就是指一次只能完成一件任務(wù)。如果有多個(gè)任務(wù)，就必須排隊(duì)，前面一個(gè)任務(wù)完成，再執(zhí)行后面一個(gè)任務(wù)，以此類推。

單線程

什么是單線程？

Javascript語言的執(zhí)行環(huán)境是"單線程"（single thread）
所謂"單線程"，就是指一次只能完成一件任務(wù)。
如果有多個(gè)任務(wù)，就必須排隊(duì)，前面一個(gè)任務(wù)完成，再執(zhí)行后面一個(gè)任務(wù)，以此類推。

執(zhí)行JS代碼的是JS引擎（JS引擎就是單線程，所以叫JS引擎線程）

單線程的好處與產(chǎn)生的問題

好處：
實(shí)現(xiàn)起來比較簡單，執(zhí)行環(huán)境相對(duì)單純

產(chǎn)生問題：
只要有一個(gè)任務(wù)耗時(shí)很長，后面的任務(wù)都必須排隊(duì)等著，會(huì)拖延整個(gè)程序的執(zhí)行。

常見的瀏覽器無響應(yīng)（假死），往往就是因?yàn)槟骋欢蜫avascript代碼長時(shí)間運(yùn)行（比如死循環(huán)），
導(dǎo)致整個(gè)頁面卡在這個(gè)地方，其他任務(wù)無法執(zhí)行。

單線程解決方案

為了單線程（JS引擎線程）不卡死，所以出現(xiàn)“異步 ”這個(gè)解決方案
異步

前端中有哪些操作屬于異步操作？

1、定時(shí)器
2、ajax請求
3、io操作

共性：一些耗時(shí)操作一般使用異步

注意：事件綁定不屬于異步操作，只是采用了異步編程處理方式（回調(diào)函數(shù)）而已

異步編程處理方式

1、回調(diào)函數(shù)
2、Promise
3、await/async  （最好解決方案）
回調(diào)函數(shù) 
最早出現(xiàn)的處理異步編程的方式（兼容性最好，但不推薦）
回調(diào)函數(shù)方式最大的問題是：回調(diào)地獄
回調(diào)地獄是代碼閱讀性差，項(xiàng)目維護(hù)性差


setTimeout(function (name) {
  var catList = name + ",";

  setTimeout(function (name) {
    catList += name + ",";

    setTimeout(function (name) {
      catList += name + ",";
      
    }, 1, "Lynx");
    
  }, 1, "Jaguar");

}, 1, "Panther");

如果當(dāng)前網(wǎng)絡(luò)請求需要依賴前一個(gè)網(wǎng)絡(luò)請求，以此類推，這就叫回調(diào)地獄
Promise 
ES6出現(xiàn)的處理異步編程的方式，主要是為了解決回調(diào)地獄問題

三種狀態(tài)

1、pending：初始狀態(tài)，后面then（）的傳參函數(shù)不會(huì)執(zhí)行
2、resolved：成功狀態(tài)
3、rejected：失敗狀態(tài)

基本用法

通過Promise構(gòu)建函數(shù)，創(chuàng)建一個(gè)處理異步任務(wù)的對(duì)象

箭頭函數(shù)方式：
const p = new Promise((resolve, reject)=>{ });

傳統(tǒng)方式
const p = new Promise(function(resolve, reject){})
注意：
1、傳參函數(shù)的函數(shù)體會(huì)馬上執(zhí)行，而且是同步的
2、傳參函數(shù)的內(nèi)部沒有調(diào)用resolve()或reject()方法，那么Promise對(duì)象的狀態(tài)依舊是pending，后面then()不會(huì)執(zhí)
3、傳參函數(shù)的函數(shù)體內(nèi)，主要放的是異步操作代碼
4、傳參函數(shù)的函數(shù)體內(nèi)，調(diào)用resolve()時(shí)，Promise實(shí)例的狀態(tài)將由pending轉(zhuǎn)resolved
5、傳參函數(shù)的函數(shù)體內(nèi)，調(diào)用reject()時(shí)，Promise實(shí)例的狀態(tài)將由pending轉(zhuǎn)rejected
6、resolve()或者reject()，只能傳一個(gè)參數(shù)

實(shí)例方法 then 

用法：
const p = new Promise((resolve, reject)=>{ });
p.then(data=>{ }).then(data=>{ })

then函數(shù)的返回值：
是一個(gè)全新的Promise對(duì)象，與調(diào)用then()的Promise對(duì)象不同

1、p為resolved狀態(tài)下，then傳遞的函數(shù)中，如果沒有返回值：
const pp = p.then(data=>{
    console.log("go");
});

那么pp的狀態(tài)繼承p是resolved，而攜帶的參數(shù)為undefined

2、p為resolved狀態(tài)下，then傳遞的函數(shù)中，如果有返回值是非Promise對(duì)象：
const pp = p.then(data=>{
    return "你好";
});

那么pp的狀態(tài)繼承p是resolved，而攜帶的參數(shù)為"你好"

3、p為resolved狀態(tài)下，then傳遞的函數(shù)中，如果有返回值是Promise對(duì)象：
const pp = p.then(data=>{
    return new Promise((resolve, reject)=>{
        reject();
    });
});

那么pp的狀態(tài)是rejected(狀態(tài)可以修改)，而攜帶的參數(shù)為undefined

4、p為rejected狀態(tài)下，then傳遞的函數(shù)中沒有傳遞第二個(gè)函數(shù)時(shí)：
const pp = p.then(data=>{ });

那么pp的狀態(tài)繼承p是rejected，而攜帶的參數(shù)也繼承p
注意：
1、如果調(diào)用resolve()或者reject()方法時(shí)，沒有傳一個(gè)參數(shù)，那么then()中傳的函數(shù)就沒有接收參數(shù)，data為undefined
2、只要Promise狀態(tài)不是pending，那么then中傳的函數(shù)就會(huì)執(zhí)行，一般只傳一個(gè)函數(shù)作為參數(shù)
3、調(diào)用then()時(shí)，只要不傳函數(shù)作為參數(shù)，那么生成的新Promise對(duì)象，狀態(tài)繼承，參數(shù)也繼承

實(shí)例方法 catch 

主要用于處理 rejected失敗狀態(tài) 的
.catch(error=>{ })只是一個(gè)then的別名

等同于
then(null, error=>{ }) 或 then(undefined, error=>{ })

catch的返回值：
也是一個(gè)全新的Promise對(duì)象，該對(duì)象的狀態(tài)和攜帶參數(shù) 與 then四種情況一樣

當(dāng)沒有返回值時(shí)，狀態(tài)繼承是rejected，而攜帶的參數(shù)為undefined

靜態(tài)方法 all 

多個(gè)Promise對(duì)象并行執(zhí)行，最后所有的Promise對(duì)象執(zhí)行完成后，再執(zhí)行最后的Promise對(duì)象

靜態(tài)方法 race

await/async 
ES7出現(xiàn)的處理異步編程的方式（強(qiáng)烈推薦）
JS異步實(shí)現(xiàn)原理 
瀏覽器中的JS引擎是單線程的（解析JS是單線程的），但瀏覽器是多進(jìn)程的

任務(wù)類別

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/98403.html

相關(guān)文章

  • Javag工程師成神之路（2019正式版）

    摘要：結(jié)構(gòu)型模式適配器模式橋接模式裝飾模式組合模式外觀模式享元模式代理模式。行為型模式模版方法模式命令模式迭代器模式觀察者模式中介者模式備忘錄模式解釋器模式模式狀態(tài)模式策略模式職責(zé)鏈模式責(zé)任鏈模式訪問者模式。 主要版本 更新時(shí)間 備注 v1.0 2015-08-01 首次發(fā)布 v1.1 2018-03-12 增加新技術(shù)知識(shí)、完善知識(shí)體系 v2.0 2019-02-19 結(jié)構(gòu)...

    Olivia 評(píng)論0 收藏0

  • 入門架構(gòu)——單機(jī)高性能

    摘要：協(xié)作方式在高并發(fā)場景中，必須要讓服務(wù)器同時(shí)維護(hù)大量請求連接，可能是一個(gè)服務(wù)進(jìn)程創(chuàng)建另一個(gè)進(jìn)程，也可能是一個(gè)服務(wù)線程去創(chuàng)建另一個(gè)線程，但連接結(jié)束后進(jìn)程或線程就銷毀了，這是一個(gè)巨大的浪費(fèi)一個(gè)自然的想法就是通過創(chuàng)建一個(gè)進(jìn)程線程池從而達(dá)到資源復(fù)用， showImg(https://segmentfault.com/img/bVbtgn1?w=313&h=208); 協(xié)作方式 在高并發(fā)場景中，必...

    UCloud 評(píng)論0 收藏0

  • 你和阿里資深架構(gòu)師之間，差的不僅僅是年齡（進(jìn)階必看）

    摘要：導(dǎo)讀閱讀本文需要有足夠的時(shí)間，筆者會(huì)由淺到深帶你一步一步了解一個(gè)資深架構(gòu)師所要掌握的各類知識(shí)點(diǎn)，你也可以按照文章中所列的知識(shí)體系對(duì)比自身，對(duì)自己進(jìn)行查漏補(bǔ)缺，覺得本文對(duì)你有幫助的話，可以點(diǎn)贊關(guān)注一下。目錄一基礎(chǔ)篇二進(jìn)階篇三高級(jí)篇四架構(gòu)篇五擴(kuò) 導(dǎo)讀：閱讀本文需要有足夠的時(shí)間，筆者會(huì)由淺到深帶你一步一步了解一個(gè)資深架構(gòu)師所要掌握的各類知識(shí)點(diǎn)，你也可以按照文章中所列的知識(shí)體系對(duì)比自身，對(duì)自己...

    huaixiaoz 評(píng)論0 收藏0

  • 前端面試題大集合：來自真實(shí)大廠的532道面試題(只有題，沒有答案)

    答案自己谷歌或百度找。 一、來源背景 面試題是來自微博@牛客網(wǎng)發(fā)布的真實(shí)大廠前端面經(jīng)題目，我一直在收集題目長期一個(gè)一個(gè)的記錄下來的，可能會(huì)有重復(fù)，但基本前端的面試大綱和需要掌握的知識(shí)都在其中了，面試題僅做學(xué)習(xí)參考，學(xué)習(xí)者閱后也要用心鉆研其中的原理，重要知識(shí)需要系統(tǒng)學(xué)習(xí)、透徹學(xué)習(xí)，形成自己的知識(shí)鏈。 二、532道前端真實(shí)大廠面試題 express和koa的對(duì)比，兩者中間件的原理，koa捕獲異常多種情...

    Kerr1Gan 評(píng)論0 收藏0

  • 前端面試題大集合：來自真實(shí)大廠的532道面試題(只有題，沒有答案)

    答案自己谷歌或百度找。 一、來源背景 面試題是來自微博@牛客網(wǎng)發(fā)布的真實(shí)大廠前端面經(jīng)題目，我一直在收集題目長期一個(gè)一個(gè)的記錄下來的，可能會(huì)有重復(fù)，但基本前端的面試大綱和需要掌握的知識(shí)都在其中了，面試題僅做學(xué)習(xí)參考，學(xué)習(xí)者閱后也要用心鉆研其中的原理，重要知識(shí)需要系統(tǒng)學(xué)習(xí)、透徹學(xué)習(xí)，形成自己的知識(shí)鏈。 二、532道前端真實(shí)大廠面試題 express和koa的對(duì)比，兩者中間件的原理，koa捕獲異常多種情...

    lushan 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<