JavaScript Promises Fundamentals Every Engineer Should Know | Part 1 | Frontend Fundamentals

In this video, we are going to talk about JavsScript Promises. We are going to look at fundamental concepts related to promises that will not only help people starting out with frontend development but also experienced folks who want to develop a deeper understanding of Promise API.

00:00 Introduction
00:21 Example 1: No need to return Promise from then callbacks
03:15 Understanding Sync & Async Errors
06:38 Try/Catch with Promises
09:10 Promise Resolve is not Return
12:17 Outro

You can support our channel via:

**************************************************************
Devtools Tech is a YouTube channel that was started as a collaborative effort among like-minded engineers to provide high-quality programming tutorials for free. We firmly believe in knowledge sharing and easy access to quality content for everyone. Hence, this channel is an effort to give back to the community and a step toward our belief -- "We rise by lifting others".

Team Members:
Yomesh Gupta

#javascript #promises #asyncprogramming #frontend *************************************************************

[isagarsehwag]

for the last problem, a better explanation would be that promise execution by in-itself is synchronous it's the then chain that is executed asynchronously in the micro-task queue.

[jayantsharma]

Great Video. Learn something new. Please make more such videos, they are really helpful.

[hi-yien]

Knowing basics always good....like a strong foundation

[sujalgupta]

For example1 : When you say callback acts as argument fro WrappedPromise.
Do we mean that, if from the first `then` you get a value and it will be passed to next `then` which will automatically wrap it inside a promise, and maybe also resolve itself and give it to the console.log? or the first then will return a promise of that value?

The only thing I understand is that `then` will work for both promises and simple values

[sujalgupta]

So, when I was learning about Promise.all polyfill, I ended up implementing it two ways
one using async/await (which I think is wrong, because async/await came after promises)
and other using Promises in javascript

in the async/await implementation I ended up coming on a conclusion that the equivalent of resolve in Promises is return in async/await

[mohitmandal]

hey Yomesh, @DevtoolsTech, I just wanted to understand the queue promise thing you did in Atlassian interview asked feature flag question,
could you make a seperate video on promises where you explain how can we queue things or if you could let me know here only how the cycle of chain executes.
Also if you are planning to make a video on it would be great to show us the implementation of custom promises pollyfill because I've seen so much videos on youtube regarding custom promises, I did not able to get it properly, But I am sure you would be able to illustrate us how the promise actually works under the hood in terms of multiple callback in then and catch and everything related to same.

let r = null;

function api() {
const p = new Promise((res, rej) => {
console.log("run");
setTimeout(() => res("hello"), 1000);
console.log('testing');
});

return p;


}

function runApi(a){
if(r instanceof Promise){
return r.then(res => {
console.log('hello from instance', a);
console.log('from queue api call');
return `${res} + ${a}`;
})

}
r = api().then(res => {
console.log('res from first then', a);
return `${res} + ${a}`;
});
return r;
}

runApi(1).then(console.log)
runApi(2).then(console.log)

setTimeout(() => {
console.log(r, 'from outside');
r.then(d => {
console.log('then from outset', d);
})
}, 2000)

[rahulkhandelwal]

Hi, I am actually not able to understand what is the use of Promise in real life example, kindly tell .

[chahatbhatia]

Great examples. Loved it. These are so basic things but I also got confused. Thanks for this video. 🙌