JavaScript의 즉시 실행 기능 예제에 대한 자세한 설명

Javascript는 다른 프로그래밍 언어에 비해 상대적으로 캐주얼하기 때문에 JavaScript 코드에는 온갖 이상한 쓰기 방법이 가득하고 때로는 혼란스러울 수도 있습니다. 물론 다양한 쓰기 방법을 이해할 수 있다는 것은 자바스크립트의 특성을 더 깊이 이해하는 것이기도 합니다. 자바스크립트 언어. 이번 글에서는 자바스크립트의 즉시 실행 기능에 대한 관련 정보를 주로 소개하겠습니다. 도움이 되셨으면 좋겠습니다.

Foreword

js 실행 함수를 사용하면 함수가 생성된 후 즉시 실행될 수 있습니다. js 실행 함수 즉시 모드는 함수를 정의한 후 즉시 실행할 수 있도록 하는 구문입니다. 생성 직후 실행되는 함수 표현식(명명 또는 익명)입니다.

( function(){…} )() 및 ( function (){…} () )은 함수를 즉시 실행하기 위해 JavaScript 함수를 작성하는 두 가지 일반적인 방법입니다. 처음에는 괄호로 묶인 익명 함수인 줄 알았습니다. 그리고 마지막에 괄호를 추가했는데, 결국 함수를 정의한 직후에 실행한다는 목적을 달성하게 되었는데, 나중에 괄호를 추가한 이유가 사실이 아닌 것으로 밝혀졌습니다.

아래에서는 할 말이 많지 않으니, 자세한 소개를 살펴보겠습니다.

보통 우리는 다음과 같은 방식으로 함수를 선언합니다:

// 声明函数f1
function f1() {
 console.log("f1");
}
// 通过()来调用此函数
f1();


//一个匿名函数的函数表达式，被赋值给变量f2:
var f2 = function() {
 console.log("f2");
}
//通过()来调用此函数
f2();


//一个命名为f3的函数的函数表达式(这里的函数名可以随意命名，可以不必和变量f3重名)，被赋值给变量f3:
var f3 = function f3() {
 console.log("f3");
}
//通过()来调用此函数
f3();

일부 사용자 정의 컨트롤을 본 경우 대부분 다음과 같은 작성 방식을 따른다는 것을 알 수 있습니다.

(function() {
 "
 // 这里开始写功能需求
 })();

이것은 우리가 종종 즉시 실행 함수(IIFE)라고 부르는 것입니다. 이름에서 알 수 있듯이 이 함수는 함수 본문을 즉시 실행하며 이를 적극적으로 호출할 필요가 없다는 의미입니다. 일반적으로 우리는 익명 함수에만 IIFE를 사용합니다. 이를 수행하는 데는 두 가지 목적이 있습니다. 两 하나는 함수 이름을 지정하지 않고 전역 변수 오염을 방지하는 것입니다.

두 번째는 IIFE 내부에 IIFE의 별도 범위를 형성할 수 있다는 것입니다. 밖에서 읽어보세요.

이 두 문장을 이해할 수 없다면 IIFE의 작동 원리부터 시작해 보세요.

IIFE는 일반적으로 익명 함수에 사용되므로 여기서는 간단한 익명 함수를 예로 사용합니다.

var f = function(){
 console.log("f");
}
f();

여기서 f는 이 익명 함수의 참조 변수일 뿐이므로 f() 이후 can call this function, f를 함수 자체로 바꿀 수 있습니까?

function(){
 console.log("f"); 
}();

실행 후 다음 결과를 얻습니다.

Uncaught SyntaxError: Unexpected token (

이 오류의 원인은 Javascript 엔진이 function 키워드는 뒤에 함수 선언문이 있는 것으로 간주하고 괄호로 끝나서는 안 됩니다. 해결책은 괄호 앞의 부분이 함수 정의 문이 아니라 연산이 가능한 표현식임을 엔진에 알리는 것입니다. 함수 선언과 함수 표현식의 차이점은 다음과 같습니다.

1. 즉, 우리는 일반적으로 함수를 선언하기 위해 x(){} 함수를 사용합니다. school 다음과 같이 표현식이 먼저 실행됩니다.

function myFunction () { /* logic here */ }

사실 JavaScript 엔진은 function 키워드를 보면 함수 선언문이라고 생각합니다. 따라서 Javascript 엔진이 괄호를 먼저 확인하면 괄호는 어떻게 되나요?

var myFunction = function () { /* logic here */ };
var myObj = {
 myFunction: function () { /* logic here */ }
};

함수가 성공적으로 실행되었습니다.

1+(2+3) //这里先运行小括号里面的内容没有意见撒

이 경우 Javascript 엔진은 이것이 표현식이라고 생각합니다. , 물론, 자바스크립트 엔진은 이것을 표현식이라고 생각해야 합니다. 이 표현식을 사용하는 방법은 다양합니다.

//用小括号把函数包裹起来
(function(){
  console.log("f");  
})();

이전 질문으로 돌아가서, 왜 IIFE는 전역 변수 오염을 방지합니다. 다른 사람이 작성한 jquery 플러그인을 본 경우 일반적으로 다음과 유사한 코드가 있습니다.

f //控制台输出

여기서 jquery는 실제로 익명 함수의 매개변수입니다. 익명 함수를 호출하면 f()를 사용하므로 익명 매개변수는 f(args)입니다. 여기서 jquery가 매개변수로 함수에 전달되면 형식 매개변수 $는 내부에서 사용될 때 외부 환경에 영향을 주지 않습니다. 일부 플러그인은 $ 한정자를 사용하기 때문에 이 함수 내에서 원하는 모든 작업을 수행할 수 있습니다.

관련 권장 사항:

JS의 즉시 실행 기능

JavaScript_javascript 기술에서 즉시 실행 함수를 작성하는 세 가지 방법

JavaScript_javascript 기술의 즉시 실행 함수 표현식 소개

위 내용은 JavaScript의 즉시 실행 기능 예제에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!