0% found this document useful (0 votes)
53 views6 pages

Promises

Javascript promise

Uploaded by

Harsh Garg
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
53 views6 pages

Promises

Javascript promise

Uploaded by

Harsh Garg
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

// PROMISES Interview Question

// synchronous vs asynchronous code

//Synchronous code
console.log("start")
console.log("Subscribe to Roadside Coder")
console.log("stop")

// Asynchronous code with setTimeout


console.log("start")

setTimeout(() => {
console.log("Subscribe to Roadside Coder");
}, 2000);

console.log("stop");

// Asnychronous Example
console.log("start")

function importantAction(username) {
setTimeout(() => {
return `Subscribe to ${username}`;
}, 1000);
}

const message = importantAction('Roadside Coder');


console.log(message);

console.log("stop");

// Callback

console.log("start")

function importantAction(username, cb) {


setTimeout(() => {
cb( `Subscribe to ${username}`);
}, 1000);
}

importantAction("Roadside Coder", (message) => {


console.log(message);
});

console.log("stop")

// Callback Hell
console.log("start")

function importantAction(username, cb) {


setTimeout(() => {
cb(`Subscribe to ${username}`);
}, 1000);
}

function likeTheVideo(video, cb) {


setTimeout(() => {
cb(`Like the ${video} video`);
}, 1000);
}

function shareTheVideo(video, cb) {


setTimeout(() => {
cb(`Share the ${video} video`);
}, 1000);
}

const message = importantAction("Roadside Coder", (message) => {


console.log(message);
likeTheVideo("Javascript Interview Questions", (action) => {
console.log(action);
shareTheVideo("Javascript Interview Questions", (action) => {
console.log(action);
});
});
});

console.log("stop")

// Promises

console.log("start");

const sub = new Promise((resolve, reject) => {


setTimeout(() => {
const result = true;
if (result) resolve("Subscribed to Roadside Coder");
else reject(new Error("Why aren't you subscribed to Roadside Coder?"));
}, 2000);
});

sub
.then((message) => {
console.log(message);
})
.catch((err) => {
console.log(err);
});
console.log("stop");

// Rewriting Callbacks

console.log("start");

function importantAction(username) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`Subscribe to ${username}`);
}, 1000);
});
}

function likeTheVideo(video) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`Like the ${video} video`);
}, 1000);
});
}

function shareTheVideo(video) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`Share the ${video} video`);
}, 1000);
});
}

importantAction("Roadside Coder").then((res) => {


console.log(res);
likeTheVideo("Javascript Interview Questions").then((res) => {
console.log(res);
shareTheVideo("Javascript Interview Questions").then((res) => {
console.log(res);
});
});
}).catch(err=>console.log(err))

console.log("stop");

// Promise Chaining

importantAction("Roadside Coder").then((res) => {


console.log(res);
return likeTheVideo("Javascript Interview Questions")
}).then((res) => {
console.log(res);
return shareTheVideo("Javascript Interview Questions")
}).then((res) => {
console.log(res);
});

// Promise Combinator

// promise.all()
console.log("start")

Promise.all([
importantAction("Roadside Coder"),
likeTheVideo("Javascript Interview Questions"),
shareTheVideo("Javascript Interview Questions")
]).then((res)=>{
console.log(res)
}).catch(err=>{
console.log(err)
})

console.log("stop")

// promise.race()
console.log("start")

Promise.race([
importantAction("Roadside Coder"),
likeTheVideo("Javascript Interview Questions"),
shareTheVideo("Javascript Interview Questions")
]).then((res)=>{
console.log(res)
}).catch(err=>{
console.log(err)
})

console.log("stop")

// promise.allSettled()
console.log("start")

Promise.allSettled([
importantAction("Roadside Coder"),
likeTheVideo("Javascript Interview Questions"),
shareTheVideo("Javascript Interview Questions")
]).then((res)=>{
console.log(res)
}).catch(err=>{
console.log(err)
})
console.log("stop")

// promise.any()
console.log("start")

Promise.any([
importantAction("Roadside Coder"),
likeTheVideo("Javascript Interview Questions"),
shareTheVideo("Javascript Interview Questions")
]).then((res)=>{
console.log(res)
}).catch(err=>{
console.log(err)
})

console.log("stop");

// async & await

const result = async () => {


try {
const message1 = await importantAction("Roadside Coder");
const message2 = await likeTheVideo("Javascript Interview Questions");
const message3 = await shareTheVideo("Javascript Interview Questions");

console.log({message1, message2, message3});


} catch (err) {
console.log(err);
}
};

result();

// ----------> Interview Question

// Question 1 : What is Output?

console.log('start');

const promise1 = new Promise((resolve, reject) => {


console.log(1)
resolve(2)
})

promise1.then(res => {
console.log(res)
})

console.log('end');

// Question 2 : What is Output?

console.log('start');

const promise1 = new Promise((resolve, reject) => {


console.log(1)
resolve(2)
console.log(3)
})

promise1.then(res => {
console.log(res)
})

console.log('end');

// Question 3 : What is Output?

console.log('start')

const fn = () => (new Promise((resolve, reject) => {


console.log(1);
resolve('success')
}))

console.log('middle')

fn().then(res => {
console.log(res)
})

console.log('end')

// Question 4 : What is Output?

function job() {
return new Promise(function(resolve, reject) {
reject();
});
}

let promise = job();

promise

.then(function() {
console.log('Success 1');
})

.then(function() {
console.log('Success 2');
})

.then(function() {
console.log('Success 3');
})

.catch(function() {
console.log('Error 1');
})

.then(function() {
console.log('Success 4');
});

// Question 5 : What is Output?

function job(state) {
return new Promise(function(resolve, reject) {
if (state) {
resolve('success');
} else {
reject('error');
}
});
}

let promise = job(true);

promise
.then(function(data) {
console.log(data);

return job(false);
})

.catch(function(error) {
console.log(error);

return 'Error caught';


})

.then(function(data) {
console.log(data);

return job(true);
})

.catch(function(error) {
console.log(error);
});

// Question 6 : What is the Output?

function job(state) {
return new Promise(function(resolve, reject) {
if (state) {
resolve('success');
} else {
reject('error');
}
});
}

let promise = job(true);

promise
.then(function(data) {
console.log(data);

return job(true);
})
.then(function(data) {
if (data !== 'victory') {
throw 'Defeat';
}
return job(true);
})
.then(function(data) {
console.log(data);
})
.catch(function(error) {
console.log(error);
return job(false);
})
.then(function(data) {
console.log(data);
return job(true);
})
.catch(function(error) {
console.log(error);
return 'Error caught';
})
.then(function(data) {
console.log(data);
return new Error('test'); // Not Returning a promise
})
.then(function(data) {
console.log('Success:', data.message);
})
.catch(function(data) {
console.log('Error:', data.message);
});

// Question 7 : Promises Chaining

const firstPromise = new Promise((resolve, reject) => {


resolve('First!');
});

const secondPromise = new Promise((resolve, reject) => { In .then(res => res), the function inside .then() is a bit peculiar. It's
resolve(firstPromise); essentially saying, "Take whatever you got (represented by res)
}) and give it back as it is." So, it's like a "pass-through" or "echo"
function. Whatever comes in, goes out unchanged. It doesn't
secondPromise modify or do anything with res, just passes it along to the next
.then(res => res) step in the chain.
.then(res => console.log(res));

// Question 8 : Rewrite this example code using `async/await`


// Instead of `.then/catch`

function loadJson(url) {
return fetch(url)
.then(response => {
if (response.status == 200) {
return response.json();
} else {
throw new Error(response.status);
}
});
}

loadJson('https://javascript.info/no-such-user.json').catch(alert);

// Answer
async function loadJson(url) { // (1)
let response = await fetch(url); // (2)

if (response.status == 200) {
let json = await response.json(); // (3)
return json;
}

throw new Error(response.status);


}

loadJson('https://javascript.info/no-such-user.json').catch(alert);

// Question 9 : Solve Promise Recursively

function importantAction(username) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`Subscribe to ${username}`);
}, 1000);
});
}

function likeTheVideo(video) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`Like the ${video} video`);
}, 1000);
});
}

function shareTheVideo(video) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`Share the ${video} video`);
}, 1000);
});
}

function promRecurse(funcPromises) {
if (funcPromises.length === 0) return;
const promi = funcPromises.shift();

promi.then((result) => console.log(result)).catch((err) => console.log(err));

promRecurse(funcPromises);
}

promRecurse([
importantAction("Roadside Coder"),
likeTheVideo("Javascript Interview Questions"),
shareTheVideo("Javascript Interview Questions"),
]);

// Question 10 : Promise Polyfill

function PromisePolyFill(executor) {
let onResolve,
onReject,
fulfilled = false,
rejected = false,
called = false,
value;
function resolve(v) {
fulfilled = true;
value = v;

if (typeof onResolve === "function") { // for async


console.log("inside resolve")
onResolve(value);
called = true;
}
}

function reject(reason) {
rejected = true;
value = reason;

if (typeof onReject === "function") {


onReject(value);
called = true;
}
}

this.then = function (callback) {


onResolve = callback;

if (fulfilled && !called) { // for sync


console.log("inside then")
called = true;
onResolve(value);
}
return this;
};

this.catch = function (callback) {


onReject = callback;

if (rejected && !called) {


called = true;
onReject(value);
}
return this;
};

try {
executor(resolve, reject);
} catch (error) {
reject(error);
}
}

const promise1 = new PromisePolyFill((resolve, reject) => {


console.log(1)
setTimeout(() => {
resolve(2)
}, 1000);
console.log(3)
})

promise1.then(res => {
console.log(res)
});

const examplePromise = new PromisePolyFill((resolve, reject) =>{


resolve(2);
});

examplePromise.then((res) => console.log(res)).catch(err => console.error(err));

PromisePolyFill.resolve = (val) => new PromisePolyFill(function executor(resolve, reject){


resolve(val);
});

PromisePolyFill.reject = (val) => new PromisePolyFill(function executor(resolve, reject){


reject(val);
});

// promise.all()

PromisePolyFill.all = (promises) => {


let fulfilledPromises = [],
result = [];

function executor(resolve, reject) {


promises.forEach((promise, index) =>
promise
.then((val) => {
fulfilledPromises.push(true);
result[index] = val;

if (fulfilledPromises.length === promises.length) {


return resolve(result);
}
})
.catch((error) => {
return reject(error);
})
);
}
return new PromisePolyFill(executor);
};

You might also like