자바스크립트에서 배열과 객체를 다룰 때 유용한 문법과 함수정리-1
2020. 4. 15. 17:39ㆍTypeScript&JavaScript/JavaScript
const example = {
a: 1,
b: 2,
c: 3
};
const array = [1,2,3,4,5];
array.forEach(item => {
//1,2,3,4,5
})
for (let key in example) {
// 객체의 프로퍼티를 순환
console.log(key) // a, b, c
}
for (let key of array) {
console.log(key) // 1,2,3,4,5
}
// forEach는 Array의 prototype을 상속받은 객체가 사용가능한 '함수'
// for in 은 객체의 속성을 순환하며 따라서 배열을 사용할 경우 index를 반환한다
// for of 는 객체의 속성을 순환하지 않으며 배열 혹은 이터러블한 객체에 사용이 가능하고 value를 반환한다
//key:value를 배열로 return
Object.entries(example)
//key를 배열로 return
Object.keys(example)
//value를 배열로 return
Object.values(example)
array 객체를 익숙하고 귀찮다는 이유로 늘 for문이나 while문만 이용하던 버릇을 좀 고쳐야 겠다는 생각에 대충 알고만 있던 내장함수들을 정리해본다.
반복문에서 continue는 해당 인덱스나 조건일 경우에 대해 바로 다음 순서로 넘긴다
반복문에서 break는 반복문을 즉시 끝낸다
forEach는 함수이고 편리하지만, break나 return을 통해 함수를 벗어날 수 없다.
for in 의 단점은 index에 할당되는 값이 문자열이라는 점, 배열 요소만 순회하는 것이 아니라 '속성'을 순회하기 때문에 배열에 부여된 확장속성 (array.properties 같은 형태의) 들도 순회한다. 배열의 프로토타입 체인까지도. 또한 어떤 환경에서는 for in의 순회순서는 정해져있지 않고 무작위로 나타나기도 한다. 즉, for-in은 Object의 key를 순회할 때 가장 유용하고 예측가능하다. 배열에는 그다지 적절하지 않다.
for of 는 배열의 값들(data)를 순회하기 위한 구문이다. 동시에, 문자열도 가능하고 Map, Set 객체도 가능하다. [Symbol.iterator]() 메소드를 제공하는 객체를 이터러블 객체(iterable object)라고 하는데, 이러한 객체에 for of를 사용가능하다.
'TypeScript&JavaScript > JavaScript' 카테고리의 다른 글
Truthy, Falsy, 단축 평가 논리 계산법, 함수 기본파라메터 (0) | 2020.04.20 |
---|---|
자바스크립트에서 배열과 객체를 다룰 때 유용한 문법과 함수정리-2 (0) | 2020.04.16 |
Arrow Function (0) | 2020.03.09 |
Hoisting (0) | 2020.03.06 |
Typeof (data type checking) (0) | 2020.03.05 |