반응형

◎ foreach 문

▼ 내용

foreach 반복문은 오직 Array 객체에서만 사용가능한 메서드입니다. (ES6부터는 Map,Set 지원)

배열의 요소들을 반복하여 작업을 수행할수 있습니다.

foreach구문의 인자로 callback함수를 등록할수 있고, 배열의 각 요소들이 반복될 떄 이 callback 함수가 호출됩니다. callback 함수에서 배열요소의 인덱스와 값에 접근할수 있습니다.

배열의 첫번쨰부터 마지막까지 반복하면서 item을 꺼낼수 있다.

var arr = ['가','나','다','라']; arr.forEach(function(item,index,arr2){ console.log(item,index,arr2[index+1]); }) //첫번쨰 인수는 배열의 각각의 item //두번쨰 인수는 배열의 index //세번째 인수는 배열 그자체

​

◎ for .... in 반복문

▼ 내용

객체에 사용 할수 있습니다.

객체의 key값과 value 값을 뽑아내는데 유용합니다.

객체의 키값의 갯수만큼 반복하여 첫번쨰키값부터 마지막 키값까지 반복합니다.

var obj = { a: '가', b: '나', c: '다' }; for (var key in obj) { console.log(key, obj[key]); // a 가, b 나, c 다 }

​

​

◎ 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 반복문 : 객체의 모든 열거 가능한 속성(property)에 대한 반복

for of 반복문 : [Symbol.iterator] 속성을 가지는 컬렉션 전용

Object.prototype.objCustom = function () {};// Object 프로퍼티에 객체 생성 Array.prototype.arrCustom = function () {}; // array 프로퍼티에 객체 생성 var iterable = [3, 5, 7]; iterable.foo = "hello"; for (var key in iterable) { console.log(key); // 0, 1, 2, "foo", "arrCustom", "objCustom" } //기본 js 내장함수에 프로퍼티를 추가해서 프로퍼티까지 다뽑힌다 for (var value of iterable) { console.log(value); // 3, 5, 7 }

​


반응형

'프로그래밍 > JavaScript' 카테고리의 다른 글

D3.JS - 날짜 라인 그래프 그리기  (0) 2022.01.05
JavaScript - ECMA6 문법 (구조분해,애로우함수 등)  (0) 2019.04.30
javascript 구동방법이해하기  (0) 2019.03.03
javascript - 콜백함수 확장판 (콜백함수 이해하기)  (0) 2019.03.03
javascript - 콜백함수,함수의 선언,클로저  (0) 2019.03.03

+ Recent posts

티스토리툴바