Filter 2

JavaScript: 대량의 데이터 요리하기! 배열 메서드 map과 filter 기초부터 알아보기 🍳

안녕하세요, 독자 여러분! 개발자의 삶입니다. 😊32일차 포스팅에서는 Fetch API를 이용해 외부 서버에서 날씨 데이터를 가져오는 방법을 배웠습니다. 서버와 성공적으로 통신하여 데이터를 받아왔을 때의 그 짜릿함, 다들 느끼셨나요?그런데 서버에서 받아오는 데이터는 보통 한두 개가 아닙니다. 쇼핑몰의 상품 목록이나 게시판의 글 목록처럼, 수십에서 수백 개의 정보가 배열(Array) 형태로 한꺼번에 쏟아집니다. 오늘은 이렇게 거대한 배열 데이터를 내 입맛에 맞게 가공하고 걸러내는 자바스크립트의 필수 도구, map과 filter에 대해 알아보겠습니다.1. 도입우리가 100개의 상품 데이터가 들어있는 배열을 서버에서 받았다고 가정해 봅시다. 여기서 상품의 이름만 따로 뽑아서 리스트를 만들거나, 가격이 5만 ..

IT/Javascript 2026.04.13

JavaScript: 투두 리스트 완성! LocalStorage와 JSON으로 데이터 영구 저장하기 💾

안녕하세요, 독자 여러분! 개발자의 삶입니다. 😊23일차에 투두 리스트의 겉모습과 기능을 만들었고, 24일차와 25일차에는 데이터를 브라우저에 저장하는 LocalStorage와 JSON 사용법을 배웠습니다. 드디어 오늘, 이 모든 지식을 하나로 합체시킬 시간입니다!새로고침을 해도 사라지지 않는, 진짜 사용 가능한 나만의 투두 리스트를 완성해 봅시다. 오늘 포스팅은 조금 길 수 있지만, 이것만 해내면 여러분은 자바스크립트 초보 딱지를 뗄 자격이 충분합니다.1. 도입지금까지 만든 투두 리스트는 화면에만 그림을 그리는 수준이었습니다. 그래서 새로고침하면 도화지가 새것으로 바뀌어버렸죠. 이제 우리는 화면에 그리는 동시에, 브라우저 내부의 금고(LocalStorage)에도 똑같은 내용을 기록해 둘 것입니다. 그..

IT/Javascript 2026.01.14