成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

ES6 系列之異步處理實(shí)戰(zhàn)

amuqiao / 1313人閱讀

摘要:前言我們以查找指定目錄下的最大文件為例,感受從回調(diào)函數(shù)異步處理方式的改變。此外,該對(duì)象還有一個(gè)方法可以判斷正在處理的到底是一個(gè)文件,還是一個(gè)目錄。如果有錯(cuò)誤或者不嚴(yán)謹(jǐn)?shù)牡胤?,?qǐng)務(wù)必給予指正,十分感謝。

前言

我們以查找指定目錄下的最大文件為例,感受從

回調(diào)函數(shù) -> Promise -> Generator -> Async

異步處理方式的改變。

API 介紹

為了實(shí)現(xiàn)這個(gè)功能,我們需要用到幾個(gè) Nodejs 的 API,所以我們來簡(jiǎn)單介紹一下。

fs.readdir

readdir 方法用于讀取目錄,返回一個(gè)包含文件和目錄的數(shù)組。

fs.stat

stat 方法的參數(shù)是一個(gè)文件或目錄,它產(chǎn)生一個(gè)對(duì)象,該對(duì)象包含了該文件或目錄的具體信息。此外,該對(duì)象還有一個(gè) isFile() 方法可以判斷正在處理的到底是一個(gè)文件,還是一個(gè)目錄。

思路分析

我們基本的實(shí)現(xiàn)思路就是:

fs.readdir 獲取指定目錄的內(nèi)容信息

循環(huán)遍歷內(nèi)容信息,使用 fs.stat 獲取該文件或者目錄的具體信息

將具體信息儲(chǔ)存起來

當(dāng)全部?jī)?chǔ)存起來后,篩選其中的是文件的信息

遍歷比較,找出最大文件

獲取并返回最大文件

然后我們直接上代碼吧。

回調(diào)函數(shù)
var fs = require("fs");
var path = require("path");

function findLargest(dir, cb) {
    // 讀取目錄下的所有文件
    fs.readdir(dir, function(er, files) {
        if (er) return cb(er);

        var counter = files.length;
        var errored = false;
        var stats = [];

        files.forEach(function(file, index) {
            // 讀取文件信息
            fs.stat(path.join(dir, file), function(er, stat) {

                if (errored) return;

                if (er) {
                    errored = true;
                    return cb(er);
                }

                stats[index] = stat;

                // 事先算好有多少個(gè)文件,讀完 1 個(gè)文件信息,計(jì)數(shù)減 1,當(dāng)為 0 時(shí),說明讀取完畢,此時(shí)執(zhí)行最終的比較操作
                if (--counter == 0) {

                    var largest = stats
                        .filter(function(stat) { return stat.isFile() })
                        .reduce(function(prev, next) {
                            if (prev.size > next.size) return prev
                            return next
                        })

                    cb(null, files[stats.indexOf(largest)])
                }
            })
        })
    })
}

使用方式為:

// 查找當(dāng)前目錄最大的文件
findLargest("./", function(er, filename) {
    if (er) return console.error(er)
    console.log("largest file was:", filename)
});
Promise
var fs = require("fs");
var path = require("path");

var readDir = function(dir) {
    return new Promise(function(resolve, reject) {
        fs.readdir(dir, function(err, files) {
            if (err) reject(err);
            resolve(files)
        })
    })
}

var stat = function(path) {
    return new Promise(function(resolve, reject) {
        fs.stat(path, function(err, stat) {
            if (err) reject(err)
            resolve(stat)
        })
    })
}

function findLargest(dir) {
    return readDir(dir)
        .then(function(files) {
            let promises = files.map(file => stat(path.join(dir, file)))
            return Promise.all(promises).then(function(stats) {
                return { stats, files }
            })
        })
        .then(data => {

            let largest = data.stats
                .filter(function(stat) { return stat.isFile() })
                .reduce((prev, next) => {
                    if (prev.size > next.size) return prev
                    return next
                })

            return data.files[data.stats.indexOf(largest)]
        })

}

使用方式為:

findLargest("./")
.then(function(filename) {
    console.log("largest file was:", filename);
})
.catch(function() {
    console.log(error);
});
Generator
var fs = require("fs");
var path = require("path");

var co = require("co")

var readDir = function(dir) {
    return new Promise(function(resolve, reject) {
        fs.readdir(dir, function(err, files) {
            if (err) reject(err);
            resolve(files)
        })
    })
}

var stat = function(path) {
    return new Promise(function(resolve, reject) {
        fs.stat(path, function(err, stat) {
            if (err) reject(err)
            resolve(stat)
        })
    })
}

function* findLargest(dir) {
    var files = yield readDir(dir);
    var stats = yield files.map(function(file) {
        return stat(path.join(dir, file))
    })

    let largest = stats
        .filter(function(stat) { return stat.isFile() })
        .reduce((prev, next) => {
            if (prev.size > next.size) return prev
            return next
        })

    return files[stats.indexOf(largest)]

}

使用方式為:

co(findLargest, "./")
.then(function(filename) {
    console.log("largest file was:", filename);
})
.catch(function() {
    console.log(error);
});
Async
var fs = require("fs");
var path = require("path");

var readDir = function(dir) {
    return new Promise(function(resolve, reject) {
        fs.readdir(dir, function(err, files) {
            if (err) reject(err);
            resolve(files)
        })
    })
}

var stat = function(path) {
    return new Promise(function(resolve, reject) {
        fs.stat(path, function(err, stat) {
            if (err) reject(err)
            resolve(stat)
        })
    })
}

async function findLargest(dir) {
    var files = await readDir(dir);

    let promises = files.map(file => stat(path.join(dir, file)))
    var stats = await Promise.all(promises)

    let largest = stats
        .filter(function(stat) { return stat.isFile() })
        .reduce((prev, next) => {
            if (prev.size > next.size) return prev
            return next
        })

    return files[stats.indexOf(largest)]

}

使用方式為:

findLargest("./")
.then(function(filename) {
    console.log("largest file was:", filename);
})
.catch(function() {
    console.log(error);
});
ES6 系列

ES6 系列目錄地址:https://github.com/mqyqingfeng/Blog

ES6 系列預(yù)計(jì)寫二十篇左右,旨在加深 ES6 部分知識(shí)點(diǎn)的理解,重點(diǎn)講解塊級(jí)作用域、標(biāo)簽?zāi)0?、箭頭函數(shù)、Symbol、Set、Map 以及 Promise 的模擬實(shí)現(xiàn)、模塊加載方案、異步處理等內(nèi)容。

如果有錯(cuò)誤或者不嚴(yán)謹(jǐn)?shù)牡胤剑?qǐng)務(wù)必給予指正,十分感謝。如果喜歡或者有所啟發(fā),歡迎 star,對(duì)作者也是一種鼓勵(lì)。

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

轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/98677.html

相關(guān)文章

  • JS筆記

    摘要:從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好,我們就需要引入來降低異步編程的復(fù)雜性。異步編程入門的全稱是前端經(jīng)典面試題從輸入到頁(yè)面加載發(fā)生了什么這是一篇開發(fā)的科普類文章,涉及到優(yōu)化等多個(gè)方面。 TypeScript 入門教程 從 JavaScript 程序員的角度總結(jié)思考,循序漸進(jìn)的理解 TypeScript。 網(wǎng)絡(luò)基礎(chǔ)知識(shí)之 HTTP 協(xié)議 詳細(xì)介紹 HTT...

    rottengeek 評(píng)論0 收藏0
  • javascript異步與promise

    摘要:到這里,我已經(jīng)發(fā)出了一個(gè)請(qǐng)求買漢堡,啟動(dòng)了一次交易。但是做漢堡需要時(shí)間,我不能馬上得到這個(gè)漢堡,收銀員給我一個(gè)收據(jù)來代替漢堡。到這里,收據(jù)就是一個(gè)承諾保證我最后能得到漢堡。 同期異步系列文章推薦談一談javascript異步j(luò)avascript異步中的回調(diào)javascript異步之Promise.all()、Promise.race()、Promise.finally()javascr...

    rollback 評(píng)論0 收藏0
  • 1月份前端資源分享

    摘要:更多資源請(qǐng)文章轉(zhuǎn)自月份前端資源分享視頻前端技術(shù)論壇融合不可錯(cuò)過的迷你庫(kù)測(cè)試框架實(shí)例教程為你詳細(xì)解讀請(qǐng)求頭的具體含意解析的庫(kù)如果要用前端框架,開發(fā)流程是怎樣的與有什么區(qū)別正確使用的方法是什么流程圖插件小如何讓元素只能輸入純文本前端技術(shù)中 更多資源請(qǐng)Star:https://github.com/maidishike... 文章轉(zhuǎn)自:https://github.com/jsfront...

    solocoder 評(píng)論0 收藏0
  • ES6 系列我們來聊聊 Async

    摘要:標(biāo)準(zhǔn)引入了函數(shù),使得異步操作變得更加方便。在異步處理上,函數(shù)就是函數(shù)的語(yǔ)法糖。在實(shí)際項(xiàng)目中,錯(cuò)誤處理邏輯可能會(huì)很復(fù)雜,這會(huì)導(dǎo)致冗余的代碼。的出現(xiàn)使得就可以捕獲同步和異步的錯(cuò)誤。如果有錯(cuò)誤或者不嚴(yán)謹(jǐn)?shù)牡胤?,?qǐng)務(wù)必給予指正,十分感謝。 async ES2017 標(biāo)準(zhǔn)引入了 async 函數(shù),使得異步操作變得更加方便。 在異步處理上,async 函數(shù)就是 Generator 函數(shù)的語(yǔ)法糖。 ...

    Songlcy 評(píng)論0 收藏0
  • ES6 系列我們來聊聊 Promise

    前言 Promise 的基本使用可以看阮一峰老師的 《ECMAScript 6 入門》。 我們來聊點(diǎn)其他的。 回調(diào) 說起 Promise,我們一般都會(huì)從回調(diào)或者回調(diào)地獄說起,那么使用回調(diào)到底會(huì)導(dǎo)致哪些不好的地方呢? 1. 回調(diào)嵌套 使用回調(diào),我們很有可能會(huì)將業(yè)務(wù)代碼寫成如下這種形式: doA( function(){ doB(); doC( function(){ ...

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

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

0條評(píng)論

amuqiao

|高級(jí)講師

TA的文章

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