Moment For Technology

Three state resolution of promises

Posted on May 28, 2023, 1:17 a.m. by Lauren Short
Category: The front end Tag: javascript promise

Three states of promise

Three states

  • pendingTo preparefulfilledsuccessfulrejectedfailure
  • pengding-fulfilled/pending-rejected
  • The change is irreversible
  • pendingReady, no triggerthenandcatch

  • fulfilledSuccess will trigger a follow-upthenThe callback function
    const p1 = Promise.resolve(100)
    p1 //Promise {fulfilled: 100}
    
    p1.then(data=  {
      console.log('data', data) //data 100
    }).catch(err=  {
      console.error('err', err) // Will not be executed
    })
    Copy the code

  • rejectedFailure triggers a follow-upcatchThe callback function
    const p2 = Promise.reject('err')
    p2 //Promise {rejected: 'err'}
    
    p2.then(data=  {
      console.log('data', data) // Will not be executed
    }).catch(err=  {
      console.error('err', err) //err err
    })
    Copy the code

How do promise then and catch affect state transitions

  • thenReturn to normalresolvedIf there is an error, returnrejected
const p1 = Promise.resolve().then(() =  {
  return 100         // Return resolved
})
p1.then(() =  {
  console.log('123')  / / 123
})

const p1 = Promise.resolve().then(() =  {
  throw new Error('then error')   //then error
  // Return rejected
})
p1.then(() =  {
  console.log('456')  // No execution no output
}).catch(() =  {
  console.error('err100', err)  //err100 err
})
Copy the code
  • catchReturn to normalresolvedIf there is an error, returnrejected
const p3 = Promise.reject('my error').catch((err) =  {
  console.error(err)         // Return resolved! Trigger the then callback
})
p3.then(() =  {
  console.log('123')  / / 123
})

const p4 = Promise.reject('my error').catch((err) =  {
  throw new Error('catch error')   //catch error
  // Return rejected
})
p1.then(() =  {
  console.log('456')  // No execution no output
}).catch(() =  {
  console.error('err100', err)  //err100 err
}) / / resolved promise
Copy the code

The interview questions

/ / 1
Promise.resolve().then(() =  {
  console.log(1)  / / 1
}).catch(() =  {  // No error is reported
  console.log(2)
}).then(() =  {
  console.log(3)  / / 3
})/ / resolved state

// Result:
1
3
Copy the code


/ / the second question
Promise.resolve().then(() =  {
  console.log(1)  / / 1
  throw new Error('erro1')  / / rejected state
}).catch(() =  {  / / resolved state
  console.log(2)  / / 2
}).then(() =  {
  console.log(3)  / / 3
})/ / resolved state

// Run the result
1
2
3
Copy the code


/ / the third topic
Promise.resolve().then(() =  {
  console.log(1)  / / 1
  throw new Error('erro1')  / / rejected state
}).catch(() =  {  / / resolved state
  console.log(2)  / / 2
}).catch(() =  {
  console.log(3)  // No error is reported
})

// Run the result
1
2
Copy the code
Search
About
mo4tech.com (Moment For Technology) is a global community with thousands techies from across the global hang out!Passionate technologists, be it gadget freaks, tech enthusiasts, coders, technopreneurs, or CIOs, you would find them all here.