JavaScript 함수 정의 방법 : 함수 표현 및 함수 선언. 이 기사는 기능 표현을 사용하는시기, 기능 선언을 사용하는시기를 탐구하고 두 가지의 차이점을 설명합니다.
주파수 선언은 오랫동안 널리 사용되어 왔지만 기능 표현이 점차 지배적입니다. 많은 개발자들은 언제 어느 것을 사용 해야하는지 확실하지 않으며, 결국 잘못된 선택으로 이어집니다.
함수 표현식과 함수 선언에는 몇 가지 주요 차이점이 있습니다. 이러한 차이점과 코드에서 기능 표현 및 기능 선언을 사용하는시기를 자세히 살펴 보겠습니다.
키 포인트
기능 표현 및 기능 선언은 JavaScript에서 함수를 만드는 두 가지 방법입니다. 함수 선언이 명명되었으며 변수 프로모션으로 인해 함수 표현식이 익명이며 변수에 할당되지만 호출하기 전에 정의해야합니다. function funcDeclaration() {
return '函数声明';
}
let funcExpression = function () {
return '函数表达式';
}
로그인 후 복사
함수 표현식은 함수 선언보다 유연합니다. 정의 후 즉시 사용할 수 있으며 다른 함수의 매개 변수로 사용되며 익명이 될 수 있습니다. 반면에 기능 선언은 특히 긴 기능에 대해 더 읽기 쉬우 며 가변 프로모션으로 인해 정의 전에 호출 할 수 있습니다.
기능 표현식은 클로저를 생성하고 다른 기능에 인수로 전달하고 즉시 함수 표현식 (IIFE)을 호출하는 데 사용될 수 있습니다. 따라서 개발자 도구 상자에서 다재다능하고 강력한 도구가됩니다.
-
함수 선언이란 무엇입니까?
함수 선언은 함수가 생성되고 명명 될 때 수행됩니다. - 키워드를 작성한 후 함수 이름을 따르고 함수 이름을 선언하십시오. 예를 들면 :
-
볼 수 있듯이 함수를 만들 때 함수 이름 (<🎜 🎜>)을 선언하십시오. 이것은 기능을 정의하기 전에 호출 할 수 있음을 의미합니다.
이것은 함수 선언의 예입니다
-
함수 표현식이란 무엇입니까?
기능 표현은 함수를 생성하고 변수에 할당 할 때 수행됩니다. 함수는 익명이므로 이름이 없음을 의미합니다. 예를 들면 :
알 수 있듯이 함수는 <🎜 🎜> 변수에 할당됩니다. 이것은 기능을 호출하기 전에 정의해야한다는 것을 의미합니다.
이것은 함수 표현식의 예입니다 : <🎜 🎜>
함수 표현식과 선언의 차이 <🎜 🎜>
함수 표현식과 함수 선언에는 몇 가지 주요 차이점이 있습니다.
함수 선언은 홍보되는 반면 기능 표현은 그렇지 않습니다. 즉, 함수 선언을 정의하기 전에 호출 할 수 있지만 함수 표현식으로는이 작업을 수행 할 수 없습니다. -
함수 표현식을 사용하면 함수를 정의한 직후에 사용할 수 있습니다. 함수 선언을 사용하면 전체 스크립트가 구문 분석 될 때까지 기다려야합니다.
기능 표현은 다른 함수의 매개 변수로 사용될 수 있지만 함수 선언은 수행 할 수 없습니다. -
기능 표현은 익명 일 수 있지만 함수 선언은 할 수 없습니다.
-
함수 표현식의 범위 이해 : JavaScript는 차이를 향상시킵니다
- 진술과 유사하게 함수 선언은 다른 코드의 최상위로 홍보됩니다.
기능 표현은 홍보되지 않습니다. 이를 통해 정의 된 범위에서 가져온 로컬 변수의 사본을 유지할 수 있습니다.
일반적으로 함수 선언 및 함수 표현식을 상호 교환 적으로 사용할 수 있습니다. 그러나 때때로 기능 표현은 임시 기능 이름없이 이해하기 쉬운 코드로 이어집니다.
표현 및 선언을 선택하는 방법 <🎜
그러면 언제 기능 표현을 사용해야하고 언제 기능 선언을 사용해야합니까?
답은 귀하의 요구에 따라 다릅니다. 보다 유연한 함수 또는 홍보되지 않는 함수가 필요한 경우 기능 표현이 최선의 선택입니다. 더 읽기 쉽고 이해하기 쉬운 기능이 필요한 경우 함수 선언을 사용하십시오. let
보시다시피, 두 개의 구문은 비슷합니다. 가장 분명한 차이점은 기능 표현이 익명이며 함수 선언은 유명하다는 것입니다.
<,> 요즘에는 함수 표현식이 수행 할 수없는 일을해야 할 때 기능 선언이 일반적으로 사용됩니다. 함수 선언으로 만 수행 할 수있는 작업을 수행 할 필요가없는 경우 일반적으로 기능 표현식을 사용하는 것이 좋습니다.
재귀 함수를 만들어야하거나 함수를 정의하기 전에 함수를 호출해야 할 때 기능 선언을 사용하십시오. 일반적으로 두 가지를 모두 수행 할 필요가 없을 때는 기능 표현을 사용하여 클리너 코드를 작성하십시오.
함수 선언의 장점
함수 선언을 사용하는 데 몇 가지 주요 장점이 있습니다.
코드를보다 쉽게 읽을 수 있습니다. 기능이 긴 경우 이름을 지정하면 수행하는 작업을 추적하는 데 도움이 될 수 있습니다.
함수 선언이 홍보되므로 코드에 정의되기 전에 사용할 수 있습니다. 기능을 정의하기 전에 사용해야하는 경우 도움이됩니다.
함수 표현식의 장점 <🎜 🎜>
기능 표현에는 몇 가지 장점이 있습니다.
그들은 함수 선언보다 유연합니다. 함수 표현식을 생성하고 다른 변수에 할당 할 수 있습니다. 이는 다른 위치에서 동일한 함수를 사용해야 할 때 유용합니다.
기능 표현식은 홍보되지 않으므로 코드에서 정의하기 전에 사용할 수 없습니다. 기능을 정의한 후에 만 사용하려면 도움이됩니다.
언제 함수 선언과 함수 표현식을 선택 해야하는지 <🎜
<,> 대부분의 경우, 귀하의 요구에 가장 적합한 기능을 정의하는 방법을 쉽게 결정할 수 있습니다. 이 지침은 대부분의 경우 신속하게 결정을 내리는 데 도움이됩니다.
다음 경우 기능 선언 사용 : <🎜 🎜>
더 읽기 쉽고 이해할 수있는 기능 (예 : 긴 기능 또는 다른 위치에서 사용하는 기능)이 필요합니다.
익명 함수는 귀하의 요구에 적합하지 않습니다
재귀 함수를 만들어야합니다
함수를 정의하기 전에 호출해야합니다
-
다음 경우 기능 표현식 사용 : <🎜 🎜>
더 유연한 기능이 필요합니다 <🎜 -
<🎜 🎜>로 승진하지 않는 함수가 필요합니다
이 함수는 정의 된 경우에만 사용해야합니다
이 함수는 익명이거나 미래에 이름이 필요하지 않습니다 -
는 기능 표현식을 즉시 호출하는 것과 같은 기술을 사용하여 함수의 실행 시간을 제어하려고합니다 (iife) <🎜 🎜
당신은 다른 함수로 인수로 함수를 전달하려고합니다 <🎜 🎜>
-
즉, 많은 경우에 기능 표현의 유연성이 강력한 이점이됩니다.
기능 표현식의 잠재력 : javaScript는 차이를 향상시킵니다
기능 선언보다 더 유용한 기능 표현 방법에는 여러 가지가 있습니다.
닫는 <🎜 🎜>
다른 기능의 주장 <🎜 🎜>
함수 표현식을 즉시 호출하십시오 (iife) <🎜 🎜>
-
함수 표현식을 사용하여 클로저를 만듭니다
클로저를 실행하기 전에 매개 변수를 함수로 전달하려면 클로저를 사용할 수 있습니다. 노드리스트를 통해 반복 할 때 이것이 어떻게 혜택을 받는지에 대한 좋은 예입니다.
클로저를 사용하면 함수가 실행 된 후 정보를 사용할 수없는 경우 인덱스와 같은 추가 정보를 유지할 수 있습니다. -
추가 이벤트 핸들러는 나중에 (루프 종료 후) 실행되므로 <🎜 🎜> 루프의 적절한 값을 보존하려면 폐쇄가 필요합니다. -
<🎜 🎜> 루프에서 - 함수를 추출하여 문제가 발생하는 이유를 이해하는 것이 더 쉽습니다.
-
여기서 솔루션은 인덱스를 함수 매개 변수로 외부 함수로 전달하여 값을 내부 함수로 전달할 수 있도록하는 것입니다. 일반적으로 핸들러 기능을 사용하여 내부 반환 기능을 구성하는 데 필요한 정보가 표시됩니다.
-
패키지 폐쇄 및 사용법에 대해 자세히 알아보십시오.
매개 변수로 함수 표현식을 전달합니다
기능 표현은 중간 임시 변수에 값을 할당 할 필요없이 함수로 직접 전달 될 수 있습니다.
당신은 그것들을 익명 기능의 형태로 가장 자주 보게됩니다. jQuery 함수 표현식의 친숙한 예는 다음과 같습니다.
기능 표현식은 <🎜 🎜>와 같은 메소드를 사용할 때 배열 항목을 처리하는 데 사용됩니다.
그들은 또한 이름이없는 익명 기능 일 필요가 없습니다. 기능 표현을 지명하여 기능이 무엇을 해야하는지 표현하고 디버그를 도와주는 것이 가장 좋습니다.
함수 표현식을 즉시 호출하십시오 (iife) <🎜 🎜>
iife는 기능과 변수가 글로벌 범위에 영향을 미치는 것을 방지하는 데 도움이됩니다. </h2>
<ies> 그 안의 모든 속성은 익명 함수의 범위 내에 있습니다. 이것은 다른 곳에서 코드에서 예상치 못한 또는 바람직하지 않은 부작용을 방지하는 일반적인 패턴입니다. <p>
<used> 쉽게 유지 관리되는 섹션에 코드 블록을 포함하는 모듈 모드로도 사용됩니다. 우리는 JavaScript 폐쇄, 콜백 및 iife의 미스터리를 밝혀내는 데 더 심층적 인 것을 탐구합니다. </p>
<simple> 이것은 iife의 간단한 예입니다 : <🎜 🎜><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>function funcDeclaration() {
return '函数声明';
}
let funcExpression = function () {
return '函数表达式';
}로그인 후 복사