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

資訊專欄INFORMATION COLUMN

Promise and Reduce

saucxs / 1744人閱讀

摘要:組織代碼版解決異步的問題。點評總讓人感覺就是為了而存在一些人巧妙的把封裝到彈窗組件上。這樣才能發揮它阻止代碼的功效不少人認為,這是一個然并卵的東西,項目中很少使用,甚至不使用。

Promise 組織代碼 Promise ajax版promise,解決異步的問題。
ajax1().then(ajax2).then(ajax3).then(()=>{})
點評:總讓人感覺promise就是為了ajax而存在
一些人巧妙的把promise 封裝到 彈窗組件上。
//callback 模式
alert("您確定要刪除這條數據嗎",()=>{
        console.log("刪除成功")
    },()=>{
        console.log("取消刪除")
    })
    
//promise 化,意義貌似有點不大?。?!
alert("您確定要刪除這條數據嗎").then(()=>console.log("刪除成功")).catch(()=>console.log("取消刪除"))
點評:想法很好,終于突破了ajax,但是如果單純的如此使用,覺得有點“故弄玄虛”
個人覺得promise使用的場景,應該傾向有點小復雜的場景
function enSureDelete(){
    return new Promise((resolve,reject)=>{
        alert("你確定要添加這個用戶嗎",()=>resolve,()=>reject)
    })
}
function validateUser(){
    return new Promise((resolve,reject)=>{
        let username=$("id").val()
        if(username){
            resolve()
        }else{
            reject({msg:"不可為空"})
        }
    })  
}
function submitAPi(){
    return new Promise((resolve,reject)=>{
        $.ajax({success:resolve,error:reject})
    })
}
$(button).click(()=>{
  enSureDelete().then(validateUser).then(submitAPi).catch(({msg})=>msg&&Tip(msg))
})
點評:感覺可以片面的去認為,使用promise 就是為了使用它的then和catch ,而且是奔著它多個then 和 一個catch 而去。這樣才能發揮它阻止代碼的功效
    $p().then().then().then().catch()
Promise && reduce reduce
不少人認為 reduce ,這是一個然并卵的東西,項目中很少使用,甚至不使用。如果統計使用率,估計map>foreach>filter>sort>some>every>...>reduce
let a=[1,2,3,4]
let sum=a.reduce((a,b)=>a+b,0)
這個例子真心不陌生,想想也是,項目中即使有這種需求,正常都會 for/map/foreach 去累計。reduce 感覺剛被造出來,就已經out
但是 reduce 最彪悍
舉個例子,寫過爬蟲的朋友,不管你是看別人的代碼,還是自己寫代碼,一定對以下代碼相當熟悉
let page=0,total=100
function runTask(page){
    request(`//www.xxx.com/${page}.html`).then(()=>{
        //todo
        //....
        page++
        if(page
開始放大招
let arr=[]
for(let i=0;i<100;i++){
    arr.push(request(`//www.xxx.com/${page}.html`))
}
let $p=arr.reduce((a,b)=>{
return a.then(()=>{
        return b().then(()=>{
                //todo
                return data
        })
    })
},Promise.resolve())

$p.then().catch()
當然我還可以優化下,來10個并發
let arr={}
for(let i=0;i<100;i++){
    let a=parseInt(1/10)
    arr[a]=arr[a]||[]
    arr[a].push(request(`//www.xxx.com/${page}.html`))
}
arr=Array.from(arr)
let $p=arr.reduce((a,b)=>{
return a.then(()=>{
    return Promise.all(b).then(()=>{...})
})
},Promise.resolve())

$p.then().catch()
再來一波跟驗證有關的
const Rules={
    Required(msg){//驗證字段是否為空
        return(value){
            if(value){
                return {succ:true}
            }else{
                return {succ:false,msg}
            }
        }
    },
    ...
}
const validates = [//構造驗證規則
            { fn: Rules.Required("請填寫有效的姓名!"), value: $("name").val() },
            { fn: Rules.Illegal("姓名", { min: 2, max: 11 }), value: $("name").val() },
            { fn: Rules.Required("請填寫有效的身份證!"), value: $("shenfenzheng").val() },
            { fn: Rules.Certificate(_certNo), value: $("shenfenzheng").val() }
        ]
        const $P = validates.reduce((p, rule) => {
            return p.then(() => {
                return new Promise((resolve, reject) => {
                    let _R = rule.fn(rule.value)
                    if (_R.succ) {
                        resolve()
                    } else {
                        reject(_R)
                    }
                })
            })
        }, Promise.resolve())

        $P.then(() => {
            return $.ajax().then(()=>{//todo})
        }).catch(err => Toast.info(err.msg))

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/94875.html

相關文章

  • 精讀《用 Reduce 實現 Promise 串行執行》

    摘要:引言本周精讀的文章是,講了如何利用實現串行執行??偨Y串行隊列一般情況下用的不多,因為串行會阻塞,而用戶交互往往是并行的。更多討論討論地址是精讀用實現串行執行如果你想參與討論,請點擊這里,每周都有新的主題,周末或周一發布。 1 引言 本周精讀的文章是 why-using-reduce-to-sequentially-resolve-promises-works,講了如何利用 reduce...

    JinB 評論0 收藏0
  • JavaScript Promise:去而復返

    摘要:的比較接近,如下創建的構造器接受一個函數作為參數,它會傳遞給這個回調函數兩個變量和。在回調函數中做一些異步操作,成功之后調用,否則調用。另外還要注意,也沒有遵循給否定回調函數傳遞對象的慣例。當你從的回調函數返回的時候,這里有點小魔法。 原文:http://www.html5rocks.com/en/tutorials/es6/promises/ 作者:Jake Archibald 翻譯...

    Lowky 評論0 收藏0
  • 30s js代碼片段 翻譯

    摘要:可否被整除使用模運算符來檢查余數是否等于。數值增加序號后綴使用模運算符來查找單位數和十位數的值。 這是對 github 上30s代碼片段的翻譯整理,由于作者的文檔是通過腳本生成的,也就懶得去提pull了,整理了放到博客上供大家學習參考,后續會持續跟進翻譯。 Array Array concatenation (合并參數) 使用 Array.concat() 來連接參數中的任何數組或值。...

    sevi_stuo 評論0 收藏0
  • 我們不背誦 API,只實現 API

    摘要:接下來,我們換一種思路,用一個相對較新的來實現方法。從這道題目看出,相比考察死記硬背,這樣的實現更有意義。對數組的操作我們不能陌生,其中方法更要做到駕輕就熟。最后,我們再看下社區上著名的和的實現。 有不少剛入行的同學跟我說:JavaScript 很多 API 記不清楚怎么辦?數組的這方法、那方法總是傻傻分不清楚,該如何是好?操作 DOM 的方式今天記,明天忘,真讓人奔潰! 甚至有的開發...

    wudengzan 評論0 收藏0

發表評論

0條評論

saucxs

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<