Javascript 약속의 최종 지침입니다.(코드 예)


이 자습서에서는 모든 JavaScript 약속, 차이점 및 사용 사례에 대해 설명합니다.

소개하다.


약속은 JavaScript(ES6)에서 비동기 프로그래밍을 구현하는 방법입니다.약속은 미래 가치의 용기가 될 것이다.전문가의 말로는 아마존에서 주문을 하신다고 합니다.주문을 한 후, 당신은 우편함에서 발송 날짜가 있는 영수증을 한 장 받을 것입니다.이 경우 영수증은 당신의 주문서를 대표하여 당신의 약속에 부칠 것입니다.영수증은 당신이 주문한 물품(미래가치)의 용기나 증명과 같다.
비동기 프로그래밍에 대해 자바스크립트는 리셋을 사용하지만 리셋을 사용하는 데 문제가 있다. 이것이 바로 리셋 지옥이다.
작은 응용 프로그램에 대해 말하자면, 리셋은 가능한 것 같지만, 대량의 리셋을 포함하는 복잡한 응용 프로그램이 관련될 때, 당신은 매우 깊은 리셋 함수를 끼워 넣기 시작한다. 이 함수들은 읽기, 이해, 관리가 매우 어려워질 수 있다.
지옥을 되돌리는 예
func1(function(a){ 
 func2(a, function(b){ 
  func3(b, function(c){ 
   ... 
  }); 
 }); 
});

구원 승낙


약속은 기본적으로 우리가 분배한 임무가 완성될지 안 될지 확실하지 않을 때 생기는 것이다.Promise 객체는 비동기식(비동기식) 작업의 최종 완료(또는 실패) 및 결과 값을 나타냅니다.말 그대로 약속은 지키든지 어기든지 한다.
약속은 항상 다음 상태 중 하나입니다.
  • 이행: 약속과 관련된 행동 성공.
  • 거절: 약속과 관련된 행동 실패.
  • 미정: 약속이 아직 미정, 즉 이행되지 않거나 거절되었다.
  • 해결됨: 약속 이행 또는 거부
  • 구문
    const promise = new Promise((resolve,reject) => {....});
    
    예.
    const myPromise = new Promise((resolve, reject) => { 
     if (Math.random() > 0) { 
      resolve('Hello, I am positive number!'); 
     } 
     reject(new Error('I failed some times')); 
    })
    
    나는 약속에 관한 문장을 발표했다.any () 1, 사람들이 자바스크립트의 약속 사이의 차이를 묻는다.따라서 Javascript가 약속한 여러 가지 실현에 대한 곤혹스러움을 밝히기 위해 다른 글을 발표합니다.

    약속할게.모두()


    승낙all () 방법은 iterable of Promissions를 입력으로 하고, 이 Promission은 입력한 결과의 그룹으로 해석되는 단독 Promission을 되돌려줍니다.입력한 모든 약속이 해결되었을 때나,iterable를 입력한 모든 약속이 포함되지 않으면, 되돌아오는 약속이 해결됩니다.만약 어떤 약속이 거절당한다면, 약속.all () 첫 번째 거절당한 약속을 던지고 오류 발생
    아래의 이 예를 예로 들자.우리는 무작위 시간에 해결하기 위해 세 가지 약속을 만들었다.
    const prom1 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("first promise resolved")
        // reject("first promise rejected")
        }, Math.floor(Math.random() * 100)
      );
    });
    const prom2 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("second promise resolved")
        // reject("second promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    const prom3 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("third promise resolved")
        // reject("third promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    
    (async function() {
      try {
        const result = await Promise.all([prom1, prom2, prom3]);
        console.log(result);
      } catch (err) {
        console.log(err)
      }
    
    })();
    
    만약 우리가 컨트롤러에서 결과를 본다면, 우리는 이 세 가지 약속이 모두 해결되었다는 것을 볼 수 있을 것이다.

    이제 우리의 약속 하나가 거절당한다면?우리는try-catch 블록에서 이 오류를 가볍게 처리했다.
    const prom1 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("first promise resolved")
        // reject("first promise rejected")
        }, Math.floor(Math.random() * 100)
      );
    });
    const prom2 = new Promise((resolve, reject) => {
      setTimeout(() => {
        // resolve("second promise resolved")
        reject("second promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    const prom3 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("third promise resolved")
        // reject("third promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    
    (async function() {
      try {
        const result = await Promise.all([prom1, prom2, prom3]);
        console.log(result);
      } catch (err) {
        console.log(err)
      }
    
    })();
    
    콘솔을 보면 거절당한 약속이 콘솔에 로그인하는 것을 볼 수 있다.

    약속할게.종족()


    승낙race () 방법은 이 약속이iterable에서 한 약속이 실현되거나 거절되었을 때 즉시 실현되거나 거절되며, 이 약속의 값이나 원인을 가지고 있는 약속을 되돌려줍니다.
    예.
    const prom1 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("first promise resolved")
        // reject("first promise rejected")
        }, Math.floor(Math.random() * 100)
      );
    });
    const prom2 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("second promise resolved")
        // reject("second promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    const prom3 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("third promise resolved")
        // reject("third promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    
    (async function() {
      try {
        const result = await Promise.race([prom1, prom2, prom3]);
        console.log(result);
      } catch (err) {
        console.log(err)
      }
    
    })();
    
    콘솔만 살펴보면 먼저 해결한 약속이 해결되었거나 거부되었음을 되돌려줍니다.

    약속할게.모든 ()


    약속할게.어떤 ()도 약속의 이면과 같다.모두().약속할게.제공된 약속 중 하나가 해결되면any()가 해결됩니다.all (), 모든 약속이 해결되기 전에 해결되기를 기다립니다.
    아래의 예를 봅시다.
    기본적으로 우리는 무작위 시간에 해결하겠다고 세 가지 약속을 했다.우리는 setTimeout () 함수를 사용하여 모든 약속이 해결될 시간을 설정했다.우리는 수학을 쓴다.floor(Math.random)는 setTimeout 함수에 무작위 시간을 제공하기 때문에 어떤 약속이 먼저 해결될지 정말 모르겠습니다.이것이 바로 현실 생활에서 발생하는 일이다.
    const prom1 = new Promise((resolve, reject) => {
      setTimeout(
        () => resolve("this is the first promise"),
        Math.floor(Math.random() * 100)
      );
    });
    const prom2 = new Promise((resolve, reject) => {
      setTimeout(
        () => resolve("this is the second promise"),
        Math.floor(Math.random() * 100)
      );
    });
    const prom3 = new Promise((resolve, reject) => {
      setTimeout(
        () => resolve("this is the third promise"),
        Math.floor(Math.random() * 100)
      );
    });
    
    (async function() {
      const result = await Promise.any([prom1, prom2, prom3]);
      console.log(result); // Prints "A", "B" or "C"
    })();
    

    약속의 이점.any () 한 가지 약속이 거절당하더라도 다른 약속은 계속 해결됩니다.만약 모든 약속이 거절된다면, 그것은 집합 오류만 던질 것이다
    .
    아래의 두 가지 예를 보아라
    첫 번째 예에서 약속만 거절당했지만, 그것은 계속 해결되었다.두 번째 예에서 모든 약속이 거절되었기 때문에 우리는 집합 오류를 얻었다
    const prom1 = new Promise((resolve, reject) => {
      setTimeout(() => {
        // resolve("first promise resolved")
        reject("first promise rejected")
        }, Math.floor(Math.random() * 100)
      );
    });
    const prom2 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("second promise resolved")
        // reject("second promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    const prom3 = new Promise((resolve, reject) => {
      setTimeout(() => {
        // resolve("third promise resolved")
        reject("third promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    
    (async function() {
      try {
        const result = await Promise.any([prom1, prom2, prom3]);
        console.log(result);
      } catch (err) {
        console.log(err, 'all promises rejected')
      }
    
    })();
    

    예2
    const prom1 = new Promise((resolve, reject) => {
      setTimeout(() => {
        // resolve("first promise resolved")
        reject("first promise rejected")
        }, Math.floor(Math.random() * 100)
      );
    });
    const prom2 = new Promise((resolve, reject) => {
      setTimeout(() => {
        // resolve("second promise resolved")
        reject("second promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    const prom3 = new Promise((resolve, reject) => {
      setTimeout(() => {
        // resolve("third promise resolved")
        reject("third promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    
    (async function() {
      try {
        const result = await Promise.any([prom1, prom2, prom3]);
        console.log(result);
      } catch (err) {
        console.log(err, 'all promises rejected')
      }
    
    })();
    
    

    약속할게.모두 해결()


    승낙all Settled () 방법은 모든 약속이 이행되거나 거절된 후에 해석되는 약속을 되돌려줍니다. 이 약속은 대상 그룹을 포함하고, 대상마다 약속의 결과를 설명합니다.
    아래의 예에서 그 중 하나는 거절당했지만 승낙했다.all Settled () 는 이미 정해진 모든 약속을 되돌려줍니다.
    const prom1 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("first promise resolved")
        // reject("first promise rejected")
        }, Math.floor(Math.random() * 100)
      );
    });
    const prom2 = new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve("second promise resolved")
        // reject("second promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    const prom3 = new Promise((resolve, reject) => {
      setTimeout(() => {
        // resolve("third promise resolved")
        reject("third promise rejected")
      }, Math.floor(Math.random() * 100)
      );
    });
    
    (async function() {
      try {
        const result = await Promise.allSettled([prom1, prom2, prom3]);
        console.log(result);
      } catch (err) {
        console.log(err)
      }
    
    })();
    

    결론


    이 자습서에서는 JavaScript 약속과 차이점을 설명합니다.
    만약 보충하거나 보류하는 것이 있다면, 아래의 평론에서 저에게 알려 주십시오.

    좋은 웹페이지 즐겨찾기