Как вернуть результат из вложенной функции?

Question

[Brendan Castaneda]

Помогите пожалуйста разобраться как вернуть результат из вложенной функции.
Я хотел бы вернуть прочитанные файлы переменной dateFiles.
Использую модуль glob.

const { src, dest, series } = require('gulp');
const glob = require("glob");
const fs = require('fs');

async function test1() {
    glob(__dirname + '/build/**/*.css', {}, (error, files) => {
        if (error) throw error;

        function readFiles() {
            let subarray = [];
            for (let name of files) {
                subarray = name.split();
                let globFile = subarray + '';
                let dateFiles = '';
                fs.readFile(globFile, "utf8",
                    function(error, data) {
                        if (error) throw error; 
                        // log('Асинхронное чтение файла');
                        // log(data); // выводим считанные данные
                        return dateFiles = data;
                    })
            }
        }
        readFiles();
        log(readFiles());
    })
}

exports.test1= series(test1);

Answer 1

[Rsa97]

glob - асинхронная функция. Соответственно, вызовы коллбэка происходят уже после завершения работы основной функции.
Можете использовать синхронный вариант glob.sync либо переписать код с использованием Promise и await.

Comments

[Brendan Castaneda]

Я извиняюсь но мне нужно показать рабочий пример, что-бы понять как это работает.
Я сейчас попробовал что-то поделать, но так ничего и не вышло.
Я собственно и накидал этот пример, что-бы понять как возвращать результат из подобного у меня с этим пока всё плохо.
Основная функция это async function test1() я так понима.
Выходит, что если использовать как есть glob(...) нужно дописывать с использованием Promise и await.
Я правильно понимаю?

[Rsa97]

Brendan Castaneda, Всё расписывать не буду, вот короткий пример

const getFileList = (mask) => new Promise(
  (resolve, reject) => glob(
    mask,
    {},
    (error, files) => {
      if (error) {
        reject(error);
      }
      resolve(files);
    },
  );
};

const cssFileList = await getFileList(`${__dirname}/build/**/*.css`);

[Brendan Castaneda]

Rsa97, Это сработало, спасибо вам! )
Только вот при выполнении функции обрабатываются все файлы если проверить вывод из console.log а если вернуть через resolve всегда возвращается один файл или смотря, что я возвращаю.
Ну т.е. не все файлы или не все строки а только одна самая первая по списку из всех.
Думается мне, что тут нужно что-то возвести в цикл... Наверное.

[Brendan Castaneda]

Rsa97, Подскажите пожалуйста как я могу это решить.

[Rsa97]

Brendan Castaneda, Не понял вашего вопроса.
Судя по документации, glob передаёт в callback массив с именами найденных файлов. Как вы умудряетесь получить только одно имя, я не знаю.

[Brendan Castaneda]

Rsa97,
Я перефразирую.
Я отслеживал через консоль причину того, почему приходит один файл.
Оказалось, что в функцию приходят все файлы, весь список.
Я закомментировал log(data); там на выходе будет текст всех файлов .css
А вот resolve(data); возвращает из функции только один текст, одного файла .css
Где я опять накосячил?)

async function test30() {

    const getFileList = (mask) => new Promise((resolve, reject) => glob(mask, {}, (error, files) => {
        if (error) {
            reject(error);
        }
        //#2pur Преобразуем массив путей в отдельные массивые путей и преобразуем эти массивы в строки.
        function readFiles() {
            let subarray = [];
            for (let name of files) {
                subarray = name.split();
                let globFile = subarray + "";
                //#2pur Читаем эти файлы из полученных путей к фалам в виде строк.
                fs.readFile(globFile, "utf8", function(error, data) {
                    if (error) throw error;
                    // log(data); // Выводим считанные данные
                    return resolve(data);
                });
            }
        }
        readFiles();
    }))

    const cssFileList = await getFileList(`${__dirname}/build/**/*.css`);
    log('----------------cssFileList----------------');
    log(cssFileList);
}

[Rsa97]

Brendan Castaneda, Промис завершается при первом вызове resolve или reject.

const getFileList = (mask) => new Promise(
  (resolve, reject) => glob(
    mask,
    {},
    (error, files) => {
      if (error) {
        reject(error);
      }
      resolve(files);
    },
  );
};

const cssFileList = await getFileList(`${__dirname}/build/**/*.css`);

const cssFileContentList = await Promise.all(
  cssFileList.map(
    (name) => fsPromises.readFile(name, { encoding: 'utf8' }),
  ),
);

console.log(cssFileContentList);

[Brendan Castaneda]

Rsa97, Получается если промис завершается при первом вызове resolve или reject тогда как можно обработать все файлы?
Даже если я повешу цикл for of при первой возможно resolve будет возвращать мне один и тот-же файл.
Из выше приведённого примера у меня так-же приходит один прочитанный файл в массиве. Так-же как и раньше. Вот взгляните пожалуйсто.

p.s. хотел спросить, зачем вы ставите запятые? Там где закрывающие круглые скобки. Они-же там не нужны.

async function test30() {
    const fs = require('fs');
    const fsPromises = fs.promises;
    const log = console.log;

    const getFileList = (mask) => new Promise((resolve, reject) => glob(mask, {}, (error, files) => {
        if (error) {
            reject(error);
        }
        function readFiles() {
            let subarray = [];
            for (let name of files) {
                subarray = name.split(); // Массивы путей к файлам. [ 'C:/Dev/build/src/scss/_fonts.css' ] [ 'C:/Dev/build/src/scss/style.css' ] и т.д...
                resolve(subarray);
            }
        }
        readFiles();
    }))

    const cssFileList = await getFileList(`${__dirname}/build/**/*.css`);
    const cssFileContentList = await Promise.all(cssFileList.map((name) => fsPromises.readFile(name, { encoding: 'utf8' })));
    log('----------------cssFileList----------------');
    log(cssFileContentList); // Возвращает массив. Массив содержит в себе один прочитанный файл.
    log(cssFileList); // Возвращает только один из массивов. [ 'C:/Dev/build/src/scss/_fonts.css' ]
}

[Rsa97]

Brendan Castaneda,

Получается если промис завершается при первом вызове resolve или reject тогда как можно обработать все файлы?

Отдельно получить массив имён файлов, map'ом превратить его в массив промисов ридера, дождаться их выполнения. Я же вам написал пример.

p.s. хотел спросить, зачем вы ставите запятые? Там где закрывающие круглые скобки. Они-же там не нужны.

Это стайлгайд Airbnb https://github.com/airbnb/javascript

Answer 2

[inFureal]

const { src, dest, series } = require('gulp');
const glob = require("glob");
const fs = require('fs');

async function test1() {
    let res = null; // <===
    glob(__dirname + '/build/**/*.css', {}, (error, files) => {
        if (error) throw error;

        function readFiles() {
            let subarray = [];
            for (let name of files) {
                subarray = name.split();
                let globFile = subarray + '';
                let dateFiles = '';
                fs.readFile(globFile, "utf8",
                    function(error, data) {
                        if (error) throw error; 
                        res = data; // <===
                    })
            }
        }
        readFiles();
        log(readFiles());
    })
    return res; <===
}

exports.test1= series(test1);

Comments

[Brendan Castaneda]

Я внёс правки но мне вернулось undefined.
Либо я туплю и пора спать уже, либо тут что-то не так.
Пожалуйста объясните

[inFureal]

Все дело в области видимости. если посмотришь внутри функции добавилась переменная в самом начале, вот тебе и нужно в нее добавить необходимые значения, которые уйдут в конец функции return res;

[Brendan Castaneda]

inFureal, Да я заметил эти изменения.
Дело в том, что data возвращает результат, а именно: читает файл/ы и хранит в себе его.
Вот мне хотелось-бы этот результат использовать за пределами этой вложенной функции.
Допустим я-бы создал уже другую функцию и использовал его там.
Я предполагал, что нужно вынести результат в глобальную переменную.