[자바스크립트 기본] 문법과 리터럴

*MDN 문법과 자료형을 개인의 복습을 위해 간추린 글입니다*

 

선언 방법

 

1. var - 변수를 선언한다. function scope이거나 global scope로 선언 가능. 동시에 값을 초기화 하는 것도 가능.

 

2. let - 변수를 선언한다. block scope 로 선언. 동시에 값을 초기화 하는 것도 가능

 

3. const - 상수를 선언한다. block scope이고 무조건 초기화 해야됨.

 

변수 선언

1. var a = 2; //전역또는 지역변수 가능

 

2. let b = 2; //block scope 지역변수

 

3. a = 2; // 선언되지 않은 전역변수

 

*초기화 되지 않은 변수는 undefined

*선언되지 않은 변수를 console.log 하면 reference error

 

let const vs var

 

1. var은 function scope이고 let과 const는 block scope

2. let과 const는 전역 범위로 선언되어도 window의 property가 되지 않는다(그러므로 밖에서 선언되어도 전역범위 아니지만 전역범위에서 사용될수 있다)

u = "global"
var x = "global";
let y = "global";
const z = "global";

console.log(this.u);//global
console.log(this.x);//global
console.log(this.y);//undefined <-객체의 속성으로 접근했기 때문에 reference error가 안뜸
console.log(extra);//reference error
console.log(this.z);//undefined 

3. let과 const은 hoisting이 안됨 var은 hoisting이 됨

console.log(one);//undefined
var one = 2;

console.log(two);//reference error
let two=3;

더 자세히 설명하자면 실은 let과 const도 hoisting이 되지만 block에서 선언 되기전까진 temporal dead zone 이라는 형태이기 때문에 선언전에 접근하면 reference error가 뜸. 그냥 선언하기 전에는 쓰지 말라는 얘기.

4. let과 const는 re-declaration(다시 선언)이 안됨 var은 됨

 

block scope vs function scope

for(var i=0; i<3; i++){
   console.log(i);//0,1,2
}
console.log(i)//3

var i는 for loop 안에서 선언되었지만 for은 block 임으로 밖에서도 사용 가능하다.

 

function func(){
   var b = 3;
}

console.log(b);//reference error

var b가 function 안에서 선언됬기에 reference error이 뜬다.

 

if(true){
   let z = 0;
}
console.log(z);//reference error

let z 가 block 안에서 선언되었으므로 밖에서 사용 불가.

 

hoisting

 

var 변수의 선언이 함수의 제일위로 옮겨지는 현상.

주의! 초기화값은 안옮겨짐!

 

function a(){
   var myVar = 1;
   
   function b(){
   	console.log(myVar);//undefined
    var myVar = 2;//여기의 선언이 함수 b의 꼭대기로 올라가기 때문임
   }
   return b();
}

a();

//위랑 같은 코드 근데 hoisting을 직접함.
function a(){
   var myVar = 1;
   
   function b(){
    var myVar;
   	console.log(myVar);//undefined
    myVar = 2;
   }
   return b();
}

a();

 

함수 hoisting

함수 선언은 hoisting이 되지만 함수 expression은 hoisting이 안된다는것을 기억하자

ex1();//a

function ex1(){
   console.log('a');
}

ex2();//reference error

ex2 = function(){
   console.log('b');
}

 

상수 Constant

상수는 const를 사용해 선언됨. 선언과 동시에 초기화를 해야함. 당연히 redeclaration과 reinitialization은 안됨.

 

하지만! const가 객체나 배열을 변수로 담으면 객체의 속성이나 변수의 요소들은 변경가능.

 

const arr = [1,2];
arr[0]=3;
console.log(arr);//[3,2]

const obj = {key:"value"};
obj.key="other";
console.log(obj.key);//other

 

리터럴 literal

 

리터럴은 변하지 않는 데이터를 뜻 한다.

"1" "hello" "1e+12" 같은 고정된 값을 리터럴이라고 하고 그들은 바뀔수 없다.

 

반면 변수와 상수는 데이터를 담고 있는 상자를 뜻한다.

예제를 보면서 차이점을 이해를 해보자.

var a = 1; // 이 코드는 a라는 상자(메모리 위치)안에 1이라는 데이터(메모리 값)을 담고있다
//a를 우리는 변수라고 하고 1이라는 데이터를 리터럴이라고 한다.

const b=2//상수도 마찬가지로 데이터를 담고 있는 상자를 뜻하지만 상수는 자기가 담고있는 데이터의 값을 변경할 수 없다.

 

그냥 더이상 나누어질수 없는 직관적인 데이터를 생각하면 편할것이다.

 

Literal Notation은 어떠한 변수를 초기화 하는 방법을 말하는 것이다

keyword identifier = literal <= 이런 형식이다.

 

var a = 1;
var b = [a,b,c];
var c ={
   "i":"you",
   "me":"him"
};
var d = function(){return something};