ECMAScript6 - var와 let
1. 함수 안에 작성한 let 변수는 함수가 스코프.
2. 함수안에 if(a==0){let sprots= "축구"} 형태로 코드를 작성했을 때, sports 변수는 함수가 스코프가 아니라 if문의 블록 { } 스코프.
3. 같은 스코프에서 같은 이름의 let 변수를 선언할 수 없다.
4. let 변수는 호이스팅(hoisting) 되지 않는다.
5. let과 this
6. for문에서 var 와 let
1. 의 예시
2. 의 예시
호이스팅이란 - 변수나 함수를 선언, 정의하기 앞서서 먼저 호출하는 경우 문제없이 작동되도록 하는 특성이다.
4. 의 예시 - var 로 선언된 sports 변수는 비록 undefined가 출력되었지만 변수로 인식되었다. 반면에 let 으로 선언된 music 변수는 변수로 인식되지 않았다.
5. 의 예시
var로 선언한 변수의 스코프는 글로벌 오브젝트이고 this가 글로벌 오브젝트를 참조한다.
this가 window 오브젝트를 참조한다.
6. 의 예시
for문에서 let 변수는 반복할 때마다 스코프를 갖는 반면, var 변수는 스코프를 갖지 않는다.
<!doctype html>
<html>
<head>
<meta charset="utf8" />
</head>
<body>
<ul>
<li>1~10</li>
<li>11~20</li>
<li>21~30</li>
</ul>
<script>
var nodes = document.querySelector('ul');
for (var k = 0; k < nodes.children.length; k++) {
var el = nodes.children[k];
el.onclick = function(event) {
event.target.style.backgroundColor = "yellow";
console.log(k);
}
};
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<ul>
<li>1~10</li>
<li>11~20</li>
<li>21~30</li>
</ul>
<script type="text/javascript">
var nodes = document.querySelector('ul');
for (let i = 0; i < nodes.children.length; i++) {
var el = nodes.children[i];
el.onclick = function(event) {
event.target.style.backgroundColor = "blue";
console.log(i);
}
};
</script>
</body>
</html>
댓글
댓글 쓰기