for문 종류가 너무 많다.
책을 읽다가 정리해야 겠다고 생각해서 작성
foreach 반복문
foreach
반복문은 오직 Array 객체에서만 사용가능한 메서드입니다.(ES6부터는 Map, Set 등에서도 지원됩니다) 배열의 요소들을 반복하여 작업을 수행할 수 있습니다. foreach
구문의 인자로 callback 함수를 등록할 수 있고, 배열의 각 요소들이 반복될 때 이 callback 함수가 호출됩니다. callback 함수에서 배열 요소의 인덱스와 값에 접근할 수 있습니다.
var items = ['item1', 'item2', 'item3'];
items.forEach(function(item) {
console.log(item);
});
// 출력 결과: item, item2, item3
foreach는 함수를 받아서 닥치는대로 반복.
음....? 맵이랑 같은거 아닌가?
응 다르다고 한다.
for …in 반복문
for in
반복문은 객체의 속성들을 반복하여 작업을 수행할 수 있습니다. 모든 객체에서 사용이 가능합니다. for in
구문은 객체의 key 값에 접근할 수 있지만, value 값에 접근하는 방법은 제공하지 않습니다. 자바스크립트에서 객체 속성들은 내부적으로 사용하는 숨겨진 속성들을 가지고 있습니다. 그 중 하나가 [[Enumerable]]
이며, for in
구문은 이 값이 true
로 셋팅되어 속성들만 반복할 수 있습니다. 이러한 속성들을 열거형 속성이라고 부르며, 객체의 모든 내장 메서드를 비롯해 각종 내장 프로퍼티 같은 비열거형 속성은 반복되지 않습니다.
var obj = {
a: 1,
b: 2,
c: 3
};
for (var prop in obj) {
console.log(prop, obj[prop]); // a 1, b 2, c 3
}
오호 for in 문은 객체를 나열할 때 사용 된단다.
특히 이런 키 값과 밸류값을 열거할 때 쓰이나 보다.
다만
for in
구문은 객체의 key 값에 접근할 수 있지만, value 값에 접근하는 방법은 제공하지 않습니다.
이 말은 무슨 뜻일까.
아마 값을 수정하는 것이 불가능 하다는 뜻이 아닌가 싶다.
for …of 반복문
for of
반복문은 ES6에 추가된 새로운 컬렉션 전용 반복 구문입니다. for of
구문을 사용하기 위해선 컬렉션 객체가 [Symbol.iterator]
속성을 가지고 있어야만 합니다(직접 명시 가능).
var iterable = [10, 20, 30];
for (var value of iterable) {
console.log(value); // 10, 20, 30
}
... 이터레이터랑 관련 된건가 보다.
하... 이터레이터 포스팅 할 때 다시 보자.
for in 반복문과 for of 반복문의 차이점
- for in 반복문 : 객체의 모든 열거 가능한 속성에 대해 반복
- for of 반복문 :
[Symbol.iterator]
속성을 가지는 컬렉션 전용
Object.prototype.objCustom = function () {};
Array.prototype.arrCustom = function () {};
var iterable = [3, 5, 7];
iterable.foo = "hello";
for (var key in iterable) {
console.log(key); // 0, 1, 2, "foo", "arrCustom", "objCustom"
}
for (var value of iterable) {
console.log(value); // 3, 5, 7
}
이 부분.. 엄청 어렵다.
JavaScript에서 거의 모든 객체는 Object
의 인스턴스입니다. 일반적인 객체는 Object.prototype
에서 속성과 메서드를 상속받으며, 그 중 일부는 (오버라이드 등으로 인해) 숨겨질 수 있습니다
라고 하는데
iterable의 모든 객체의 속성이 출력 될 때,
Object.prototype.objCustom = function () {}; Array.prototype.arrCustom = function () {};
객체와 배열 타입의 키 값도 모두 출력된다.
iterable에 추가하는 것이 전혀 없었는데도...
나중에 다시보자...
'Language > JavaScript(ES6)' 카테고리의 다른 글
[ES6]Map과Set (0) | 2019.01.03 |
---|---|
[ES6]객체와 객체지향프로그래밍 (0) | 2019.01.03 |
[ES6]Array Method (0) | 2019.01.01 |
[Javascript]Map(iterator) (0) | 2018.12.30 |
[Javascript] Modern Javascript Tooling (0) | 2018.12.29 |