Map 5

22.05.09 map 의 결과가 undefined 일 경우 skip

map 을 돌릴 때 undefined 인 결과는 skip 하고 싶다고 할 때, 다음과 같은 배열이 있다. const array = [1, 2, 3, 4, 5] 나는 홀수만 남기고 싶어서 map을 사용하여 array.map(item => { if((item%2)){ return item } }) undefined 제거하고 싶으면 그냥 뒤에 filter 붙이면 된다. array.map(item => { if((item%2)){ return item } }).filter(element => element) 사실 위와 같이 간단한 경우는 굳이 map 을 사용하지 않고 filter 하나만 사용하면 정제가 가능하다. array.filter(item => item%2) 하지만 객체 속성의 값에 대한 비교와 정제를 할..

JavaScript 2022.05.10

22.05.09 배열 평탄화 flatMap

map을 무작정 돌리면 안좋은 점이 배열 안에 불필요하게 감싸는 배열이 생길 수 있다는 점이다. 복잡한 객체를 원하는 간단한 배열로 바꿀 때 여러 메소드들이 필요하다. 그 중 flatMap 이라는 메소드는 현재 실험 단계의 js 메소드이다. 작동 방식은 reduce 와 concat 을 함께 쓴 것과 똑같이 작동한다. let arr1 = ["it's Sunny in", "", "California"] 다음과 같은 배열에서 띄어쓰기를 기준으로 단어를 나누고 싶을 때, arr1.map(x=>x.split(" ")) 그냥 map 을 돌리면 각각 요소에 대한 배열을 큰 배열이 감싸져 있는 형태로 반환된다. arr2.flatMap(x => x.split(" ")) flatMap 을 돌리면 필요없는 큰 배열과 각각의..

JavaScript 2022.05.09

21.12.12 'Element[]' 형식에 'ReactElement<any, any>' 형식의 type, props, key 속성이 없습니다.

원래는 AppContainer 하위에 map으로 돌린 컴포넌트밖에 없었는데 AppContainer 안에 map 돌린 컴포넌트 바로 위에 컴포넌트를 하나 더 추가했더니 다음과 같은 오류가 발생하였다. https://stackoverflow.com/questions/58311442/type-element-is-missing-the-following-properties-from-type-element-type Type 'Element[]' is missing the following properties from type 'Element': type, props, key I have the standard arrow map ES7 function with Typescript and React environmen..

typescript 2021.12.12

21.04.05 map, reduce, concat, parseInt

📌Array.prototype.map() : 배열 내의 모든 요소 각각에 대해서 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다. const array1 = [1, 4, 9, 16]; //pass a function a map const map1 = array1.map(x=>x*2); //map 함수 안에 배열 원소에 2를 곱하고 출력하는 함수를 실행하고 이를 새로운 배열의 형태로 만든다. console.log(map1); //하면 expected output : [2, 8, 18, 32]; 아래 코드는 다음과 같이 분석할 수 있다. {list.map((value, index) => { {value}; })} 배열 list의 원소에 대한 value와 index를 인자로 받아서 li 태그를 형성하..

JavaScript 2021.04.09