목록Javascript (14)

프로그램 개발서

JavaScript Error.isError()로 다른 실행 환경의 오류 객체 판별하기

문제와 사용 상황typeof error === "error"는 동작하지 않고 instanceof Error는 iframe, worker, Node.js vm처럼 다른 realm에서 만들어진 오류에 false가 될 수 있습니다. Error.isError()는 실제 Error 계열을 Boolean으로 판별하는 정적 메서드입니다.테스트 환경·버전·날짜2026-08-07 KST에 Node.js v24.14.0에서 node:vm cross-realm 오류와 일반 객체·null·문자열을 검사했습니다. Node.js v23.11.1에서는 API 미지원 상태를 확인해 기능 감지 경로만 기록했습니다.최소 재현 코드const nativeError = new Error("database timeout");console.lo..
Javascript 2026. 8. 7. 20:11
JavaScript Array.fromAsync()로 비동기 반복값을 순서대로 배열로 만들기

문제와 사용 상황async generator나 Node.js 스트림처럼 비동기적으로 값을 내보내는 입력을 배열로 모을 때 for await...of와 Promise.all()을 상황별로 나누어 사용하게 됩니다. Array.fromAsync()는 async iterable, 일반 iterable, array-like 입력을 배열로 만들고 mapper 결과도 await합니다.반환값은 배열 자체가 아니라 배열로 이행되는 Promise입니다. 따라서 await가 필요합니다. 모든 작업을 동시에 시작할 목적이면 순차적으로 값을 기다리는 Array.fromAsync() 대신 Promise.all()을 선택해야 합니다.테스트 환경·버전·날짜2026-08-06 KST에 외부 패키지 없이 Node.js v24.14.0에..
Javascript 2026. 8. 7. 06:57
JavaScript RegExp.escape()로 동적 정규식 안전하게 만들기: 점·하이픈·역참조 처리

문제와 사용 상황검색창에 입력한 문자열을 정규식으로 찾아 강조하거나, 사용자가 고른 파일명을 필터링할 때 new RegExp(input)처럼 동적 정규식을 만들기 쉽습니다. 문제는 입력값이 평범한 문자열이 아니라 정규식 문법으로 해석된다는 점입니다.예를 들어 사용자가 a.b를 입력했다고 가정해 보겠습니다. 점(.)은 정규식에서 “줄바꿈을 제외한 임의의 한 문자”라는 뜻입니다. 따라서 아래 코드는 a.b뿐 아니라 aXb도 일치시킵니다.const input = "a.b";const pattern = new RegExp(`^${input}$`);console.log(pattern.test("a.b")); // trueconsole.log(pattern.test("aXb")); // true: 의도하지 않은 일..
Javascript 2026. 8. 1. 04:44
JavaScript URLSearchParams 중복 키 처리: getAll(), append(), set() 차이

문제와 사용 상황검색 필터, 체크박스, 다중 선택 입력을 URL에 남기면 같은 이름의 쿼리 매개변수가 여러 번 나타날 수 있다.?tag=javascript&tag=web이 값을 URLSearchParams.get("tag")로 읽으면 첫 번째 값인 "javascript"만 나온다. 오류가 발생하지 않기 때문에 두 번째 값이 조용히 사라진 것처럼 보일 수 있다. 반대로 getAll("tag")는 ["javascript", "web"]처럼 같은 이름의 값을 배열로 모두 반환한다.핵심은 매개변수의 의미를 먼저 정하는 것이다. 페이지 번호처럼 하나만 허용하는 값은 get()으로 읽고, 태그·카테고리처럼 여러 값을 허용하는 항목은 getAll()로 읽는다. URL을 수정할 때도 값을 추가하려면 append(), ..
Javascript 2026. 7. 28. 23:23
JavaScript JSON.parse에서 큰 정수 정밀도 손실 막기: context.source와 BigInt

문제와 사용 상황주문번호, 결제번호, 데이터베이스의 64비트 정수처럼 자릿수가 긴 값을 JSON으로 전달할 때 화면에 나온 숫자가 원본과 달라지는 경우가 있습니다. JSON 문법은 긴 숫자를 허용하지만, JavaScript의 일반 숫자형인 Number가 모든 정수를 정확하게 표현하는 것은 아니기 때문입니다.JavaScript에서 정확하게 다룰 수 있는 최대 안전 정수는 Number.MAX_SAFE_INTEGER, 즉 9007199254740991입니다. 이 범위를 넘는 숫자를 일반 JSON.parse()로 읽으면 파싱 자체는 성공해도 값이 반올림될 수 있습니다. 오류가 발생하지 않기 때문에 로그 ID나 주문번호가 조용히 바뀌는 문제가 더 위험합니다.이번 글에서는 실제로 정밀도 손실을 재현하고, JSON...
Javascript 2026. 7. 27. 23:34
그누보드5 이윰빌더 시즌4 CHEditor5에 에드온 이모티콘 삽입

Gnuboard5의 에디터로 들어가있는 cheditor5 에 대한 기록입니다.  이윰빌더 시즌4 에서 게시판 에드온 기능으로 이모티콘이 있습니다.  이윰빌더를 쓰려고할 때 이모티콘이 에디터에 추가되지 않는 것을 확인할 수 있을 것이다.그 이유는 에디터 내에 추가하는 함수에서 cheditor에 대한 처리가 없기 때문인데, 그러므로 수정을 해줘야만 이윰빌더 이모티콘을 에디터에 삽입할 수 있다. 기존 내용 추가 함수function set_textarea_contents(type,value) { var type_text = ''; var content = ''; switch(type) { case 'emoticon': type_text = '이모티콘'; break; ca..
Javascript 2024. 6. 24. 00:45
Javascript 함수 모음

1. onlyNumber(className) /** * 클래스 명 입력하여 지정가능 */ function onlyNumber(className = 'onlyNumber'){ className = '.' + classname; const onlyNumberEl = document.querySelectorAll(className); onlyNumberEl.forEach(function(el, idx){ el.addEventListener('keydown', function(keyboardEvent){ // 상단 숫자 0 ~ 9 if(keyboardEvent.which >= 48 && keyboardEvent.which = 96 && keyboardEvent.which
Javascript 2023. 8. 29. 14:46
카드번호 마스킹 처리 html, js 예제

2023.08.24 : 카드번호 위치 및 마스킹 표시 문자, 하이픈 표시여부, 하이픈 사용시 하이픈 위치 지정 설정 추가 2023.08.29 : 설정에 따라 다른 처리되는 것을 확인하기 위한 코드로 변경 카드번호 마스킹 처리 예제 코드 - html 카드번호 마스킹 번호 길이[최소, 최대] 마스킹 시작자리 마스킹 처리길이 실제 처리할 데이터 구분 마스크 처리 후 마스크 처리 전 하이픈(-) 사용여부 사용 사용안함 사용자가 입력하고 마스킹 처리되는 입력란 사용자가 입력한 번호 그대로 가지고 있는 입력란 실제로 백단으로 보낼 입력란 - javascript function onlyNumber(className = 'onlyNumber'){ className = "." + className; let onlyNum..
Javascript 2023. 7. 11. 17:52
이전 Prev 1 2 Next 다음