Home > Web Front-end > JS Tutorial > fun facts about Javascript Promises

fun facts about Javascript Promises

Susan Sarandon
Release: 2024-10-07 20:21:30
Original
213 people have browsed it

fun facts about Javascript Promises

Promises are always asynchronous

Promise's callback always be executed after synchronous code


const promise = Promise.resolve(); 
promise.then(() => console.log('async')); 
console.log('sync');

//sync
//async


Copy after login

Chained promises return new promises

Promise then returns a new promise each time its invoked


const p = Promise.resolve(); 
const chain = p.then(() => {}); 
console.log(p === chain); //false


Copy after login

Forever then()

Promises support infinite chaining


Promise.resolve(1) 
    .then(value => value + 1) 
    .then(value => value + 1) 
    .then(value => console.log(value)); // 3


Copy after login

You can convert callbacks to promises

You can wrap older code which uses callback in promise to work with modern async/await


function asyncOperation(callback) { 
    setTimeout(() => callback(null, 'Im a callback'), 1000); 
} 

const promisified = () => new Promise((resolve, reject) => { 
    asyncOperation((err, result) => { 
        if (err) reject(err); 
        else resolve(result); 
    }); 
});

promisified().then(result => console.log(result)); // "Im a callback"


Copy after login

Promise.resolve() doesn’t always create a new promise

If you pass a non-Promise value, Promise.resolve() wraps it into a resolved promise. But if you pass a promise, it just returns that same promise.


const p1 = Promise.resolve('Hello'); 
const p2 = Promise.resolve(p1); 
console.log(p1 === p2); // true


Copy after login

You can handle errors anywhere in the chain


Promise.reject('Error!')
  .then(() => console.log('This will not run'))
  .then(() => console.log('This will also not run'))
  .catch(err => console.log('Caught:', err))
  .then(() => console.log('This will run'));


Copy after login

finally() doesn’t pass values

The finally() method doesn't receive or modify resolved values. It’s used for cleaning up resources and runs whether the promise resolves or rejects.


Promise.resolve('resolved')
  .then(value => console.log(value))
  .finally(() => console.log('Cleanup'))

//resolved
//cleanup


Copy after login

Promises are immutable once settled

Once a promise is settled (resolved or rejected), its state is immutable. It can't be changed after that, even if you try to resolve/reject it again.


const p = new Promise((resolve, reject) => {
  resolve('First');
  resolve('Second');
});
p.then(value => console.log(value));  //"First" (only the first value is used)


Copy after login

You can chain catch() to handle specific errors


Promise.reject('type C error')
  .catch(err => {
    if (err === 'type A error') console.log('handle type A');
    throw err;
  })
  .catch(err => {
    if (err === 'type B error') console.log('handle type B');
    throw err;
  })
  .catch(err => {
    if (err === 'type C error') console.log('handle type C');
    throw err;
  })


Copy after login

You can use await with non-promise values


async function demo() {
  const result = await 42; //not a promise
  console.log(result);      
}
demo(); //42


Copy after login

That's it! Thank you for reading this far. Till next time!

The above is the detailed content of fun facts about Javascript Promises. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template