JavaScript Scope에 대해 조금 더 자세히 공부해보았다.
function block() {
return "block";
}
for (let i = 0; i < 10; i++) {
count++;
}
if (i === 1) {
let j = 'one';
console.log(j);
}
function block() {
let result = "block"
return result;
}
console.log(result);
//Uncaught ReferenceError: result is not defined
const color = 'red';
console.log(color);
function returnColor() {
//여기서도 color변수 사용가능!
console.log(color);
return color;
}
//여기서도 color변수 사용가능!
console.log(returnColor());
const A = 'A';
const B = 'B';
let C = 'C';
const myAlpha = () => {
C = "changeC"
return "ABC : " + A + ', ' + B + ', ' + C;
};
console.log(myAlpha()); //ABC : A, B, changeC
console.log(C); //changeC
→ C라는 global변수
→ myAlpha 함수에서 새로운 변수 C를 선언해야하는데 let을 사용하지 않음
→ myAlpha 함수를 호출하면 C의 값이 changeC로 바껴있다.
⇒ global 변수였던 C에 영향이 갔다!!
⇒ 다른 함수에서 global 변수인 C를 사용하면 더이상 C가 아닌 changeC값으로 사용하게 된다.
⇒ 변수들은 block scope로 최대한 나누는게 좋다!
function myColor() {
const haveColor = true;
let color = 'blue';
if (haveColor) {
let color = 'pink';
console.log(color); // pink
}
console.log(color); // blue
}
myColor();
console.log(color); // Uncaught ReferenceError: color is not defined
→ if문의 block안에 color 변수를 선언
→ if문 안에서는 pink값 할당, if문 밖에서는 blue값 할당
⇒ 같은 이름의 변수를 사용하였으므로 scope namespace가 오염!
scope 오염을 공부하면서 전역변수가 편한것같아서 마구잡이로 사용하는 나를 되돌아보게 되었다.
변수 선언할 때 scope를 조금 더 신경써서 선언해야겠다.