ECMA Script 6 - let,const

박성원·2020년 11월 18일
0

ECMA6

목록 보기
1/10
post-thumbnail

ECMAScript?

클라이언트측 스크립팅을 하기 위해 사용된다.

Strict (엄격 모드)

일반적인 javascript모드

<script type="text/javascript">
	mesg="hello";
	console.log(mesg);
</script>

strict 엄격모드

엄격모드에서는 "use strict" 키워드를 사용하며,
대표적으로 변수 선언시 반드시 var 사용해야 된다
또한 , 전체 코드가 아닌 함수내 에서만 strict 모드로 설정할 수 있다. 함수 외부의 코드는
비 strict 모드로 실행된다.

<script type="text/javascript">
	"use strict"
	var mesg="hello";
	console.log(mesg);
</script>

let, const 및 블록 스코프

var

함수 스코프 단위인 var은 호이스팅이 가능하며 같은 이름의 변수명을 설정하면 같은 변수를 의미한다.

<script type="text/javascript">
	//var의 특징
	"use strict"
	console.log(n);//호이스팅
	var n = 100;
	var n = 200;	// n = 200
	console.log(n);	// 200
	if(true){
		var m =30 ; 
	}
	console.log(m);	//30 
</script>

let

함수 스코프가 아닌, 블록 스코프를 따른다. 따라서 블록 밖에 동일한 이름의 변수가 있어도 scope가 다르기 때문에 변수에 각각 다른 값을 설정할 수 있다.
또한 let변수는 호이스팅이 되지 않는다.

* 블록 스코프 단위인 let

<script type="text/javascript">
	if(true){
		let mesg = "hello";
	}
	console.log(mesg);	// error!! 블록스코프 단위이므로 mesg는 값이 없다.
</script>

* 전역변수에 추가 되지 않고 this키로 접근할 수 없는 let

<script type="text/javascript">
	var mesg = "bb";	//전역변수에 추가
	console.log(this.mesg, window.mesg);	//bb bb
	let mesg2="aa";
	console.log(this.mesg2, window.mesg2);	//undefined undefined
	if(true){
		console.log(mesg2)		//aa
		console.log(this.mesg2);	//undefined
	}
</script>

* 호이스팅 되지 않는 let

<script type="text/javascript">
	console.log(n);
 	let n = 10;
</script>

const

상수 작성시 사용
const변수는 선언만 할 수 없으며 반드시 초기화가 필요하다.
const변수는 값을 변경할 수 없는 것만 제외하고 let변수를 사용한다.

* 값 변경할 수 없는 const

<script type="text/javascript">
	const mesg="hello";
	try{
		mesg = "world";			// catch로이동
	} catch(e){
		console.log("상수값 변경 불가 ");	// 실행
	}
</script>

* 블록 스코프 단위인 const

<script type="text/javascript">
	try {
		const test = "test"
	} catch (e) {
		console.log(test);		// 블록단위 스코프 error
	}
</script>
profile
개발 일기장

0개의 댓글