jonbeo 님의 블로그

JavaScript Date 객체 완전 정복 – 날짜·시간 처리부터 포맷 변환까지

안녕하세요 😊웹 개발에서 날짜와 시간을 다루는 일은 정말 많습니다.게시글 작성일, 이벤트 마감일, 예약 시간 표시 등다양한 기능에서 JavaScript Date 객체는 필수적으로 사용됩니다.이번 글에서는 날짜·시간 생성, 포맷 변환, 계산, 국제화 처리까지Date 객체의 핵심 기능을 정리해보겠습니다.📍 1. Date 객체 생성하기// 현재 날짜·시간const now = new Date();console.log(now);// 특정 날짜·시간const specificDate = new Date("2025-08-11T10:30:00");console.log(specificDate);// 연, 월, 일 지정 (월은 0부터 시작 → 0=1월)const customDate = new Date(2025, 7, 1..

JavaScript 배열(Array) 고급 메서드 8가지 – 실무 예제로 배우는 활용법

안녕하세요 😊JavaScript 배열은 정말 자주 쓰이는 자료구조입니다.특히 ES6 이후 추가된 고급 배열 메서드를 잘 활용하면코드가 훨씬 간결하고 직관적으로 바뀝니다.이번 글에서는 실무에서 많이 쓰이는 배열 메서드 8가지를 예제와 함께 정리해보겠습니다.📍 1. map() – 배열 변환const nums = [1, 2, 3];const doubled = nums.map(n => n * 2);console.log(doubled); // [2, 4, 6]각 요소를 변환해 새로운 배열 반환원본 배열 변경 없음📍 2. filter() – 조건에 맞는 요소 추출const users = [ { name: "Kim", age: 28 }, { name: "Lee", age: 17 }];const adults ..

안녕하세요 😊비동기 처리(Asynchronous)는 현대 JavaScript 개발에서 빼놓을 수 없는 핵심 개념입니다.특히 API 요청, 파일 읽기, 타이머 등 시간이 걸리는 작업을 효율적으로 다루기 위해Promise와 async/await는 필수 문법입니다.이번 글에서는 초보자도 쉽게 이해할 수 있도록Promise → async/await 변환과 실무에서 깔끔하게 쓰는 패턴을 정리해보겠습니다.📍 1. Promise 기본 구조function getData() { return new Promise((resolve, reject) => { setTimeout(() => resolve("데이터 로드 완료"), 1000); });}getData() .then((res) => console.log(..

안녕하세요 😊웹 개발을 하다 보면,스크롤 이벤트나 키보드 입력 등 빠르게 반복되는 동작이 있을 때브라우저가 너무 많은 일을 처리하게 되어성능이 저하되는 경우가 많습니다.이럴 때 사용하는 두 가지 핵심 개념이 바로debounce와 throttle입니다!이번 글에서는 이 두 개념의 차이점과실제 사용 예제까지 친절하게 정리해드릴게요 💡📍 1. debounce란?사용자가 이벤트를 멈췄을 때 딱 한 번 실행되도록 하는 방식입니다.입력이 계속되는 동안은 실행되지 않고,입력이 끝나고 일정 시간이 지나야 실행됩니다. ✔ 예시 상황:검색창 자동완성창 크기 변경 시 리사이징 이벤트버튼 중복 클릭 방지function debounce(callback, delay) { let timer; return (...args)..