> 웹 프론트엔드 > JS 튜토리얼 > JavaScript 함수 선언과 표현식의 주요 차이점은 무엇입니까?

JavaScript 함수 선언과 표현식의 주요 차이점은 무엇입니까?

Susan Sarandon
풀어 주다: 2024-12-12 12:34:14
원래의
354명이 탐색했습니다.

What's the Key Difference Between JavaScript Function Declarations and Expressions?

JavaScript에서 함수 표현식과 선언의 차이점 이해

JavaScript에서 함수는 표현식이나 선언을 사용하여 정의할 수 있습니다. 두 접근 방식 모두 재사용 가능한 코드 블록을 생성할 수 있지만 실행 컨텍스트에서 작동하는 방식에는 몇 가지 근본적인 차이점이 있습니다.

1. 함수 표현식

함수 표현식은 변수나 상수에 값으로 할당되는 익명 함수입니다. 구문은 다음과 같습니다.

var foo = function() { return 5; };
로그인 후 복사

이 예에서 foo는 호출 시 값 5를 반환하는 익명 함수(정식 이름 없음)입니다.

2. 함수 선언

반대로, 함수 선언은 function 키워드 뒤에 이름과 선택적 매개변수를 사용하여 선언된 명명된 함수입니다.

function foo() { return 5; }
로그인 후 복사

이 경우 foo는 다음을 수행하는 명명된 함수입니다. 위의 익명 함수 표현식과 동일한 작업입니다.

3. 브라우저 로딩 및 평가

표현식과 선언의 주요 차이점은 실행 컨텍스트에 로드되는 방식에 있습니다.

  • 함수 선언: 이들은 로드되고 선언됩니다. 바깥쪽 범위의 코드보다 먼저 평가됩니다. 즉, 스크립트에서의 위치에 관계없이 호출할 수 있습니다.
  • 함수 표현식: 반면에 함수 표현식은 인터프리터가 특정 코드 줄에 도달하면 로드되고 평가됩니다. . 이는 동일한 범위에서 선언되기 전에 호출할 수 없음을 의미합니다. 시도하면 오류가 발생합니다.

4. 예시 예시

// Function Expression
alert(foo()); // ERROR!
var foo = function() { return 5; }; 
로그인 후 복사

이 예시에서는 foo가 아직 정의되지 않았기 때문에 Alert(foo())가 오류를 발생시킵니다.

// Function Declaration
alert(foo()); // Alerts 5
function foo() { return 5; } 
로그인 후 복사

여기서, Alert(foo()) Alerts 5 코드가 실행되기 전에 함수 선언이 로드되기 때문입니다.

기타 고려 사항

동안 함수 표현식과 선언은 대부분의 경우 유사하게 동작합니다. 주의해야 할 몇 가지 미묘한 차이가 있습니다.

  • 명명된 함수 표현식: 명명된 함수 표현식(예: var foo = function foo( ) { return 5; }) Safari에서는 한때 문제가 있었지만 최신 버전에서는 문제 없이 처리합니다.

위 내용은 JavaScript 함수 선언과 표현식의 주요 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿