>  기사  >  웹 프론트엔드  >  익명 함수, 중첩 함수, 클로저란 무엇입니까?

익명 함수, 중첩 함수, 클로저란 무엇입니까?

一个新手
一个新手원래의
2018-01-27 13:58:092243검색

익명 함수: 이전 글에서도 언급한 바 있는데, 함수 이름이 없는 함수를 말합니다

function (){ 
console.log('匿名函数') 
}

중첩 함수는 어떤가요? 코드를 보세요:

function test (){
   var  sum = 20;
   //内嵌函数
   demo = function(){
        alert(sum);
        console.log('我是嵌套函数');
    }
}

코드에서 볼 수 있듯이 함수는 함수 내에 내장되어 있는데, 이를 중첩 함수라고 합니다.

그럼 클로저란 무엇일까요?

별로 할 말이 없습니다. 코드를 보세요.

function demo(){
   var num = 0;
   
   // 返回一个函数 
   return function(){
      alert( num+1 );
   }
} 
//将返回的函数赋值给 add 变量
var add = demo();
// add就是一个闭包
add();

이렇게 보면 중첩 함수이고 상위 범위의 변수에 액세스할 수 있는 한 클로저인 것처럼 느껴집니다. 그렇습니까?

JS에서는 전역 범위와 로컬 범위로 나뉘며 각 기능은 로컬 범위와 동일하다는 것을 알고 있습니다.

마찬가지로 변수도 전역변수와 지역변수로 나누어집니다. 차이점은 무엇입니까?

브라우저에서 전역 범위 개체는 창입니다. 즉, 페이지가 열리자마자 창 개체가 존재한다는 의미입니다.

js에서는 각 함수마다 로컬 범위가 있으며, 함수 실행과 함께 로컬 변수가 생성되고 실행 후에는 소멸됩니다.

전역 변수는 페이지가 닫히지 않는 한 항상 존재합니다. 함수가 실행될 때 파괴되지 않습니다.

그럼 폐쇄와 무슨 관련이 있나요?

"JavaScript Advanced 프로그래밍"이라는 책에서 "스코프 체인"의 개념에 대해 이야기했습니다. 특별한 점은 전역 변수를 함수 내에서 직접 읽을 수 있다는 것입니다.

단, 함수 내부의 변수는 함수 외부에서 읽을 수 없습니다.

즉, 스코프 체인은 올라갈 수만 있고 내려갈 수는 없는 사다리와 같습니다. 이해하기 위해 코드 조각을 살펴보겠습니다.

var  name = "window";
var  age    =  20;
dmeo();
function demo(){
     var age = 21;
     console.log(name);  // window
     console.log(age);     //21
}

demo() 함수를 실행하면 검색 및 반환을 위해 현재 범위의 변수를 저장하기 위해 전역 범위로 연결되는 체인이 생성됩니다.

console.log( name ) 코드를 실행하면 현재 범위(데모 함수)에 name 변수가 있는지 검색합니다. 현재 범위가 존재하지 않으므로 전역 변수 이름이 위쪽으로 검색되므로 window가 반환됩니다. ;

console.log(age) 코드를 실행하면 현재 범위(데모 함수)에 age 변수가 존재하는지 여부도 검색합니다. 21이 반환됩니다.

메커니즘은 위쪽으로만 읽을 수 있으므로 내부 함수의 변수를 외부에서 어떻게 읽을 수 있는지 질문해 보세요.

방법은 없습니다. 약간만 변경하면 됩니다. 이를 위해서는 클로저 개념을 사용해야 합니다.

function  f1(){
   var num = 0 ;
   //定义内部函数
   function f2(){
      return  num + 1;
   }
   //返回 f2函数引用
   retufn  f2;
}

// bar 变量也指向 f2 函数,在此也是一个闭包
var bar = f1();

//执行
bar();   // 1;

우리는 함수가 실행된 후에 함수의 변수가 소멸된다는 것을 알고 있습니다. 위 코드의 경우 f1() 함수가 실행된 후 f2 함수가 전역 변수에 할당되고 f2 함수의 변수는 f1의 num 변수에 따라 달라집니다. 따라서 f1

의 num 변수는 f1의 기능을 따르지 않습니다. 실행 후 삭제됩니다.

여기서 "Ruan Yifeng"이라는 제목을 빌려 이해를 분석하고 심화했습니다.

링크: 자바스크립트 클로저 학습

var name = "the window";
  
 var obj = {
      name : 'the obj',
      getName : function(){
          return funciton(){ 
               return this.name;
          }
      }
}

//执行 getName返回的函数
alert(obj.getName()());

호출 함수 분석을 살펴보고 실행을 위해 두 부분으로 나누어 보겠습니다. 먼저 obj.getName()을 살펴보겠습니다. 이때 getName 함수는 obj 객체에 의해 호출되므로 이 값은 obj입니다. 하지만 이번에는 출력하지 않고 함수를 반환합니다.

()를 추가하여 반환된 함수를 실행하지만 반환된 함수는 개체 자체에서 호출되지 않으면 이 값이 창 개체로 승격됩니다. 따라서 출력은 "창"입니다

var name = "the Window";
var obj = {
    name : "the obj",
    getName : funciton(){
        var that = this;
        return function(){
             return that.name;
         }
    }
}
//执行 getName 返回的函数
alert(obj.getName()());

위 내용은 익명 함수, 중첩 함수, 클로저란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.