JavaScript란?

HTML, CSS와 함께 웹을 구성하는 요소 중 하나로 웹 브라우저에서 동작하는 유일한 프로그래밍 언어

1. 기본 문법

1.1 변수

값(value)을 저장하고 참조하기 위한 식별자(identifier)
var 키워드로 선언하고 = 연산자로 할당
동적 타이핑(dynamically typed): 선언 시 타입 지정 없음

1.2 값

자바스크립트의 모든 값은 데이터 타입을 가짐
원시 타입: number, string, boolean, null, undefined, symbol
객체 타입: object (배열, 함수, 정규표현식 등도 객체)
리터럴 표기법으로 직접 값 생성

1.3 연산자

산술 (+, -, *, /), 문자열 연결 (+),
할당 (=), 비교 (>, <, == 등), 논리 (&&, ||),
타입 (typeof), 인스턴스 생성 (new) 등
피연산자 타입이 다르면 암묵적 타입 변환 수행

1.4 키워드

언어에 예약된 단어로 특정 동작 지시
var, function, return, if, for, while, break

1.5 주석

/* … */ 사용하며 코드 설명

1.6 문

실행 시 특정 동작을 수행
세미콜론(;)으로 끝냄
코드 블록({ … })으로 그룹화 가능

1.7 표현식

하나의 값으로 평가되는 구문
리터럴·연산·함수 호출 등이 모두 표현식

1.8 문과 표현식의 비교

표현식: 값으로 평가만 가능
문: 값을 생성·대입하거나 흐름 제어 등 실행 가능

1.9 함수

작업 단위의 코드 블록
선언문: function name(params){ … }
호출: name(args)

1.10 객체

키-값 쌍(property)의 집합
메소드(method): 값이 함수인 프로퍼티
프로토타입을 통해 상속 사용

1.11 배열

순차적 데이터 저장용 객체
인덱스로 요소 접근
다양한 내장 메소드 제공

2. 데이터 타입과 변수

2.1 데이터 타입

2.1.1 원시 타입

2.1.1.1 number

모든 수를 64비트 부동소수점으로 처리
Infinity, -Infinity, NaN 포함

2.1.1.2 string

변경 불가능한 유니코드 텍스트, 작은/큰 따옴표 또는 백틱 사용

2.1.1.3 boolean

true 또는 false

2.1.1.4 undefined

선언만 하고 할당하지 않은 변수의 초기값

2.1.1.5 null

“값이 없음”을 명시

2.1.1.6 symbol

유일무이한 식별자용 원시값

2.1.2 객체 타입 (Object type, Reference type)

키-값 쌍의 집합으로, 프로퍼티와 메소드 포함

2.2 변수

2.2.1 변수의 선언

var, let, const로 선언 = 연산자로 할당
선언만 하면 undefined, 선언 없이 참조 시 ReferenceError

2.2.2 동적 타이핑 (Dynamic Typing)

변수 선언 시 타입 지정 불필요
할당된 값에 따라 타입이 자동 결정(typeof로 확인 가능)

2.2.3 변수 호이스팅(Variable Hoisting)

var 선언문은 실제 코드 최상단에 선언·초기화된 것처럼 동작
선언 이전에 참조해도 undefined를 반환

2.2.4 var 키워드로 선언된 변수의 문제점

1. 함수 단위 스코프만 제공, 블록 단위 스코프 미지원
2. 중복 선언 허용, 선언 생략 시 암묵적 전역 생성
3. 의도치 않은 전역 변수 및 값 덮어쓰기 위험

3. 연산자

3.1 표현식과 연산자

표현식(expression): 평가되어 하나의 값이 되는 코드
연산자는 표현식을 결합해 새 값을 만든다

3.2 문과 표현식

문(statement): 실행 시 동작을 수행 (var, if, for 등)
표현식은 값으로 평가
문은 제어 흐름이나 선언 등

3.3 연산자란?

하나 이상의 피연산자(operand)를 처리해 값을 생성
산술·할당·비교·논리·타입 연산 등 다양한 종류

3.4 산술 연산자

수학적 계산을 수행해 새로운 숫자 값을 만든다
산술 연산을 할 수 없는 경우에는 NaN을 반환한다

3.4.1 이항 산술 연산자

연산자	의미
+	덧셈
-	뺄셈
*	곱셈
/	나눗셈
%	나머지

3.4.2 단항 산술 연산자

연산자	의미
++	증가 (피연산자의 값을 1만큼 증가시키며, 위치에 따라 선위/후위 증감 동작이 달라짐)
--	감소 (피연산자의 값을 1만큼 감소시키며, 위치에 따라 선위/후위 증감 동작이 달라짐)
+	부호 연산자: 아무런 부수 효과 없이 피연산자를 숫자 타입으로 변환하여 반환
-	부호 연산자: 피연산자의 부호를 반전한 값을 반환 (음수를 양수로, 양수를 음수로), 숫자 타입이 아닌 값은 숫자로 변환 후 부호 반전

3.4.3 문자열 연결 연산자

+: 피연산자 중 하나가 문자열이면 문자열 결합

3.5 할당 연산자

연산자	사례	동일 표현
=	x = y	x = y
+=	x += y	x = x + y
-=	x -= y	x = x - y
*=	x *= y	x = x * y
/=	x /= y	x = x / y
%=	x %= y	x = x % y

3.6 비교 연산자

좌항과 우항의 피연산자를 비교하여 boolean 값을 반환한다

3.6.1 동등 / 일치 비교 연산자

연산자	설명
==	동등 비교: 값만 같으면 true (x == y)
===	일치 비교: 값과 타입 모두 같아야 true (x === y)
!=	부등 비교: 값이 다르면 true (x != y)
!==	불일치 비교: 값 또는 타입이 다르면 true (x !== y)

3.6.2 대소 관계 비교 연산자

연산자	사례	설명
>	x > y	x가 y보다 크다
<	x < y	x가 y보다 작다
>=	x >= y	x가 y보다 같거나 크다
<=	x <= y	x가 y보다 같거나 작다

3.7 삼항 조건 연산자

문법: 조건식 ? 참값 : 거짓값
표현식이므로 다른 표현식 안에 사용 가능

3.8 논리 연산자

&& (AND), || (OR): 피연산자 중 하나를 반환, 단축 평가
! (NOT): 불리언으로 변환 후 반전

3.9 쉼표 연산자

,: 여러 표현식을 순차 평가 후 마지막 값 반환

3.10 그룹 연산자

(...): 우선순위 제어, 괄호 안을 먼저 평가

3.11 typeof 연산자

typeof x: 피연산자의 타입을 문자열로 반환
주의: typeof null은 "object", 선언 안 된 식별자는 "undefined" 반환

4. 제어문

4.1 블록문

{ … }로 묶인 문들의 집합

4.2 조건문

평가 결과에 따라 코드 블럭(블록문)의 실행을 결정

4.2.1 if..else 문

if (조건) { … } else if (조건) { … } else { … }

조건은 불리언으로 평가, 중괄호 생략 가능
삼항 조건 연산자로 대체 가능

4.2.2 switch 문

switch (값) { case A: …; break; …; default: … }

일치하는 case로 점프, break로 폴스루 방지
여러 case 묶거나 default 생략 가능

4.3 반복문

평가 결과가 참인 경우 코드 블럭을 실행

4.3.1 for 문

for (초기; 조건; 증감) { … }

초기→조건→블록→증감 순으로 반복
초기·조건·증감 모두 생략하면 무한 루프

4.3.2 while 문

while (조건) { … }

조건이 참인 동안 반복, 무한 루프 시 break로 탈출

4.3.3 do…while 문

do { … } while (조건);

본문을 최소 한 번 실행 후 조건 검사

4.4 break 문

break; 로 가장 가까운 반복문 또는 switch 탈출

반복문을 더 이상 진행하지 않아도 될 때 불필요한 반복을 회피

4.5 continue 문

continue; 로 반복문의 현재 순환만 중단하고 증감식으로 이동

불필요한 들여쓰기 방지용으로 활용

5. 타입 변환과 단축 평가

5.1 타입 변환

암묵적 타입 변환 & 명시적 타입 변환 으로 구분

5.2 암묵적 타입 변환

암묵적 타입 변환: 연산문맥에 맞춰 JS 엔진이 자동으로 변환

5.2.1 문자열 타입으로 변환

문자열 연결(+): 피연산자가 문자열이면 다른 값을 모두 문자열로 변환

5.2.2 숫자 타입으로 변환

산술·비교 연산문맥: 피연산자가 숫자가 아니면 숫자로 강제 변환, 실패 시 NaN

'5' * 2      // 10
'a' - 1      // NaN
'3' > 1      // true

5.2.3 불리언 타입으로 변환

조건문·논리 연산문맥: 값이 Falsy(0, '' 빈 문자열, null, undefined, NaN, false)면 false, 그 외는 true

5.3 명시적 타입 변환

명시적 타입 변환(타입 캐스팅): 개발자가 toString(), Number(), Boolean() 등으로 직접 변환

5.3.1 문자열 타입으로 변환

String(x), x.toString(), x + ''

String(1)    // "1"
(1).toString() // "1"
1 + ''      // "1"

5.3.2 숫자 타입으로 변환

Number(x), parseInt(x), +x, x * 1

Number('2')  // 2
parseInt('2')// 2
+'2'         // 2
'2' * 1      // 2

5.3.3 불리언 타입으로 변환

Boolean(x), !!x

Boolean(0)   // false
!!{}         // true

5.4 단축 평가

논리연산자 &&, ||는 결과 결정 피연산자를 그대로 반환

단축 평가 표현식	평가 결과
true // anything	true
false // anything	anything
true && anything	anything
false && anything	false

6. 객체

6.1 객체(Object)란?

자바스크립트는 객체 기반 언어
키(key) 와 값(value) 으로 구성된 프로퍼티(property) 들의 집합
함수도 값이므로, 프로퍼티 값으로 함수 사용 가능 → 메소드(method)

6.1.1 프로퍼티

키: 문자열 또는 Symbol (빈 문자열 포함 가능)
값: 모든 자바스크립트 값
같은 키 중복 시 나중 것이 덮어씀
객체의 프로퍼티 순서는 보장되지 않음

6.1.2 메소드

프로퍼티 값이 함수일 경우 메소드라고 부르며, 객체의 동작(행위)을 정의

6.2 객체 생성 방법

javascript는 프로토타입 기반 객체 지향 언어로서 클래스라는 개념이 없고 별도의 객체 생성 방법이 존재

6.2.1 객체 리터럴

{} 사용
가장 간단하고 일반적인 방식

var person = { name: 'Kim', gender: 'female' };

6.2.2 Object 생성자 함수

new Object()로 생성 후 프로퍼티 추가
객체 리터럴 방식보다 복잡하며 일반적으로 잘 사용되지 않음

6.2.3 생성자 함수

1. 생성자 함수 이름은 일반적으로 대문자로 시작
2. 프로퍼티 또는 메소드명 앞에 기술한 this는 생성자 함수가 생성할 인스턴스(instance)이다
3. this에 연결(바인딩)되어 있는 프로퍼티와 메소드는 public(외부에서 참조 가능)이다
4. 생성자 함수 내에서 선언된 일반 변수는 private(외부에서 참조 불가능)이다

6.3 객체 프로퍼티 접근

6.3.1 프로퍼티 키

유효한 식별자는 따옴표 없이 사용 가능 (그렇지 않으면 따옴표 필요)
표현식 키는 []로 묶어 사용.

6.3.2 프로퍼티 값 읽기

. 또는 []표기법 사용
[]는 문자열 또는 표현식 사용 가능
존재하지 않는 프로퍼티 접근 시 undefined 반환

6.3.3 프로퍼티 값 갱신

기존 프로퍼티에 새 값을 할당하면 값이 갱신

6.3.4 프로퍼티 동적 생성

존재하지 않는 키에 값을 할당하면 새 프로퍼티가 생성

6.3.5 프로퍼티 삭제

delete 연산자로 프로퍼티 삭제 가능

6.3.6 for-in 문

객체의 모든 열거 가능한 프로퍼티에 대한 루프 수행
배열에 사용 시 예상치 못한 결과 발생 가능

var person = {
  name: 'Kim',
  age: 22,
  gender: 'female'
};

for (var key in person) {
  console.log(key + ': ' + person[key]);
}

6.4 Pass-by-reference

객체는 참조값이 전달됨
여러 변수가 같은 객체를 참조하면 한쪽의 변경이 다른 쪽에도 반영된다

6.5 Pass-by-value

원시 타입은 복사되어 전달됨
변수 간 독립적이며, 한쪽 변경이 다른 쪽에 영향을 주지 않는다

6.6 객체의 분류

Built-in Object: JS 엔진에 내장 (예: Object, Array, Function 등)
Native Object: BOM/DOM 관련 객체 (예: window, document 등)
Host Object: 사용자 정의 객체

7. 객체와 변경불가성(Immutability)

7.1 immutable value vs. mutable value

Immutable Value (변경 불가능한 값)

JavaScript의 원시 타입 (Boolean, null, undefined, Number, String, Symbol) 변경 불가능
재할당은 가능하지만 기존 값 자체를 수정할 수는 없다

let str = 'Hello';
str = 'World'; // 'Hello'는 그대로, 'World'는 새로 생성됨

Mutable Value (변경 가능한 값)

객체(Object)는 참조 타입이며, 직접 수정이 가능
객체나 배열은 원본이 변경될 수 있으므로 주의해야 한다

var arr = [];
arr.push(2); // 원본 배열(arr)이 직접 변경됨

7.2 불변 데이터 패턴(immutable data pattern)

의도하지 않은 객체의 변경이 발생하는 원인의 대다수는 “레퍼런스를 참조한 다른 객체에서 객체를 변경”하기 때문 -> 객체를 불변객체로 만들어 프로퍼티의 변경을 방지

7.2.1 Object.assign

객체를 복사하거나 병합할 때 사용
얕은 복사(shallow copy)를 하므로 중첩 객체는 여전히 참조됨

7.2.2 Object.freeze

객체를 동결하여 프로퍼티 수정, 추가, 삭제를 막음
중첩 객체는 동결되지 않으므로 내부 객체까지 변경 불가능하게 만들려면 deep freeze 필요

7.2.3 Immutable.js

Map, List, Set 등 다양한 구조 지원
객체 수정 시 기존 객체는 유지되고 새로운 객체를 반환

8. 함수

어떤 작업을 수행하기 위해 필요한 문(statement)들의 집합을 정의한 코드 블록

8.1 함수 정의

함수를 정의하는 3가지 방법

1. 함수 선언문
2. 함수 표현식
3. Function 생성자 함수

8.1.1 함수 선언문

function 함수명() {}
호이스팅되어 선언 이전에도 호출 가능

8.1.2 함수 표현식

변수에 함수 리터럴을 할당
익명 함수 가능

const add = function(a, b) {
  return a + b;
};

console.log(add(3, 4)); // 7

호이스팅 시 undefined로 초기화됨

8.1.3 Function 생성자 함수

new Function('param', 'body')로 정의
일반적으로 사용하지 않음

8.2 함수 호이스팅

함수 선언문은 코드의 상단으로 끌어올려져 먼저 실행 가능
함수 표현식은 변수 호이스팅만 되어 에러 발생 가능

sayHello(); // 실행 가능

function sayHello() {
  console.log("안녕하세요!");
}

8.3 First-class object (일급 객체)

일급 객체 조건

1. 무명의 리터럴로 표현이 가능하다.
2. 변수나 자료 구조(객체, 배열 등)에 저장할 수 있다.
3. 함수의 매개변수에 전달할 수 있다.
4. 반환값으로 사용할 수 있다.

=> JavaScript의 함수는 일급객체

8.4 매개변수(Parameter, 인자)

8.4.1 매개변수(parameter, 인자) vs 인수(argument)

parameter: 함수 정의 시 사용
argument: 함수 호출 시 전달

8.4.2 Call-by-value

원시값은 복사되어 전달
함수 호출 시 원시 타입 인수를 함수에 매개변수로 전달할 때 매개변수에 값을 복사하여 함수로 전달하는 방식
함수 내부 변경이 원본에 영향 없다

8.4.3 Call-by-reference

객체는 참조값이 전달
함수 호출 시 참조 타입 인수를 함수에 매개변수로 전달할 때 매개변수에 값이 복사되지 않고 객체의 참조값이 매개변수에 저장되어 함수로 전달되는 방식
함수 내부 변경이 원본 객체에 영향

8.5 반환값

return을 사용해 값을 반환
생략 시 undefined
배열 등으로 여러 값 반환 가능

8.6 함수 객체의 프로퍼티

8.6.1 arguments 프로퍼티

함수 내에서 전달된 인수를 유사 배열로 제공
가변 인자 함수에 유용

8.6.2 caller 프로퍼티

자신을 호출한 함수 참조
디버깅 등에 사용, 일반적으로 잘 사용하지 않음

8.6.3 length 프로퍼티

함수 정의 시 명시한 매개변수 갯수

8.6.4 name 프로퍼티

함수명
익명 함수는 빈 문자열 반환

8.6.5 proto 접근자 프로퍼티

객체의 프로토타입에 접근하여 객체간의 상속 구현

8.6.6 prototype 프로퍼티

함수 객체만이 가지는 프로퍼티

생성자 함수로 호출 시 인스턴스의 프로토타입 역할

8.7 함수의 다양한 형태

8.7.1 즉시 실행 함수

정의와 동시에 실행
변수/함수 충돌 방지에 유용

(function() {
  console.log('즉시 실행!');
})();

8.7.2 내부 함수

내부 함수는 부모 함수의 변수에 접근 가능하지만, 부모 함수는 내부 함수의 변수에 접근 불가
내부 함수는 외부에서 직접 호출할 수 없다

function parent(param) {
  var parentVar = param;
  function child() {
    var childVar = 'kim';
    console.log(parentVar + ' ' + childVar); // OK
  }
  child();
  console.log(childVar); // 오류 발생
}

8.7.3 재귀 함수

자기 자신을 호출하는 함수
반드시 종료 조건(탈출 조건) 이 있어야 무한 호출을 막을 수 있음
반복문 대신 사용되지만, 직관적인 경우에만 사용하는 것이 바람직

function factorial(n) {
  if (n < 2) return 1;
  return factorial(n - 1) * n;
}

8.7.4 콜백 함수

특정 이벤트나 상황에서 호출되는 함수
명시적으로 호출하지 않고, 이벤트나 비동기 작업이 완료되었을 때 호출됨
함수를 다른 함수의 인자로 전달하여 사용

9. 타입 체크

JavaScript는 동적 타입 언어이므로 변수의 타입을 사전에 지정할 수 없다. 이로 인해 의도치 않은 타입의 값이 전달되거나 반환될 수 있어, 타입 체크가 매우 중요하다.

9.1 typeof

피연산자의 데이터 타입을 문자열로 반환

typeof '';             // 'string'
typeof 1;              // 'number'
typeof NaN;            // 'number'
typeof true;           // 'boolean'
typeof [];             // 'object'
typeof {};             // 'object'
typeof function() {};  // 'function'
typeof null;           // 'object' (설계상 오류)
typeof undefined;      // 'undefined'

단점: 배열, null, Date 등 객체의 세부 타입은 판별 불가

9.2 Object.prototype.toString

모든 값의 정확한 타입을 확인하는 데 사용
Object.prototype.toString.call(value) 형태

function getType(target) {
  return Object.prototype.toString.call(target).slice(8, -1);
}

9.3 instanceof

객체가 특정 생성자(constructor)의 인스턴스인지 확인할 때 사용
프로토타입 체인을 따라 올라가며 일치 여부 판단

console.log(person instanceof Person); // true

9.4 유사 배열 객체

배열처럼 length 프로퍼티를 가지며 순회 가능한 객체
예: arguments, NodeList, HTMLCollection, 문자열
Array.isArray 형태

console.log(Array.isArray([]));    // true

10. 프로토타입 객체

자바스크립트는 클래스가 아닌 프로토타입 기반 객체지향 언어

10.1 프로토타입 객체

모든 객체는 [[Prototype]]을 통해 부모 객체와 연결되어 있고, 상속을 통해 부모의 속성과 메서드를 사용할 수 있다

10.2 [[Prototype]] vs prototype 프로퍼티

[[Prototype]]: 모든 객체가 가지는 내부 슬롯, 자신의 부모 객체를 가리킴 (__proto__로 접근 가능)

prototype: 함수 객체만 가지며, 생성자로 호출될 때 생성되는 객체의 부모 역할을 하는 객체를 가리킴.

10.3 constructor 프로퍼티

프로토타입 객체는 constructor 프로퍼티를 가짐
해당 객체를 생성한 생성자 함수를 참조

function Person(name) {
  this.name = name;
}
const foo = new Person('kim');
console.log(foo.constructor === Person); // true

10.4 Prototype chain

객체에서 프로퍼티를 찾지 못하면 [[Prototype]]을 따라 상속 체인을 따라가며 검색

10.4.1 객체 리터럴 방식으로 생성된 객체의 프로토타입 체인

객체 리터럴 → Object() 생성자 함수에 의해 생성
해당 객체의 프로토타입은 Object.prototype

객체 생성 방법
1. 객체 리터럴
2. 생성자 함수
3. Object() 생성자 함수

10.4.2 생성자 함수로 생성된 객체의 프로토타입 체인

생성자 함수로 객체 생성 시, 생성자 함수의 prototype이 해당 객체의 프로토타입이 된다
이 prototype도 Object.prototype을 상속

function Person(name) { this.name = name; }
const foo = new Person('Lee');
console.log(foo.__proto__ === Person.prototype); // true

10.5 프로토타입 객체의 확장

프로토타입 객체는 일반 객체처럼 프로퍼티 추가/삭제 가능
추가된 메서드는 해당 프로토타입을 상속하는 모든 객체에서 사용 가능

Person.prototype.sayHello = function() {
  console.log('Hello');
};

10.6 원시 타입(Primitive data type)의 확장

원시값도 임시 객체로 감싸져 프로토타입 메서드를 사용할 수 있음
String.prototype 등에 메서드를 추가하면 원시 문자열도 해당 메서드를 사용 가능

String.prototype.myMethod = function() {
  return 'extended';
};
console.log('abc'.myMethod()); // 'extended'

10.7 프로토타입 객체의 변경

생성자 함수의 prototype을 변경하면, 변경 이후 생성된 인스턴스에만 반영됨
기존 인스턴스는 이전 프로토타입을 계속 참조

function Person(name) { this.name = name; }
const foo = new Person('Lee');
Person.prototype = { gender: 'male' };
const bar = new Person('Kim');
console.log(foo.gender); // undefined
console.log(bar.gender); // 'male'

10.8 프로토타입 체인 동작 조건

참조(읽기) 시: 해당 객체에 없으면 프로토타입 체인 동작
할당(쓰기) 시: 체인이 동작하지 않고 해당 객체에 직접 속성을 추가하거나 수정

foo.gender = 'female'; // foo에 gender 프로퍼티가 새로 생성됨

11. 스코프

11.1 스코프란?

스코프(Scope) 는 식별자가 유효한 범위를 나타낸다
자바스크립트는 식별자를 찾을 때, 선언된 위치를 기준으로 스코프를 따라 식별자를 탐색한다
스코프가 없다면 모든 변수는 전역이 되어 충돌이 일어난다

11.2 스코프의 구분

전역 스코프: 어디서든 접근 가능

지역 스코프: 함수 내부에서만 접근 가능

변수는 선언 위치에 따라 전역 또는 지역 스코프를 가진다

11.3 자바스크립트 스코프의 특징

기본적으로 함수 레벨 스코프(function-level scope) 를 따른다
블록 레벨 스코프(block-level scope) 는 let과 const 사용 시에만 가능하다

11.4 전역 스코프(Global scope)

전역에서 선언된 변수는 어디서나 접근 가능
var로 선언한 전역 변수는 window 객체의 프로퍼티가 된다
자바스크립트는 실행 진입점(main 함수 등)이 없어 전역 변수 남용이 쉬움 → 지양해야 함

11.5 비 블록 레벨 스코프(Non block-level scope)

var로 선언한 변수는 블록 내부에서도 전역 또는 함수 스코프를 따른다

if (true) {
  var x = 5;
}
console.log(x); // 5

11.6 함수 레벨 스코프(Function-level scope)

함수 내부에서 선언된 변수는 해당 함수 내에서만 유효
중첩 함수는 상위 함수의 변수에도 접근 가능
변수명이 중복되면 가장 가까운 스코프의 변수가 우선된다 (스코프 체인)

11.7 렉시컬 스코프

선언 위치 기준으로 상위 스코프가 결정된다
호출 위치와 관계없이 정의된 위치의 스코프를 따른다

var x = 1;

function foo() {
  var x = 10;
  bar();
}

function bar() {
  console.log(x); // 1
}

foo();

11.8 암묵적 전역

선언하지 않은 변수에 값을 할당하면 전역 객체의 프로퍼티가 된다
변수 호이스팅이 발생하지 않으며, delete로 삭제 가능

function foo() {
  y = 20; // 암묵적 전역
}

11.9 최소한의 전역변수 사용

전역 객체 하나(MYAPP 등) 를 만들어 모든 전역 변수를 그 안에 관리

var MYAPP = {
  student: {
    name: 'Lee',
    gender: 'male'
  }
};

11.10 즉시실행함수를 이용한 전역변수 사용 억제

IIFE(Immediately-Invoked Function Expression)를 사용하여 지역 스코프를 생성하고 전역 오염 방지한다

(function() {
  var MYAPP = { student: { name: 'Lee' } };
})();