본문 바로가기

Front-end/js10

ArrayFunction 2 (find, filter) find와 filter는 사용하는 방법, 메커니즘은 동일하다. 다만 return값이 다른데 find의 경우에는 조건을 만족하는 최초의 값을 찾아 반환하고 filter의 경우에는 조건에 만족하는 모든 값을 배열의 형태로 반환해준다. 두 함수 모두 함수의 대상이 되는 배열의 상태를 변화시키지 않는 함수이다. (arr.find() , arr.filter()를 해도 arr는 변화가 없음) find와 filter는 모두 인자로 콜백 함수를 넘겨주면 된다. 콜백함수의 인자는 조건 검사의 대상이 되는 배열의 값이 순서대로 넘어가고 return 값은 true false로 결정될 수 있는 조건식이 들어가면 된다. 아래의 코드 블록을 보면 이해가 쉽다. const arr1 = [1,2,3,4,5,1] // const ar.. 2021. 12. 14.
Array Function 1 (Map) map 함수는 ES5에서 처음 등장한 스펙으로 실제로 로직 구현에서 자주 등장하는 함수 중 하나이다. 우선 아주 쉬운 예를 하나 보도록 하자 let arr = [1,2,3,4,5] let arr2 = arr.map((item) => { item + '일' }); console.log(arr) // [1,2,3,4,5] console.log(arr2) // ['1일','2일','3일','4일','5일'] 위의 코드와 같이 어떠한 배열이 있는데, 그 배열에 모두 똑같은 변화(추가 혹은 삭제 혹은 모두 같은 값)를 주기 위해 사용하는 것이 Array.prototype.map()이다. 그렇다면 실제로 직접 해 볼 수 있는 예제로 몇가지를 수행해보도록 하자! (예제는 MDN사이트에서 가져왔으므로 정답은 MDN사이.. 2021. 12. 13.
유용한 Array 함수들 js에서 주로 쓰이는 함수는 대부분 배열과 관계되어 있는 함수들이다. 즉, 배열만 자유자재로 다룰 수 있다면 js를 어느정도 안다고 말할 수 있다. 그럼, 자주 사용하는 배열 관련 함수들에 대해 알아보자 배열관련 함수는 배열의 상태를 변화시키는 함수와 배열의 상태를 변화시키지 않는 함수로 크게 두 갈래로 나눌 수 있다. 배열의 상태를 변화시키는 함수 배열의 상태를 변화시키지 않는 함수 splice sort push pop shift unshift slice reverse forEach find filter reduce map concat every join 지금까지 js를 쓰면서 사용한 빈도수가 높은 것을 위에서부터 나열했다. 자세한 사용법은 MDN을 참고하면 쉽게 알아볼 수 있으니 MDN을 애용하도록 .. 2021. 12. 8.
3자리 마다 콤마찍기 function numberWithCommas(x) { return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } 2021. 12. 3.