[복습] Scope

10월 2일 세션은 Scope에 대해 진행되었다.

쏘크라티브 앱으로 문제를 푸는데 자꾸 틀리고 난리; 

듣는 동안에는 이해가 됐어도, 막상 적용할 때 안되는거 보니 복습을 꼭 해야될거 같았다.

그리고 var와 let의 차이도 지금까지 var가 let으로 쓰인다고 알고 있었는데 전혀 다르게 알고있었어서 충격이였다..😖

 

---

Scope란?

 - 변수 접근 규칙에 따른 유효 범위

 - 변수와 그 값이 어디서부터 어디까지 유효한지 판단하는 범위

 - Javascript에서는 기본적으로 함수가 선언(lexical)되는 동시에 자신만에 스코프를 가진다.

 

Scope Rules

 

1. Local Scope / Global Scope

 

- 안쪽 스코프에서 바깥 변수 및 함수를 접근하는 것은 불가능 (반대 상황도 마찬가지!)

//////////// Global Scope /////////////

let greeting = 'Hello';

//////// Local Scope //////////

function greetSomeone() {
	let firstName = 'Josh';
    return greeting + ' ' + firstName;
}

//////////////////////////////

greetSomeone(); // 'Hello Josh'

firstName;  // ReferenceError

///////////////////////////////////////

 - 스코프는 중첩이 가능하다 => 함수 안에 함수넣기

 - Global Scope는 최상단의 Scope로 전역 변수는 어디서든 접근이 가능하다.

 - 함수 내에서는 지역변수가 전역변수 보다 더 높은 우선순위 갖는다.

 

2. Function Scope / Block Scope

 - Block? {}, 중괄호로 시작하고 끝나는 단위

 - Block 범위를 벗어나는 즉시 그 안에 쓰인 변수를 사용할 수 없다.

var / let

1. Javascript는 기본적으로, 함수 단위로 자신만의 Scope를 가진다 => var 키워드
2. Block 단위로 Scope를 구분했을때 예측하기 쉬운 코드를 작성할 수 있다. => let 키워드

즉, var는 Function Scope를 따르고, let은 Block Scope를 따르기 때문에 같은 코드여도 var와 let 쓰임의 차이로 다르게 동작할 수 있다.

	let	const	var
유효범위	Block Scope	Block Scope	Function Scope
값 재정의	O	X	O
재선언	X	X	O

실제 코딩 시 재선언을 할 필요는 거의 없음 -> let 키워드가 이러한 실수들을 막아준다.

 

3. 전역 변수와 window 객체

 - window => 전역 범위를 대표하는 객체

 - Global Scope에서 선언된 함수, var 사용하여 선언된 변수는 window 객체와 연결된다.

 - ⚠️전역 범위에 너무 많은 변수를 선언하지 않도록 주의해야한다.

var myName = 'Soo';

console.log(window.myName);  // 'Soo'
console.log(myName);  // 'Soo'

 

4. 선언 없이 초기화된 전역 변수

 - 절대로 선언 키워드(var, let, const) 없이 변수를 초기화하면 안된다!!

 - Javascript에서는 이러한 것들에 대해 오류라고 알려주지 않는다.

 - Strict Mode를 적용하여 문법적으로 실수할 수 있는 부분들을 에러로 판단하게끔 만들어주기

'use strict';  // Strict Mode 적용하기

function showAge() {
	age = 90;
    console.log(age);
}

showAge(); // 90
console.log(age); // 90