안전한 할당-JS 튜토리얼-php.cn

안전한 할당

WBOY

풀어 주다： 2024-09-10 14:30:15

원래의

527명이 탐색했습니다.

Safe Assignment

오늘 JavaScript의 안전한 할당 연산자(?=)에 대한 새로운 제안에 대해 꽤 떠들썩했습니다. 시간이 지남에 따라 JavaScript가 개선되는 방식을 좋아하지만 최근에 몇 가지 경우에 직면한 문제이기도 합니다. 빠른 예제 구현을 함수로 작성해야겠죠?

제안서를 아직 읽지 않으셨다면 제안 내용은 다음과 같습니다.

const [error, value] ?= maybeThrows();

로그인 후 복사

새로운 ?= 연산자는 try/catch 블록에서 할당의 오른쪽을 호출하여 배열을 반환하는 것과 동일합니다. 반환된 배열의 첫 번째 값은 할당 내부에 무언가가 던져진 경우 오류가 되고, 두 번째 값은 아무 것도 던져지지 않은 경우 할당의 결과가 됩니다.

일반적인 시도/캐치 성가심

저는 할당 및 try/catch 블록과 관련해 꽤 보기 흉한 코드를 자주 접합니다. 다음과 같은 것:

let errorMsg;

try {
  maybeThrow();
} catch (e) {
  errorMsg = "An error message";
}

로그인 후 복사

const를 사용하여 try/catch 블록 외부에서 errorMsg에 액세스하거나 블록 외부에서 이를 정의해야 합니다.

비동기식 구현

여기서 가장 쉬운 경우는 비동기가 아닌 기능을 처리하는 것입니다. 휘핑할 수 있었어요
몇 가지 테스트 사례와 tryCatch라는 함수가 즉시 제공됩니다.

function tryCatch(fn, ...args) {
  try {
    return [undefined, fn.apply(null, args)]
  } catch (e) {
    return [e, undefined];
  }
}

function throws() {
  throw new Error("It threw");
}

// returns a sum
// prints [ undefined, 2 ]
console.log(tryCatch(Math.sqrt, 4));

// returns an error
// prints [ Error: 'It threw', undefined ]
console.log(tryCatch(throws));

로그인 후 복사

tryCatch는 try/catch 블록에 래핑된 지정된 인수를 사용하여 함수를 호출합니다. 함수 내부에 아무 것도 발생하지 않으면 [정의되지 않음, 결과]를 적절하게 반환하고, 뭔가 발생하면 [오류, 정의되지 않음]을 적절하게 반환합니다.

호출할 함수가 아직 없는 경우 tryCatch와 함께 익명 함수를 사용할 수도 있습니다.

console.log(tryCatch(() => {
  throw new Error("It threw");
}));

로그인 후 복사

비동기 기능 처리

비동기 기능이 조금 더 까다로워졌습니다. 제가 처음에 가지고 있던 아이디어 중 하나는
를 작성하는 것이었습니다. 완전히 비동기 버전(asyncTryCatch라고 함)이 있지만 그 안에 문제가 있습니다. 이것은 완전히 무의미한 탐험입니다! 비동기 및 비동기 기능 모두에서 작동하는 tryCatch 구현은 다음과 같습니다.

function tryCatch(fn, ...args) {
  try {
    const result = fn.apply(null, args);

    if (result.then) {
      return new Promise(resolve => {
          result
            .then(v => resolve([undefined, v]))
            .catch(e => resolve([e, undefined]))  
      }); 
    }

    return [undefined, result];
  } catch (e) {
    return [e, undefined];
  }
}

function throws() {
  throw new Error("It threw");
}

async function asyncSum(first, second) {
  return first + second;
}

async function asyncThrows() {
  throw new Error("It throws async");
}

// returns a sum
// prints [ undefined, 2 ]
console.log(tryCatch(Math.sqrt, 4));

// returns an error
// prints [ Error: 'It threw', undefined ]
console.log(tryCatch(throws));

// returns a promise resolving to value
// prints [ undefined, 3 ]
console.log(await tryCatch(asyncSum, 1, 2));

// returns a promise resolving to error
// prints [ Error: 'It throws async', undefined ]
console.log(await tryCatch(asyncThrows));

로그인 후 복사

원래 버전과 많이 비슷해 보이지만 Promise 기반 코드가 일부 포함되어 있습니다
좋은 측정을 위해 던져졌습니다. 이 구현을 사용하면 비동기 함수가 아닌 함수를 호출할 때 tryCatch를 호출할 수 있고, 비동기 함수를 호출할 때 wait tryCatch를 호출할 수 있습니다.

Promise 부분을 살펴보겠습니다.

if (result.then) {
  return new Promise(resolve => {
      result
        .then(v => resolve([undefined, v]))
        .catch(e => resolve([e, undefined]))    
  }); 
}

로그인 후 복사

if(result.then)는 주어진 함수(apply로 호출됨)가 Promise를 반환했는지 확인합니다. 그렇다면 Promise를 직접 반환해야 합니다.

결과.then(v => 해결([undefine, v]))를 호출하면 아무 것도 발생하지 않는 경우 해당 함수가 반환한 값으로 Promise가 확인됩니다.

.catch(e => 해결([e, undefine])) 은 조금 더 까다롭습니다. 제가 원래 썼어요
.catch(e => recognition([e, undefine]))로 되어 있지만, 이로 인해 잡히지 않는 오류가 발생합니다
tryCatch에서 빠져 나옵니다.
를 반환하므로 여기서 해결해야 합니다. 배열, 오류가 발생하지 않습니다.