1

Уже сижу целую неделю и никак не могу понять Promise. Все что знаю, это то, что это связанно с асинхронностью в JS (скорее ее имитацией). Мне еще дали задание по ним на курсах от одной компании, предварительно не разобрав тему...

//Представьте ситуацию: у вас есть необходимость составить объект с данными о пользователе,
// который в дальнейшем будете использовать в работе.
const promise1 = new Promise(resolve) => {
  setTimeout(() => Promise.resolve('Cherkasy'), 1000); // локация
} 
const promise2 = new Promise(resolve) => {
  setTimeout(() => Promise.resolve('admin'), 4000); // ролей три - guest, user, admin
} 

const promise3 = new Promise(resolve) => {
  setTimeout(() => Promise.resolve('1'), 2000); // id пользователя, можете юзать любое число
}
const promise4 = new Promise(resolve) => {
  setTimeout(() => Promise.resolve(['Саша', 'Влад', 'Юля', 'Андрей', 'Богдан']), 1000); // массив который показывает людей, состоящих в группе у человека
}
//Необходимо построить цепочку промисов. 

  • Первый промис - отдает локацию пользователя (город).
  • Второй - его роль и в зависимости от роли вам необходимо составить ему email(если пользователь admin - email должен заканчиваться на admin.com и аналогично с другими ролями).
  • Далее если пользователь admin вам необходимо вызвать функцию, передав в нее id пользователя и в зависимости от id вернуть число, которое будет обозначать к-во человек в его группе (для этой функции можно юзать промисификацию, соответствие id к к-ву человек придумайте сами, это может быть объект с ключом id и значением к-вом человек. {1: 3, 2: 5} и тд)
  • Итого если пользователь на админ, а пришел цепочка должна проигнорировать список человек в группе, только выкинуть ошибку с помощью throw new Error(текст ошибки туть). Если пользователь админ но пришло к-во человек в группе больше, чем указано - выкинуть соответствующую ошибку, цепочка проминов должна завершиться с ошибкой которая дает понять что случилось.
  • Для построения подобных сценариев вы можете изменять исходное состояние промисов, делая их rejected если необходимо. Так же данные что передаются тоже можно изменять, но не изменяем время в setTimeout.

Собственно вот задание. Я не понимаю как строить цепочку промисов, что должно за чем идти, где должны быть какие-то вложенности. Прошу кто может объяснить? Или может мне нужно предварительно что-то знать, чтоб понять это?

9
  • примеры промисов const promise1 = new Promise(resolve) => { setTimeout(() => Promise.resolve('Cherkasy'), 1000); } ты сам придумывал или это именно так и в задаче было?
    – Grundy
    15 авг 2020 в 9:58
  • Лишняя скобка после resolve
    – Vasily
    15 авг 2020 в 10:20
  • @Vasily, она не лишняя, она просто не в том месте стоит
    – Grundy
    15 авг 2020 в 10:24
  • 3
    В js нет имитации асинхронности, там просто асинхронность
    – Grundy
    15 авг 2020 в 10:27
  • А как именно вы целую неделю пытаетесь понять Promise? Что вы читали по теме? Например, читали этот раздел из популярного сейчас учебника? learn.javascript.ru/async 15 авг 2020 в 12:42

1 ответ 1

3

Вы неправильно обрабатываете Promise-объект. Для начала вот вам мат. часть Promise on MDN

Promise - это встроенный класс, соответственно при создании нового объекта через оператор new, вы должны вызвать один из callback-методов в контексте того Promise объекта, который создали. Два разных выражения new Promise() и Promise.resolve() порождают абсолютно разные контексты, иными словами это два разных объекта со своими внутренними обработчиками resolve и reject. Данные обработчики инкапсулированы во внутренний механизм промиса. При вызове одного из этих обработчиков вы порождаете действие о завершении операции передав этим обработчикам данные в качестве аргументов resolve(data) или reject(new Error('some error')). Метод resolve для успешной операции, а reject для ошибок.

Соответственно создав новый объект Promise, вы неправильно его обработали, и данный промис, созданный через оператор new никогда не выполнится, потому что он не обрабатывается должным образом.

const promise1 = new Promise((resolve) => {
  setTimeout(() => Promise.resolve('Cherkasy'), 1000);
});

Давайте проанализируем почему.

  1. Вы создаете переменную promise1 и сохраняете в ней инстанс на промис
  2. В теле данного промиса вы вызываете setTimeout и после ожидания 1сек, вместо того чтобы вызвать resolve или reject созданного выше промиса вы создаете новый промис Promise.resolve.
  3. Так как setTimeout не способен возвращать результаты кастомных методов, а созданный промис через оператор new никогда не обрабатывается, в переменной promise1 сохраняется состояние промиса, которое никогда не завершится.

Вот так необходимо обрабатывать Promise с помощью setTimeout

const resolvedPromise = new Promise((resolve) => {
  setTimeout(() => resolve('Cherkasy'), 1000);
});

const rejectedPromise = new Promise((resolve, reject) => {
  setTimeout(() => reject(new Error('Cherkasy not found')), 1200);
});

Но иногда бывает что не нужно прибегать к setTimeout и созданию нового объекта Promise, потому как результат нам уже известен и не нужно ожидать. Но для того чтобы соблюсти контракт данных используя Promise, разработчики придумали вот такое выражение:

const resolvedPromise = Promise.resolve('Cherkasy');
const rejectedPromise = Promise.reject(new Error('Cherkasy not found'));

Весь вышеперечисленный код можно обрабатывать двумя способами и между этими способами существенная разница (Во первых это разное оформление, во вторых при использовании async/await, интерпретатор дойдя до оператора await, приостановит выполнение метода в контексте которого был вызван await, до тех пор пока Promise не вернет результат):

// Обработка Promise с помощью async/await
async function() {
  try {
    const data1 = await resolvedPromise;
  } catch (error) {
    console.error(error);
  }

  try {
    const data2 = await rejectedPromise;
  } catch (error) {
    console.error(error);
  }
}

// Обработка Promise с помощью then/catch
resolvedPromise
  .then(data => console.log(data))
  .catch(error => console.error(error))

  .then(() => rejectedPromise)
  .then(data => console.log(data))
  .catch(error => console.error(error))
;
5
  • между этими способами существенная разница - какая разница?
    – Grundy
    22 авг 2020 в 21:11
  • Во первых очевидно что оформление блоков другое, во вторых при использовании async/await, интерпретатор, дойдя до оператора await приостановит выполнение метода в контексте которого был вызван await, до тех пор, пока Promise не вернет результат. При использовании then/catch - приостановки метода не произойдет, а данные сразу обрабатываются в колбеках, которые принимают в качестве аргументов then/catch.
    – Alex Yu
    22 авг 2020 в 21:23
  • 1
    Добавь это описание в ответ. Формулировка данные сразу обрабатываются в колбеках - неверная. Они обрабатываются тогда, когда Promise вернет результат, и в этом поведение такое же как и с await
    – Grundy
    22 авг 2020 в 21:31
  • Ну и в примере надо было делать resolvedPromise.then(data => console.log(data)).catch(error => console.error(error)) .then(()=>rejectedPromise).then(data => console.log(data)).catch(error => console.error(error)) тогда можно было бы сравнивать поведение двух вариантов
    – Grundy
    22 авг 2020 в 21:33
  • Да, верно, я неправильно сформулировал. Спасибо, исправил.
    – Alex Yu
    22 авг 2020 в 21:52

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.