관리 메뉴

흰둥씨의 개발장

[오늘의 자바스크립트]변수와 상수 & 클로저 본문

[오늘의 공부]/Javascript

[오늘의 자바스크립트]변수와 상수 & 클로저

돈워리비해삐 2022. 12. 16. 01:25

var, let, const를 사용해 변수(variable)를 선언할 수 있고, 선언된 변수엔 데이터를 저장할 수 있습니다.
변수는 마치 '이름이 붙은  데이터 저장소’와 같습니다.

let banana;// 변수 선언
console.log(banana); //선언후 아무것도 대입하지 않으면 undefined.
banana = 1000;// 변수 banana에 숫자 1000을 '대입' 했다.
banana = 5000;//값의 재할당
console.log(banana); //콘솔에 변수값 출력
 
 
* 지역변수 : {} 영역 안에서만 적용
* 전역변수 : 문서 전체에 적용 > let apple=1+1; function calc(){} 와 같이 밖에서 함수 밖에서 선언된 경우 
ㄴ변수키워드 (var , let, const)없이 작성된경우 전역변수가 됨 (cat = 3000;같이 키워드 없이 작성된 변수) 
 
 
* scope 범위 (=유효한 범위)
function level scope(함수레벨스코프) : 함수 내에서만 유효한 범위 (ex. var)
block level scope (블록레벨스코프): {}안에서만 유효한 범위. if, for문 등 다른 문에서도 가능
  • let – 모던한 변수 선언 키워드(블록스코프로 {}), let키워드를 사용하여 같은 변수명으로 재선언 불가능 (let a=100; let a=200; 불가능), 재할당 가능 
if (true) {let test = true; }
console.log(test);//  test is not defined 에러뜸
  • var – 오래된 변수 선언 키워드(잘 안씀, 함수 스코프이거나 전역 스코프, 블록스코프가 없어서 {}안에서 선언해도 {}밖에서 접근이 가능함), var키워드를 사용하여 같은 변수명으로 재선언 가능 (var a=100; var a=200; 가능), 재할당 가능
if (true) { var test = true; }
console.log(test);// true(if 문이 끝났어도 변수에 계속 접근할 수 있음)
  • const – 상수(constant number)선언 키워드, 변수의 값을 변경할 수 없다(재할당, 재선언 불가), 반드시 선언과 동시에 대입해야한다. (값이 변경되지 않음을 알리기 위한 키워드로 왕왕씀)
 

변수명 명명시, 오직 문자와 숫자로 작성하고, 기호중엔 $와 _만 사용가능하며, 첫 글자는 숫자로 작성하면 안됩니다.
 
 
 

클로저

주변상태(렉시컬환경)의 참조와 함께 번들로 묶인 함수의 조합

  1. 전역변수를 줄일 수 있다. =>다른 사람의 코드와 내 코드를 합쳤을 때 충돌을 막을수있음 
  2. 비슷한 형태의 코드를 재사용 할 수있게 된다. 
  3. For문과 var를 사용할때는 조심해야한다. 

ㄴvar는 블럭스코프가 아니기 때문에 함수내부에 지역변수로 선언이  되어도 함수밖에서 접근이 가능하다. =>let을써서 해결가능
ㄴfor문은 외부 함수 안에 작성된 내부 함수 클로저가 ‘비동기함수’인  경우 (setTimeout or setInterval같은 함수), for문이 먼저   실행되어 정확한 값을 얻지 못하는 경우가 있다. => 내부함수   (비동기함수인 경우)를 즉시실행함수로 작성하면 정확한 값을   얻을 수 있다. 
 

+

자신을 포함하고 있는 외부 함수보다 내부 함수가 더 오래 유지되는 경우,

외부 함수 밖에서 내부 함수가 호출되더라도 외부 함수의 지역 변수에 접근할 수 있는 함수

=> 반환된 내부 함수가 자신이 선언됐을 때의 환경(Lexical environment)인 스코프를 기억하여 자신이 선언됐을 때의 환경(스코프) 밖에서 호출되어도 그 환경(스코프)에 접근할 수 있는 함수

단점

생성될 때의 환경(Lexical environment)을 기억해야 하므로 메모리 고사용

장점

현재 상태를 기억하고 변경된 최신 상태를 유지

캡슐화, 모듈화 가능