JavaScript(1)

자바 스크립트는 프로토 타입을 기반으로 객체 생성을 지원하는 동적 스크립트 언어이다.

웹 브라우저에서 주로 사용하고, Node.js를 이용해 콘솔 환경에서 사용한다.

C언어의 기본 구문을 바탕으로 했기 때문에 자바와 기본 구문이 비슷하며,

웹 브라우저 UI를 제어하기 위해 만들어진 프로그래밍 언어라고 생각하면 된다.

 

ECMA International이라는 정보 통신에 대한 표준을 제정하는 비영리 표준화 기구에서 

몇 차례에 걸쳐 자바스크립트에 대해 표준을 제시했고 

현재는 ES6라는 ECMA에서 제안하는 6번째 표준 명세를 기준으로 사용하고 있다.

 

자바 스크립트의 기본 문법으로는 

HTML 문서 내에서 사용할 때는 <script> 태그를 사용한다.

또 문서 내의 위치의 제약이 없어 어디든 사용 가능하다.

 

외부 스크립트를 참조할 때는 .js 확장자를 가진 파일을 생성한 뒤

html 문서 내에서 <script src = "외부파일 위치"></script> 코드를 작성하면 된다.

 

자바 스크립트의 변수 타입은 가리키는 값에 대한 타입을 말한다.

var, let, const 키워드를 이용해서 변수를 선언 가능하다.

자바스크립트의 변수에 대해 알아보기 전에 자바스크립트의 요소에 대해 알아보자.

우선 호이스팅(Hoisting) 특성.

여기서 호이스팅이란 끌어올린다는 뜻으로, 쉽게 말하자면 변수가 함수 내에서 정의되었을 경우

선언이 함수의 최상위로 끌어 올려지고, 함수 바깥에서 정의되었을 경우, 전역 범위의 최상위로 변경되는 것이다.

여기서 중요한 것은 변수의 정의가 선언과 할당으로 분리되는데, 선언된 변수가 끌어올려지더라도

할당은 끌어올려지기 전 위치에 존재하기 때문에 위에서 해당 변수를 호출할 경우 undefined로 나타나게 된다.

function call(){
	console.log(name);
    var name= "아이언맨";
    console.log(name);
}
call();

즉 위와 같은 경우

name의 정의는 아래에서 일어났지만 해당 정의를 선언과 할당으로 나누어 선언은 끌어올려진다.

다만 할당은 해당 위치에서 이뤄지기 때문에 선언된 name은 아직 빈 값인 undefined이고 

첫번째 console.log가 이뤄질 때는 undefined가 출력되며

이후 name이 할당되면 아이언맨이 출력되는 것이다. 

이 호이스팅은 자바스크립트의 중요한 특성 중 하나이기 때문에 알고 있는 것이 좋다.

 

다음으로는 재선언과 재할당.

변수의 재선언은 이미 선언한 변수명을 다시 선언하는 것이다. 

재할당은 마찬가지로 이미 값이 할당된 변수에 새로운 값을 할당하는 것이다.

 

다음은 유효범위(scope)이다.

스코프는 변수에 접근할 수 있는 범위를 의미한다. 

예를 들어 var 변수의 경우 선언된 위치에 따라 유효 범위가 달라진다. 

함수 내에서 선언되었으면 함수 내에서만 사용할 수 있고, 함수 외부에서 선언되었으면 

전역적으로 사용될 수 있다.

반대로 const와 let 변수의 경우 변수가 선언된 블록인 { } 내에서만 유효하다. 

당연히 블록 밖에서 선언된 경우 전역적으로 사용가능하다.

이 말이 무엇이냐면

let name = "kim";

function call(){
    let name = "jung";
    
    if(true){
        var name2="park";
        let name3="choi";
        console.log(name);
    }
    // console.log(name3);
    console.log(name2);
}
call();
console.log(name);

위에서 name3을 출력하려 하면 오류가 난다.

let 변수인 name3는 if 블록 내에서만 사용 가능하기 때문이다.

반대로 var 변수인 name2는 함수 스코프이기 때문에 if 블록 내에서 선언되어도

call 함수 내에서 사용 가능하다.

이를 실행하면 다음과 같이 출력된다.

 

 

이런 특성을 바탕으로 변수에 대해 알아보자.

 

var 변수는

재 선언이 가능하고, 재 할당 또한 가능하다.

ES6 이전에 변수를 선언할 때 사용됐으며 호이스팅 특성을 가지고 있다.

var 변수의 스코프는 함수 스코프이다.

 

let 변수는

재 선언이 불가능하지만 재 할당은 가능하다.

스코프는 블록 스코프이다.

 

const 변수는

재 선언이 불가하고 재 할당 또한 불가능하다.

스코프는 블록 스코프이고, 일반적으로 SNAKE_CASE를 사용한다.

또한 선언할 때 값을 바로 할당해야 하고, 

선언된 변수는 상수로 사용한다.

const 변수는 속성 자체를 변경하는 것은 불가능하지만 

const 객체 내 속성 값은 업데이트 할 수 있다.

위와 같이 작성했을 경우 실행하면 다음과 같이 출력된다.