Я пытаюсь заполнить некоторые данные в Object
, и я не могу на всю жизнь выяснить, что не так и почему один подход работает, а другой - нет. Я предполагаю, что это как-то связано с мутацией или асинхронностью, но даже в этом случае я не могу понять, в чем именно заключается проблема.
Если у вас, ребята, есть какие-то идеи, возможно, есть материалы для чтения и тому подобное, было бы очень полезно.
Данные, которые обрабатываются:
"flows": {
"Flow-1": ["Slide-1", "Slide-1"],
"Flow-2": ["Slide-1"],
"Flow-3": ["Slide-1", "Slide-1"]
}
Slide-1
- это экспорт по умолчанию (функция) в файл JS
. Я пытаюсь импортировать его с помощью import statement
и добавить его к array
. Таким образом, slideData
является return value
из import statement promise resolve
.
Подход № 1:
for (i = 0; i < keysLen; i++) {
data[keys[i]] = [];
for(let a = 0; a < settings.flows[keys[i]].length; a++) {
await import(`./Slides/${settings.flows[keys[i]][a]}/${settings.flows[keys[i]][a]}`).then(slideData =>
data[keys[i]].push(slideData.default)).catch(err => console.log(err));
}
}
Это циклически перебирает вышеуказанные данные, создает ключ / значение пары для каждого потока , импортирует данные через import statement
и помещает их в ранее созданный arrays
.
. Этот подход работает просто отлично, но я чувствую, что он может быстро стать нечитаемым, и даже если этого не произойдет, я все же хотел бы понять, как мы могли бы реализовать ES6 Array Methods
здесь, как говорится, вот моя попытка сделать это.
Подход № 2:
keys.forEach(flow => data[flow] = settings.flows[flow].map(async slide => await import(`./Slides/${slide}/${slide}`).then(slideData => slideData.default).catch(err => console.log(err))));
Что мне здесь нравится? Гибкость, вы можете отформатировать это так, чтобы он был одним строкой, отформатировать его для удобочитаемости или любым другим предпочтительным способом, и вы также можете изменить или связать много разных вещей.
В чем тогда проблема? Что ж, этот подход, похоже, возвращает неправильные значения, проверьте вывод:
Он говорит, что он решен, я возвращаю свойство default
, которое, как я понимаю, должно содержать значение завершено promise
, верно? Так почему же это array
содержит такие данные?