[Study/JavaScript] var

SoShy·2023년 11월 30일

JavaScript_Study

목록 보기
17/36
post-thumbnail

🥕 var

  • let 이나 count 처럼 변수 선언하는 함수
var myVariable;

myVariable = 'codeit';
var myVariable = 'codeit';

그러나, 현재는 거의 사용되지 않는데, 그 이유는 다음과 같음.

  1. var 키워드로 선언한 변수는 let이나 const와는 다르게 중복 선언이 가능하기 때문
    • 중복 선언이 가능해지면, 길고 복잡한 코드를 작성할 때, 실수할 가능성이 높아지고, 상황에 따라 치명적이 오류가 발생할 수 있음.
var myVariable = 'soshy';
console.log(myVariable);
var myVariable = 'shyshy!';
console.log(myVariable);
.
.
.
>>> soshy
	shyshy!

  1. var 키워드로 선언한 변수는 scopefunction에서만 구분되어 있음.
    • 로컬 변수의 구분이 function에만 있기 때문에, if, for, while, switch 등 다양한 상황에서 선언한 변수가, 잘못하면 글로벌 변수의 역할을 하게될 수 있다는 문제점이 발생함.
{
  var x = 3;
}

function myFunction() {
  var y = 4;
}

console.log(x);
console.log(y);
.
.
.
>>> 3
	Uncaught ReferenceError: y is not defined

💡 이렇게 함수를 기준으로만 적용되는 scope를 함수 스코프라고 하며, 코드 블록을 기준으로 적용되는 scope를 블록 스코프라고 함.

1. Hoisting

letconst로 선언한 변수는 선언되기 이전에 사용될 수 없는 반면,

console.log(myVariable);
let myVariable;
.
.
.
>>> Uncaught ReferenceError: Cannot access 'myVariable' before initialization

var로 선언한 변수는 함수 스코프를 기준으로 적용되기 때문에, 선언되기 이전에도 변수 접근이 가능함.

console.log(myVariable);
var myVariable;
.
.
.
>>> undefined

이렇게, 변수가 끌어올려지는 현상을 hoisting이라고 함.

선언과 동시에 값을 할당하더라도, 선언문만 올려지기 때문에, 값은 아래와 같이 해당 줄에 그대로 남아있음.

console.log(myVariable);
var myVariable = 2;
console.log(myVariable);
.
.
.
>>> undefined
	2

hoisting은 아래와 같이 함수를 선언할 때도 적용됨.

sayHi();

function sayHi() {
  console.log('hi');
}
.
.
.
>>> hi
profile
프론트엔드 개발자가 되기 위해 노력 중인 새싹🌱 입니다.

0개의 댓글