JavaScript의 화살표 함수: 괄호와 중괄호를 언제 사용해야 할까요?

화살표 함수: 괄호와 중괄호를 사용해야 하는 경우

ES6에 도입된 화살표 함수는 함수 정의를 위한 간결한 구문입니다. 함수 본문을 나타내기 위해 "굵은 화살표"(=>)를 사용합니다. 그러나 화살표 함수는 때때로 중괄호({})를 사용하는 반면 다른 함수는 괄호(())를 사용한다는 점은 주목할 가치가 있습니다.

한 줄 반환 표현식의 괄호

화살표 함수의 본문이 단일 표현식으로 구성된 경우 괄호를 사용하여 표현식을 묶어 화살표 함수가 해당 값만 반환함을 나타냅니다. 예를 들면 다음과 같습니다.

const a = (who) => `hello ${who}!`;

이 코드는 문자열을 반환하는 화살표 함수를 정의합니다. 'hello ${who}!' 주위의 괄호 단일 표현식임을 나타냅니다.

여러 줄 코드 블록을 위한 중괄호

중괄호는 화살표 함수의 본문에 여러 줄의 코드가 포함된 경우에 사용됩니다. 각 줄은 문장을 나타내며, 본문 전체가 코드 블록이 됩니다. 예:

const handleBar = (e) => {
  e.preventDefault();
  dispatch('logout');
};

이 코드는 두 개의 문이 포함된 이벤트 핸들러를 정의하므로 중괄호가 필요합니다.

실제 예제

이를 설명하는 다음 예를 고려하십시오. 차이점:

const b = (who) => ("hello " + who + "!");
const c = (who) => (
  "hello " + who + "!"
);
const d = (who) => (
  "hello "
    + who
    + "!"
);

객체 리터럴의 괄호

화살표 함수에서 괄호를 사용하는 또 다른 방법은 객체 리터럴을 묶는 것입니다. 이는 파서가 객체를 코드 블록으로 취급하는 것을 방지하기 위해 수행됩니다.

const y = () => ({}); // returns an object

이 코드는 빈 객체를 반환하는 화살표 함수를 정의합니다. 괄호는 파서가 이를 코드 블록이 아닌 객체 리터럴로 해석하도록 보장합니다.

따라서 화살표 함수에서 중괄호 또는 괄호 사용은 함수 본문에 한 줄 표현식이 포함되어 있는지 아니면 여러 줄 표현식이 포함되어 있는지에 따라 달라집니다. 코드 줄. 단일 표현식에는 괄호가 사용되고, 코드 블록에는 중괄호가 사용됩니다.

위 내용은 JavaScript의 화살표 함수: 괄호와 중괄호를 언제 사용해야 할까요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!