함수형 함수형 하는데 너무 어렵더라고요 분명 중요하고 아는 내용인데 개발을 하면서 많이 놓지고 있는 부분이었서요  하지만 최근에 저는 함수형 프로그래밍에 대한 이해를 높이고,(배우고~)JavaScript에서 그것을 활용하여 코드를 개선하는 데 주력했습니다. 오늘은 제가 느낀 점과 함께, 함수형 프로그래밍이 어떻게 복잡한 코드를 더 간결하게 만들어주는지에 대해 이야기하고 싶습니다. 아직 100% 이해를 하고 적립한 것이 아닌 아~~ 정도 60% 이해를 한 상황이라 설명이 많이 미숙합니다 단도직입적으로 기존 코드의 문제점제가 처음 접했던 코드는 다음과 같은 형태로, 길고 복잡해서 유지보수하기 어려운 부분이 많았습니다:for (let i = start; i { if (!element) return; ..

배열을 복사할 때, 특히 이중 배열(Not Nested Array)에서 원본 데이터와의 관계를 이해하는 것이 중요합니다. 배열을 단순히 복사하면, 원본 데이터와 복사된 배열이 동일한 포인터를 공유하여 한쪽의 데이터를 변경하면 다른 쪽에도 영향이 미칩니다. 1차원 배열 복사아래의 예시처럼 1차원 배열을 복사할 때는 다음과 같은 방법이 일반적입니다.const keywordArray = ["가습기", "사무실용", "콜드브루앰플"];// 간단한 복사let copyKeywordArray = [...keywordArray];이러한 방식으로 복사하면, 원본 배열 keywordArray와 copyKeywordArray는 서로 독립적인 배열이 됩니다. 이중 배열 복사 문제점하지만 이중 배열의 경우, 배열의 내부 요소가..

웹에서 CSV 파일을 생성하여 다운로드할 때 한글이 깨지는 문제는 흔히 발생하는 현상입니다.  "?앺솢怨듭옉???ㅻ궡嫄댁“ ?명긽?몄젣 ?≪껜?몄젣 ?쇰컲 ?쒕읆 寃몄슜 3L 2媛??명긽?몄젣"  사용자는 다운로드 받은 파일의 내용이 깨져 보인다며 버그나 오류라고 지적하지만, 메모장에서 열어보면 정상적으로 표시되는 경우가 많습니다. 이는 CSV 파일의 인코딩 설정과 관련된 문제이며, 간단한 코드 수정으로 해결할 수 있습니다. 본 글에서는 이 문제의 원인과 해결 방법을 자세히 설명합니다. 문제 발생 상황:웹 애플리케이션에서 JavaScript를 사용하여 CSV 데이터를 생성하고,Blob 객체와 URL.createObjectURL을 이용하여 다운로드 기능을 구현하는 경우,다운로드 받은 CSV 파일을 엑셀이나..

next.js 를 시작하면서 이것 저것 나오는데 궁금한 것들이 있어 정리해 보았습니다.npx create-next-app@latest .처음 next를 설치를 하게 되면서 여러가지 물어보더라고요1. 타입스크립트를 사용할 거니? yes~! 이거 써야 할 말이 있으니까요?! 다음 ESline을 사용할 거니? Would you like to use eslint?  여시거 no를 사용하고 싶었지만 왜 no여야 하는지 왜 yes여야 하는지 고민을 해보고 싶었어요물론 ESline을 사용하면 많은 어려움이 있었기 때문에 사용을 하고 싶지 않았어요하지만 왜 나에게 문제가 발생을 했는지 찾는 것도 좋을 것 같아 ESline을 찾아봤어요 ESLint는 JavaScript 및 TypeScript 코드에서 오류를 찾아내고 스..

긴 숫자를 읽기 쉽게 변환하는 방법은 많은 곳에서 유용합니다.특히, 큰 금액이나 데이터 크기를 간결하게 표시할 수 있습니다. 문제: 긴 숫자를 읽기 쉽게 변환하기예를 들어, 24,343,800이라는 숫자를 그대로 표시하면 가독성이 떨어지고 UI가 깨지게 됩니다만약 모든 값을 보여줘야 하는 중요한 값이 아니라면이를 단위를 사용해 "2억+"처럼 표현한다면 훨씬 직관적일 것입니다. 아래와 같은 코드로 작성을 하면 좋을 것 같아요function formatLargeNumber(number) { if (typeof number !== "number" || isNaN(number)) { throw new Error("입력 값은 숫자여야 합니다."); } const units = ["",..

JavaScript의 연산자를 하나씩 정리해보겠습니다. 1. 연산자의 개념연산자는 코드에서 값을 계산하거나 평가하는 데 사용됩니다. 대표적인 예로는 산술 연산자, 할당 연산자, 비교 연산자 등이 있습니다.참고 문서: MDN 자바스크립트 연산자2. 값과 표현식리터럴 (Literal)리터럴은 코드에서 값을 나타내는 표기법입니다.숫자 리터럴: 1, 123문자열 리터럴: 'hello', "world"템플릿 리터럴: 안녕, ${name}함수 리터럴: function() {}표현식 (Expression)값으로 평가될 수 있는 코드를 의미합니다.let b; // 선언문b = 2; // 표현식, 할당문let a = b = 2; // 표현식console.log(a); // 2 출력3. 산술 연산자 ..