본문 바로가기

Javascript11

[JavaScript] lodash의 debounce: cancel / flush 프론트엔드 개발자로서 실무를 하다 보면 수많은 상태를 관리하고, 사용자 입력에 실시간으로 반응해야 하는 상황을 마주합니다.특히 검색어 입력, 무한 스크롤, 윈도우 리사이즈와 같은 이벤트들은 순간에도 수십, 수백 번의 함수 호출을 발생시키곤 합니다.이런 성능 저하를 해결하기 위해 보통 디바운스(Debounce)를 도입합니다.하지만 무분별한 디바운스 사용이나 제어되지 않은 설정은 오히려 의도치 않은 버그나 UX 저하를 불러오기도 합니다. "분명 디바운스를 걸었는데 왜 데이터가 꼬이지?" "API가 호출 타이밍이 왜 이상하지" 이런 상황에 마주한다면, 디바운스를 제대로 '제어'해야 할 때라고 생각합니다.오늘은 lodash의 debounce를 더욱 정교하게 만들어주는 cancel과 flush 메서드를 통해,성능.. 2026. 3. 31.
[javascript] 자바스크립트 SHA-256 해시 생성, 문자열 인코딩 최근, 프로젝트에서 이니시스 본인인증 파트를 개발하면서서버에 사용자가 본인인증을 거치며, 전자서명을 한 값을 서버로 보내야 하는 경우가 있었다.전자서명을 클라이언트 -> 서버로 보낼 때 이미지 파일을 base64로 변환 후 보내는 과정에서 서버에서 터지는 경우가 발생하여,여러 시행착오 끝에 base64를 다시 SHA-256로 암호화해서 보내는 방식으로 진행하게 되었고SHA-256 암호화 방식에 대해 알게 된 내용들을 정리하려고 한다. SHA-256이란?SHA-256(Secure Hash Algorithm 256-bit)은 암호화 해시 함수로,입력 데이터를 256비트(32바이트) 크기의 고유한 해시 값으로 변환하는 알고리즘.SHA-256 해시 함수는 어떤 길이의 값을 입력하더라도 256비트의 고정된 결과값.. 2025. 2. 27.
[Javascript] 배열 고차 함수 (Higher order function) 배열 고차 함수란? 배열 고차 함수란 배열을 다루는 함수 중 하나로, 다른 함수를 인수로 받거나 함수를 반환하는 함수로, 주요 배열 고차 함수에는 map, filter, reduce, forEach, some, every 등이 있습니다. 이러한 함수들은 반복문을 사용하지 않고도 배열을 조작 및 변환할 수 있어, 코드의 간결함과 가독성 향상에 도움이 됩니다. 1. map 배열을 순회하며 배열의 각 요소에 대해 주어진 함수를 호출한 결과로 새로운 배열을 반환. const numbers = [1, 2, 3, 4, 5]; const squaredNumbers = numbers.map((num) => num * num); // squaredNumbers = [1, 4, 9, 16, 25] // 원본 numbers.. 2024. 2. 12.
Error Handling (Exception) | 에러, 예외 처리 에러 처리는 JavaScript에서 프로그램 실행 중 발생하는 예외 상황을 처리하는 방법입니다. (코드 실행 중에 예상하지 못한 상황이 발생하거나 잘못된 입력이나 네트워크 오류... 등등) 이러한 예외 상황을 처리하지 않으면 프로그램이 비정상적으로 종료될 수 있기 때문에, 사용자가 프로그램 사용중 에러 메시지 없이 프로그램이 갑자기 종료된다면, 사용자가 당황스러움과 불편함을 느낄 수 있어, 에러 처리를 통해 사용자에게 에러 메시지를 제공해야하며 예외 처리는 프로그램의 안정성과 신뢰성, 유지보수성을 높여주는 중요한 역할입니다. JavaScript에서는 try...catch 문을 사용하여 예외 처리. try 블록 안에는 예외가 발생할 수 있는 코드를 작성, catch 블록 안에는 예외가 발생했을 때 처리할 .. 2024. 1. 2.