[ JavaScript ] ES6 : 템플릿 문자열 표현식 | 백틱
·
Archive/Develop
ES6 에서는 템플릿 문자열 기능이 도입되었다. 1. 템플릿 문자열 표현식 기존의 싱글쿼테이션 ('철보빡') 과 더블퀘테이션("철보빡") 이 아닌, 백틱 문자를 사용해 문자열을 여닫는 것을 템플릿 문자열 표현식이라고 한다. 여기서 백틱 문자는 ESC 키 밑에 있는 따옴표를 의미한다. ES5에서는 개행문자, 병합등을 이용해 변수나 상수 안에 문자열을 넣었다. var test = 'test:'+'tt'+'\ntest2:'+'tt2'; console.log(test); ES6 에서는 이를 ${} 로 표현할 수 있다. let test='tt'; let test2='tt2'; console.log(` test : ${test} test2 : ${test2} `); 결론짓자면, 백틱 (`) 내에 멀티라인 스트링을 ..
[ JavaScript ] ES6 : TDZ (Temporal Dead Zone) | let 참조에러
·
Archive/Develop
1. let 참조 에러 아래는 이전 포스팅에서 사용했던 코드이다. let test = '1'; if(true){ let test = '2'; console.log(test); }; console.log(test); 이 코드를 실행하면 아래와 같은 결과를 얻는다. 아래와 같이 코드를 변경했다. let test = '1'; if(true){ console.log(test); let test = '2'; }; console.log(test); 아래와 같은 결과가 출력된다. 만약 호이스팅이 없었다면 3번째 test 를 출력하는 과정에서 전역스코프의 값인 1 이 출력되었을 것이다. 그렇지만, 블록스코프 안에 선언된 test(,4번라인 test)가 호이스팅 되어 해당 블록 스코프의 최상단에 test 변수가 선언되게..
[ JavaScript ] ES6 : Block scope | var, let 변수 유효범위
·
Archive/Develop
1. Scope : 변수의 유효범위. var 의 변수 유효범위 => 블록 스코프가 아닌 function 스코프이다. var num = 1; function printNum(){ console.log(num); var num = 2; console.log(num); }; printNum(); //2 function 레벨에서 호이스팅이 발생하고 있는 것을 확인할 수 있다. 호이스팅 : var, let, const 등 모든 선언문이 올려져 해당 변수가 속한 스코프의 최상단으로 올리는 현상. 함수가 아닌 블록일 경우의 예를 보겠다. var test = '1'; if(true){ var test = '2'; console.log(test); }; console.log(test); 2 가 두 번 출력되는 것을 알 ..
[ JavaScript ] ES6 : let 과 const 개념 | let & const 공통점/차이점
·
Archive/Develop
ES6 표준에서 처음으로 추가된 특성 중 let 과 const 에 대해 알아보도록 하겠다. ES6 전에는 var 키워드로 변수와 상수를 선언해 사용했지만, ES6 에서는 let 과 const 를 이용해 변수와 상수를 선언할 수 있게 되었다. 변수는 let 선언자, 상수는 const 선언자를 이용하면 된다. var 선언자를 이용해 선언을 하면, 아래 예시와 같이 재선언을 해도 문제가 발생하지 않았다. 1. let var 를 이용해 변수 재선언을 해보겠다. var test = 1; console.log(test); var test = 2; console.log(test); 이번에는 let 선언자를 이용해 선언해보겠다. let test = 1; console.log(test); let test = 2; con..