
▶반복문 for, map, forEach, filter 사용법과 차이점 코딩테스트 문제를 풀다보면 배열에 반복문을 적용하는 경우가 굉장히 많습니다. 매번 어떤 함수를 적용할까..하는 걱정을 하곤 하는데요.. 오늘은 여러가지 배열을 반복하는 함수에 대해 정리해 보려고 합니다. 🔎 for( ) for()은 초깃값부터 시작해서 증가 또는 감소하면서 조건에 부합하면 계속 순회를 합니다. 참고로 중간에 break 문을 만나면 반복문을 더 이상 진행하지 않고 즉시 탈출합니다. 예시 array = [ 1, 2, 3, 4, 5 ] 라는 배열이 있다고 할 때 배열의 아이템을 순서대로 출력해봅시다. let array = [1, 2, 3, 4, 5]; for(let i=0; i item * 2); console.log(ar..

▶자바스크립트 정렬 함수 - sort 오늘은 자바스크립트 정렬 함수인 sort에 대해 알아보려고 합니다. 파이썬을 먼저 배운 입장에서는 그냥 sort하면 sort 되는 줄....... 🔎 sort ? 자바스크립트 배열의 내장 함수에 sort()가 있는데요. 명칭 그대로 배열 안의 원소를 정렬하는 함수입니다. 📌 문법 arrayObj.sort(sortFunction) arrayobj 자리에는 Array 객체 sortFunction 자리에는 요소 순서를 결정하는 데 사용되는 함수의 이름입니다. sortFunction 자리를 생략하면 오름차순, ASCII 문자 순서로 정렬됩니다. 📌 문자 정렬 문자 정렬의 경우에는 ASCII 문자 순서로 정렬하면 됩니다. let alphabets = ['b', 'd', 'a'..

▶배열 인덱싱 - splice와 slice 이번 글에서는 배열의 일부를 추출하고 싶을 때 사용하는 메서드 splice와 slice에 대해 알아보고 차이점에 대해서도 살펴보려고 합니다. 🔎 splice( 시작인덱스, 몇 개 지울거?, 혹시 넣을 거?) splice는 시작 인덱스로부터 몇 개를 지울 건지를 인자를 통해 넘겨줍니다. let my_list = ['a', 'b', 'c', 'd', 'e', 'f', 'g']; my_list.splice(1); // 시작 인덱스만 지정하고, 몇 개를 지울지는 안 넣었을 때 // ['b', 'c', 'd', 'e', 'f', 'g'] 인덱스 1부터 끝까지를 리턴함 console.log(my_list); // ['a'] 인덱스 1부터 모든 데이터를 다 지움 my_lis..

▶자바스크립트 Reduce 메서드 이해하기 오늘은 코딩테스트 문제를 해결하다가 알게된 Reduce 메서드에 대해 알아보도록 하겠습니다 :) 🔎 Reduce 메서드란? 사전에서는 reduce는 줄이다. 라는 의미로 해석되죠? reduce 메서드는 map, forEach와 비슷하게 배열의 요소들을 순회하면서 반복적인 연산을 하는 메서드이지만 map과 forEach와는 조금 다른 부분들이 있는데요. 📌 문법 reduce 메서드는 아래와 같이 두 개의 파라미터를 가지고 있는데요. // reduce const numbers = [1, 2, 3, 4]; numbers.reduce((누산값, 현재요소값, 현재요소의index, 현재배열) => { return 다음누산값; }, 초기누산값); 파리미터1️⃣ 콜백 함수 첫..

▶자바스크립트 async와 await 자바스크립트 지난 글들에서 비동기 처리에 대해 다뤄보았었습니다. 이번에도 비동기 처리와 관련된 async와 await에 대해 알아보겠습니다. 🔎 async & await ? async와 await는 자바스크립트의 비동기 처리 패턴 중 가장 최근에 나온 문법입니다. 기존의 비동기 처리 방식인 콜백 함수와 프로미스의 단점을 보완하고 개발자가 읽기 좋은 코드를 작성할 수 있게 도와주었습니다. 개발자에게 읽기 좋은 코드? 처음 프로그래밍을 배웠을 때 아래와 같이 변수와 조건문을 사용했던 기억이 있으실 겁니다! var user = { id: 1, name: 'Josh' }; if (user.id === 1) { console.log(user.name); // Josh } 이 ..
- Total
- Today
- Yesterday
- react-query
- JSP
- 인프런
- 리액트 훅
- 프론트엔드 기초
- 파이썬
- styled-components
- 자바
- 프론트엔드
- 프로젝트 회고
- Python
- testing
- 리액트
- rtl
- 스타일 컴포넌트 styled-components
- jest
- 데이터분석
- 자바스크립트
- 프론트엔드 공부
- next.js
- 머신러닝
- CSS
- 타입스크립트
- TypeScript
- react
- 자바스크립트 기초
- HTML
- 디프만
- frontend
- 딥러닝
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |