본문 바로가기

JS&JQuery4

Javascript로 엑셀 다운로드하기 (ExcelJS + FileSaver.js) 웹에서 엑셀 파일을 직접 만들어 다운로드하려면 ExcelJS와 FileSaver.js 라이브러리를 활용할 수 있습니다.별도의 서버 작업 없이 클라이언트에서 엑셀 파일을 생성하고, 즉시 다운로드까지 가능합니다. 1. 라이브러리 추가먼저 두 개의 라이브러리를 불러옵니다. 2. 버튼 만들기다운로드를 실행할 버튼을 HTML에 추가합니다.엑셀다운로드 3. 기본 다운로드 코드버튼 클릭 시 엑셀 파일을 생성하고 다운로드합니다.document.getElementById("dwnExcel").addEventListener("click", function () { // 오늘 날짜 (yyyymmdd) var now = new Date(); var todayStr = now.getFullYear() .. 2025. 9. 9.
JQuery Ajax 중첩 호출, async/await로 개선 메인 데이터를 먼저 저장한 뒤, 그 결과로 받은 일련번호를 이용해 하위 데이터를 이어서 저장해야 하는 작업이 있었습니다.초반에 짠 코드를 보니 $.ajax 안에 또 다른 $.ajax 를 쓰는 식으로 구현해둬서가독성도 떨어지고, 유지보수에도 좋지 않아서 async/await 방식으로 리팩토링했습니다. 📌 기존 코드 (중첩 ajax)$.ajax({ type: "POST", url: "/saveMain", data: formData, success: function(res) { $.ajax({ type: "POST", url: "/saveSub", data: { serialNo: res.serialNo, saveData: JSON.stringify(saveData) }, success: f.. 2025. 7. 11.
JavaScript find(), filter() 사용법 ◆ filter() vs find() 차이점 정리구분filter()find()용도조건을 만족하는 모든 요소 추출조건을 만족하는 첫 번째 요소 반환반환값배열값 (객체 또는 undefined)속도전체 순회 (끝까지 확인)조건을 만족하면 바로 반환 (빠름)대표 예시리스트 필터링, 검색 결과 추출특정 항목 찾기 (단일 항목) ▶ 여러 개를 찾고 싶을 때 → filter()▶ 하나만 필요할 때 → find() ◆ 예제 코드const users = [ { id: 1, name: "철수" }, { id: 2, name: "영희" }, { id: 3, name: "철수" }]; ☞ filter() 사용 – "철수"인 사람 모두 찾기const result = users.filter(user => user.n.. 2025. 6. 9.
JavaScript map과 Set을 이용한 중복 제거 정리 특정 기준으로 중복 데이터를 제거하거나, 원하는 형태로 변환해야 할 일이 있는데사용할 때마다 map, Set, find의 사용법이 헷갈려서 이번 기회에 직접 정리하면서 예제를 남겨두려고 합니다. ✔️ map() : 원하는 필드만 추출✔️ Set() : 중복 제거✔️ find() : 해당 필드 기준으로 첫 번째 객체 다시 찾기 Array.map()은 배열의 각 요소를 원하는 방식으로 가공해서 새로운 배열을 만들어주는 메서드입니다.원본 배열은 바뀌지 않고, 변형된 새 배열이 만들어집니다. ▶ 예시 ( user 객체 배열에서 name 값만 추출하기 )const users = [ { name: 'Alice', age: 25 }, { name: 'Bob', age: 30 }];const names .. 2025. 6. 5.