- 왜 자바스크립트에서는 전역변수를 지양해야할까?
변수가 섞일 수 있기 때문이다.
자바스크립트 앱을 만들면서 혼자만 개발하는 것이 아니라, 여러 명과 협동도 하고, 다른 사람의 라이브러리 (자바스크립트 코드 모음)을 사용하는 일도 많다.
그런데 전역변수를 사용하다 보면, 우연의 일치로 인해서, 같은 변수 이름을 사용해서 이전에 있던 변수를 덮어쓰는 불상사가 발생할 수 있다.
제일 간단한 방법은 전역변수 대신 한 번 함수 안에 넣어서 지역변수로 만드는 것이다.
또는 객체 안의 속성으로 만드는 것이다.
var obj = {
x: 'local',
y; function(){alert(this.x)}
}
=> 이런 방법을 네임스페이스를 만든다고 표현한다.
고유한 네임 스페이스를 만들어서 겹치지 않게 하는 것이다!
하지만 위 방법은 누군가가 고의적으로 x,y를 바꿀수 있다.
위 코드에서 obj를 통째로 바꾸지 않아도, obj.x = 'hacked' 라고 사용해버릴 수 있기 때문이다.
이런 것을 막기위해서
var another = function(){
var x = 'local';
function y(){
alert(x);
}
return {y:y};
}
var newScope = another();
위 코드처럼 작성할 수 있는데,
another()를 호출하는 순간 {y: function(){alert(x)}}가 newScope에 저장되게된다.
이제 newScope라는 네임스페이스를 통해서 y에 접근할 수 있고, x는 접근할 수 없게된다.
위 처럼 프로그래밍을 하게 된다면, return을 통해서 공개할 변수 y만 공개하고, 비공개하고 싶은 변수 x는 비공개할 수 있다.
또한
var newScope = (function(){
var x = 'local';
function y(){
alert(x);
}
return {y:y};
})
위처럼 사용할 수 있는데,
모듈 패턴이라고도 부르고, IIFE(즉시 호출 함수 표현식)이라고도 불린다.
이것을 활용하여 실행컨텍스트와, 클로저에 대해 알아볼 수 있다.
'개발 > FrontEnd Interview' 카테고리의 다른 글
Window객체와 BOM (0) | 2021.04.03 |
---|---|
실행 컨텍스트란? (2) | 2021.04.02 |
lexical scope 란? (0) | 2021.03.29 |
하루브타 스터디 #1 (doctype, 이벤트 위임, 캡처링, 버블링, 커스텀 이벤트) (0) | 2021.03.28 |
꼬리 호출 (0) | 2021.03.25 |