JavaScript 인라인 함수와 미리 정의된 함수의 차이점

1. 자바스크립트 인라인 함수
2. JavaScript 사전 정의 함수
3. 자바스크립트 함수 설명
4. JavaScript 함수 표현식

이 튜토리얼에서는 JavaScript의 인라인 함수 및 미리 정의된 함수를 살펴봅니다. Named Functions이라고도 부르기 때문에 Function Expression과 Function Statement를 이해하려고 노력할 것입니다.

자바스크립트 인라인 함수

변수에 포함된 익명 함수는 JavaScript의 인라인 함수입니다. 익명 함수의 URL을 사용하여 지속적으로 호출됩니다. 익명 함수는 필수가 아니며 런타임에 형성됩니다.

익명 함수와 인라인 함수가 모두 런타임에 생성된다는 사실은 거의 동일합니다. 반면 인라인 부분은 변수에 할당되어 재사용이 가능하다.

이와 관련하여 인라인 함수는 일반 함수처럼 작동합니다.

예제 코드:

 <script type="text/javascript">
        var samelineFunc = function () {
            alert("inline function");
        };
        $('#inline_func_c').click(samelineFunc);
    </script>

실행 코드

출력:

인라인 함수는 언제 어디서나 활용할 수 있는 변수를 생성했습니다.

JavaScript 사전 정의 함수

JavaScript의 미리 정의된 함수 모음은 호출 시 특정 작업을 수행합니다. 그 중 일부는 다음과 같습니다.

예제 코드:

var k = 50;
var b = 30;
var c = eval('k + b');
document.write('The result of eval is: ' + c + '<br>');

실행 코드

출력:

The result of eval is: 80

자바스크립트 함수 설명

function 문은 함수를 선언합니다. 정의된 프로세스가 나중에 호출되면 나중에 사용할 수 있도록 보존되어 실행됩니다.

변수 선언이 var로 시작해야 하는 것처럼 함수 선언은 function으로 시작해야 합니다.

예제 코드:

function add() {
  return a;
}

함수는 여기에서만 선언되었습니다. 사용할 함수 이름을 사용하여 호출해야 합니다. 예: 추가();

함수 표현식을 사용하는 예를 살펴보겠습니다.

function add(b, c) {
  return b + c;
}
console.log(add(4, 5));

실행 코드

출력:

9

JavaScript 함수 표현식

함수 표현식과 함수 선언은 비슷하지만 함수 표현식을 변수에 넣을 수 있습니다. 함수는 표현식으로 정의되자마자 호출됩니다.

JavaScript 함수를 설명하기 위해 표현식을 사용할 수도 있습니다. 변수에 함수 표현식을 유지하는 것이 가능합니다.

예제 코드:

var add = function(b, c) {
  return b + c;
};

변수는 함수 표현식을 넣은 후 함수로 활용할 수 있습니다. 변수에 저장된 함수에는 함수 이름이 필요하지 않습니다.

변수 이름을 사용하여 지속적으로 호출(호출)됩니다.

예제 코드:

var add = function(b, c) {
  return b + c;
};

console.log(add(5, 4));

실행 코드

출력:

9

함수 표현식은 인터프리터가 해당 코드 줄에 도달하면 로드되는 반면, 함수 선언은 코드가 수행되기 전에 로드됩니다.

함수 선언은 var 문과 마찬가지로 다른 코드 줄의 맨 위로 올라갑니다. 함수 표현식은 호이스팅되지 않기 때문에 선언된 범위에서 로컬 변수의 복사본을 유지할 수 있습니다.

함수 표현식은 클로저, 함수 표현식을 즉시 호출하는 다른 함수의 매개변수 및 함수 선언(IIFE)보다 더 유용하게 만드는 다양한 방법으로 사용할 수 있습니다.