글로저......Closure(함수와 렉시컬 환경의 조합)

사실 잘 이해 가지 않는 부분인데...일단은 정리 해놓고 다음에 다시 또 보려고 합니다.

이걸 공부하게 된 계기는

제가 메인//// 메뉴////본문////이렇게 3부분의 jsp파일로 화면 구성을 했고

그중 메인에만  js파일을 넣어서 스크립트를 꾸렸더니

문제는 어쩌다 본문한개를 콜백으로 화면 변경하여 데이터를 불러 왔더니 js가 안먹히는 겁니다.

아무것도.....그 어떤것도.......왜그런줄 몰랐는데 초고수님 말씀!!!

자바스크립트는 순차적으로 로딩~~~메인의 자바스크립트는 이미 불러왔는데 이후 불러온 본문jsp파일을 읽고 처리할 스크립트 적용 처리 없이 그냥 불러오니 이미 적용된 메인의 js가 안먹힌다......였어요..

 

그래서 메인의 js파일에서 본문의 b.jsp파일을 함수로 불러오면 먹히겠금 구성하였는데

그럼 파일을 다시 불러올때 불필요한 가비지 데이터가 생긴다.......... 사실 이부분도 어렵습니다...일단 기록!

이걸 해결하는 것이 클로저!

클로저란 ? 내부 함수가 정의 될 때 외부 함수의 환경을 기억하고 있는 내부함수를 말함/ 외부 함숴 안에서 선언된 내부 함수는 그 외부 함수의 지역 변수나 함수에 접근하여 사용할 수 있음.

 

클로저 함수의 기본 형태.

//외부 함수
function closuer(){	      
    var count = 0;           //변수 정의
    
    function inner(){       // 내부 함수(클로저)선언
    	return count++;
    }    
    return inner();         // 내부 함수 반환
}

//익명 함수를 이용하는 방법
function closure(){
	var count = 0;
    return function(){      //익명 함수(클로저) 반환
    	return count++;
    }
}

클로저 함수 호출 예시

function outter(){   	//외부 함수
	var data = 1;
    function inner(){	//내부 함수
    	return data;
    }
    return inner();
}

var fucnt = outter();
console.log(func)

값은 1이다.

원래는 outter 함수를 호출하지 않았기 때문에 지역변수 data는 사용하지 못하는 것이 일반적이지만  자바스크립트에서는 사용할수 있다는 것이 특이한 점이다.

또한 전역 변수를 대체하여 클로저를 사용할 수 있어서 전역 변수의 남용을 막을 수 있고 변수 값을 은닉하는 용도로도 사용 할 수 있다.

 

어휘적 환경(Lexical Environment)

function makeAddr(x){
	return function(y){
    	retrun x+Y;
    }
}
const add3 = makeAdder(3);  //x = 3
console.log(add3(2));		//5 ;; y = 2  add함수가 생성된 이후에도
									상위함수인 makeAdder의 x에 접근(기억)
                                    
const add10 = makeAdderA(10);	//x = 10
console.log(add10(5));			//15
console.log(add3(1));			//4

add10과 add3은 다른 환경의 함수임으로 결국 결국 두 함수의 x 의 값은 다르다.

하지만 x의 값을 값자기 100이나 99 변경할수는 없다....add함수의 증감만 있을 뿐....이것을 은닉화!... 인것 같다^^

 

 

https://link.coupang.com/a/MtaVw

홈플래닛 고급형 알루미늄 노트북 거치대(쿨링홀 + 높이 각도 조절)