이 기사는 JS의 익명 기능의 생성 및 호출 방법을 분석합니다. 참조를 위해 공유하십시오. 특정 구현 방법은 다음과 같습니다.
익명 함수는 이름이없는 함수, 클로저라고도하는 기능으로, 지정된 이름이없는 함수를 임시로 생성 할 수 있습니다. 콜백 매개 변수의 값으로 가장 자주 사용되며, 많은 초보자는 익명 함수에 대해 알지 못합니다. 여기에서 분석합시다.
함수 함수 이름 (매개 변수 목록) {함수 바디;}
익명 기능을 만드는 경우 다음과 같습니다.
function () {function body;}
익명 기능이기 때문에 일반적으로 그에게 전달되는 매개 변수는 없습니다.
익명 기능을 만드는 이유는 무엇입니까? 어떤 상황에서 익명 기능이 사용됩니까? 익명 함수에 대한 두 가지 일반적인 시나리오가 있습니다. 하나는 콜백 함수이고 다른 하나는 함수를 직접 실행하는 것입니다.
AJAX 비동기 작업과 같은 콜백 기능에는 콜백 기능이 필요합니다. 여기서 자세히 설명하지 않겠습니다. 직접 실행 함수와 관련하여 예를 살펴본 후에는 이해할 것입니다.
다음과 같이 코드를 복사하십시오. <script language = "javaScript">
var a = "a";
(기능(){
var a = "b";
경고 (a);
}) ();
경고 (a);
</스크립트>
위의 코드에서는 두 개의 경고 상자가 순서대로 출력됩니다. 첫 번째 경고 상자의 내용은 B이고 두 번째 경고 상자는 a입니다. 혜택을 보셨습니까? 기능 실행을 사용하면 다른 스크립트의 동일한 변수가 공존 할 수 있도록 변수 범위를 제한 할 수 있습니다.
아래에서 먼저 익명 기능과 관련된 개념을 이해해 봅시다.
기능 문. 기능을 사용하려면 먼저 그 존재를 선언해야합니다. 우리가 사용하는 가장 일반적인 방법은 다음과 같은 기능 문을 사용하여 함수를 정의하는 것입니다.
다음과 같이 코드를 복사하십시오 : function abc () {
// 처리 할 코드
}
함수 abc () {// 프로세스로 코드}
물론, 당신의 기능은 매개 변수 또는 반환 값과 함께 할 수도 있습니다.
코드 사본은 다음과 같습니다. ClipboardPrint에 대한 일반적인시기?
기능 ABC (X, y) {
x+y를 반환합니다.
}
함수 ABC (x, y) {return x+y; }
그러나 기능을 어떻게 정의하든 JS 통역사는 기능 객체로 변환됩니다. 예를 들어, 위의 예 중 하나의 함수 번호를 정의하고 다음 코드를 입력합니다.
다음과 같이 코드를 복사하십시오. Alert (ABC 유형); // "function"
브라우저는 프롬프트 상자를 팝업하여 ABC가 기능 객체라고 자랑합니다. 그렇다면 기능 객체는 정확히 무엇입니까?
기능 객체
함수 객체는 JavaScript의 고유 한 객체이며 모든 함수는 실제로 기능 객체입니다. 먼저 기능 객체가 생성자를 직접 사용하여 새 기능을 만들 수 있는지 여부를 살펴 보겠습니다. 대답은 예입니다. 예를 들어:
코드 사본은 다음과 같습니다. var abc = new 함수 ( "x", "y", "return x*y;");
경고 (ABC (2,3)); // "6"
나는 모든 사람들이 지금 기능을 선포하는 방법에 대해 이해해야한다고 생각합니다. 그렇다면 익명 기능은 무엇입니까?
익명 기능을 선언합니다
이름에서 알 수 있듯이 익명 함수는 실제 이름이없는 함수입니다. 예를 들어, 위의 예제에서 함수 이름을 제거한 다음 기능 여부를 결정합니다.
다음과 같이 코드를 복사하십시오. alert (typeof function () {}); // "function"
alert (typeof function (x, y) {return x+y;}); // "function"
ALERT (새 함수 유형 ( "x", "y", "return x*y;") // "function"
alert (typeof function () {}); // "function"
alert (typeof function (x, y) {return x+y;}); // "function"
ALERT (새 함수 유형 ( "x", "y", "return x*y;") // "function"
우리는 그것들이 모든 기능 객체, 즉 모든 기능이라는 것을 쉽게 알 수 있지만, 모두 이름이없는 하나의 특성을 가지고 있습니다. 그래서 우리는 그것들을 "익명 기능"이라고 부릅니다. 그러나 정확하게 "이름"이 없기 때문에 우리는 그 이름을 찾을 방법이 없습니다. 이것은 익명 기능을 호출하는 방법에 대한 질문을 확장합니다.
익명 기능을 호출합니다
함수를 호출하려면 그것을 찾아서 참조하는 방법이 있어야합니다. 따라서 이름을 찾아야합니다. 예를 들어:
다음과 같이 코드를 복사하십시오 : var abc = function (x, y) {
x+y를 반환합니다.
}
경고 (ABC (2,3)); // "5"
위의 작업은 실제로 다른 방식으로 함수를 정의하는 것과 같습니다. 이 사용법은 우리가 더 자주 만나는 것입니다. 예를 들어, DOM 요소 이벤트 핸들러 기능을 설정하면 일반적으로 이름을 지정하지 않고 해당 이벤트에 익명 기능에 대한 참조를 제공합니다.
실제로 익명 함수를 호출하는 또 다른 방법이 있습니다. 이는 우리가 보는 jQuery 조각입니다 - 사용 ()을 사용하여 익명 함수를 동봉 한 다음 한 쌍의 괄호 (매개 변수 목록 포함)를 추가합니다. 다음 예를 살펴 보겠습니다.
다음과 같이 코드를 복사하십시오. alert ((함수 (x, y) {return x+y;}) (2,3)); // "5"
ALERT ((새 함수 ( "x", "y", "return x*y;") (2,3)); // "6"
많은 사람들이 왜이 방법이 성공적으로 호출 될 수 있는지 궁금해 할 수 있습니까? 이 응용 프로그램이 이상하다고 생각되면 아래의 설명을 확인하십시오.
괄호의 역할을 알고 있습니까? 괄호는 우리의 표현을 덩어리로 나눌 수 있으며, 각 조각, 즉 각 버팀대 쌍에는 반환 값이 있습니다. 이 반환 값은 실제로 괄호 안에서 표현식의 반환 값입니다. 따라서, 우리가 한 쌍의 괄호로 익명 함수를 동봉하면 괄호는 익명 함수의 함수 객체를 반환합니다. 따라서 브래킷 쌍에 익명 함수를 추가하는 것은 명명 된 기능과 같으며 기준 위치를 얻습니다. 따라서이 참조 변수 이후에 매개 변수 목록을 추가하면 일반 함수의 호출 양식이 구현됩니다.
위의 텍스트를 이해할 수 있는지 모르겠습니다. 여전히 이해할 수 없다면 다음 코드를 살펴보고 시도하십시오.
다음과 같이 코드를 복사하십시오 : var abc = function (x, y) {return x+y;}; // 익명 함수 객체를 ABC에 할당
// ABC의 생성자는 익명 함수의 생성자와 동일합니다. 즉, 두 기능의 구현은 동일합니다.
Alert ((ABC) .constructor == (함수 (x, y) {return x+y;}). 생성자);
추신 : 생성자는 객체를 생성하는 함수를 나타냅니다. 즉, 함수 객체로 표시되는 기능 본문.
요컨대, 브래킷 표현식에 의해 반환 된 함수 객체로서 (브래킷에 포함 된 익명 함수)를 이해 한 다음이 기능 객체에 일반 매개 변수 목록을 호출 할 수 있습니다. (이전에 실수를 저질렀습니다. 기능 표현 만 직접 호출 할 수 없습니다. 익명 기능 브래킷을 제거하고 표현식으로 할당해야합니다.
폐쇄
폐쇄 란 무엇입니까? 클로저는 1 단계 함수의 존재를 허용하는 특정 프로그래밍 언어의 코드 블록을 참조하고 첫 번째 수준 함수에 정의 된 자유 변수를 해제 할 수 없습니다. 첫 번째 수준의 함수가 해제 될 때까지 이러한 미공개 자유 변수는 1 단계 함수 외부에 적용될 수 있습니다.
어떻게? 땀이 났어요 ... 괜찮 았어요. (이해했지만, 표현 능력의 문제였습니다). 더 간단한 방식으로 설명해 봅시다 : Closure는 실제로 언어 기능입니다. 기능을 객체로 간주 할 수있는 프로그래밍 언어를 말하면 인스턴스 (로컬) 변수는 객체의 작업과 같은 함수에서 정의 될 수 있습니다. 이러한 변수는 함수의 인스턴스 객체가 파괴 될 때까지 함수로 저장할 수 있습니다. 다른 코드 블록은이 인스턴스 (로컬) 변수의 값을 어떤 방식 으로든 얻고 응용 프로그램에 적용 할 수 있습니다.
이런 식으로 설명한 후 더 명확할지 모르겠습니다. 여전히 이해하지 못하면 단순화하겠습니다. 클로저는 실제로 프로그래밍 언어의 실행중인 기능에 정의 된 로컬 변수를 참조하십시오.
이제 예를 살펴 보겠습니다.
다음과 같이 코드를 복사하십시오 : var abc = function (y) {
var x = y; // 이것은 로컬 변수입니다
return function () {
ALERT (X ++); // 이것은 X가 첫 번째 수준 함수에서 호출되는 곳입니다.
alert (y-); // 참조 된 매개 변수 변수는 또한 자유 변수입니다.
}} (5); // 초기화
abc (); // "5" "5"
abc (); // "6" "4"
abc (); // "7" "3"
경고 (x); // 오류! "X"는 정의되지 않았습니다!
이것을 본 후, jQuery의 코드 스 니펫이 폐쇄인지 알 수 있습니까?
제 생각에는 그것에 대해 이야기합시다. 클로저 기능이 적용되는지 여부에 관계 없이이 코드의 가장 중요한 요소가 파괴되지 않은 로컬 변수인지 여부를 결정해야합니다. 그런 다음 구현없이 클로저 기능을 적용하는 것은 불가능합니다. 그러나 익명 기능에 구현이 있으면 어떻게됩니까? 또한 구현에 파괴되지 않은 로컬 변수가 있는지 확인해야합니다. jQuery 코드 스 니펫의 시작 부분에서 JS의 어떤 기능이 사용되는지 묻는다면? 그런 다음 익명 기능과 익명 기능에 대한 호출 일뿐입니다. 그러나 폐쇄의 특성을 의미하며 언제든지 구현할 수 있습니다.
가장 일반적인 사용법 :
다음과 같이 코드를 복사합니다. (function () {
경고 ( '물');
}) ();
물론 매개 변수도 포함될 수 있습니다.
다음과 같이 코드를 복사합니다. (function (o) {
경고 (o);
})('물');
익명의 기능과 함께 체인 통화를 사용하고 싶습니까? 매우 간단 :
다음과 같이 코드를 복사합니다. (function (o) {
경고 (o);
return arguments.callee;
}) ( 'Water') ( 'down');
당신은 모든 일반적인 익명 기능을 알고 있습니다. 드문 일을 살펴 보겠습니다.
다음과 같이 코드를 복사합니다. ~ (function () {
경고 ( '물');
}) (); // 쓰기는 약간 멋지다 ~
void function () {
경고 ( '물');
} (); // 가장 효율적인 ~
+function () {
경고 ( '물');
} ();
-기능(){
경고 ( '물');
} ();
~ function () {
경고 ( '물');
} ();
!기능(){
경고 ( '물');
} ();
(기능(){
경고 ( '물');
} ()); // 약간의 강제 실행 ~
이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.