JS5 find() - Lodash 유틸함수 직접 구현 | TypeScript 복잡한 형태를 처리할 수 있는 Lodash 의 find를 구현하기 전에, 가장 기본적인 형태인 JS의 find를 구현해본 후, Lodash 가 제공하는 find 함수를 만들어보자. JS 기본 'find' 함수 구현 - Array.prototype.find()→ 배열을 받아 넘겨주는 콜백 함수로 검사하는 find를 만들어보자. 구현 순서배열 순회: 배열을 순회하며 각 요소를 조건과 비교한다.조건 만족 여부 확인: 요소가 조건을 만족하면 첫번째 해당 요소를 반환한다.조건을 만족하는 요소가 없으면 undefined를 반환한다.구현 코드function find(collection: T[], predicate: (el) => boolean): T | undefined { // 배열 순회 for (l.. 2024. 6. 9. JavaScript 반복문 비교 for 로 시작하는 반복문은 forfor ... of for ... in이 for 로 시작하는 반복문을 정리해보자. 1. 'for' 반복 횟수가 명확할 때 사용반복 대상: 주로 배열이나 범위구조: 초기화, 조건, 증감예: 주어진 범위 내 반복이 필요할 때배열의 인덱스를 사용하여 접근할 때!for (let i = 0; i 2. 'for ... in'객체의 열거 가능한 속성을 반복할 때 사용반복 대상: object(객체)구조: 객체의 열거 가능한 속성 'key' 반복예:객체의 모든 속성에 대해 작업이 필요할 때속성 이름을 알고 속성 값에 접근할 때 -> 예: if (key === 'port' && config[key] === 8080) ...const obj = {a:1, b:2, c:3};for (le.. 2024. 6. 8. CJS vs ESM 자바스크립트는 웹 개발의 핵심 언어 중 하나로서, 자바스크립트로 개발을 하다보면 CJS라 불리는 CommonJS, 그리고 ESM 이라 불리는 ECMAScript이라는 두가지 모듈 시스템을 마주치게 된다. 자연스럽게 "왜 같은 자바스크립트인데 두 개의 모듈 시스템이 존재할까?"라는 궁금증이 들기 마련이다. 이 글에서는 모듈 시스템이 어떻게 탄생하게 되었고, 어떤 특징과 차이점을 가지고 있는지 알아보자. 웹 초기 시절에 JS는 브라우저에서 간단한 동작만을 위해 존재했기 때문에 모듈(애플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드 조각) 시스템이 필요하지 않았다. HTML에 script 태그로 간단히 적을 수 있는 정도였다. 하지만 웹앱의 기능이 커지면서 복잡하고 긴 코드를 좀 더 정리하고 재사용.. 2024. 6. 2. 요즘은 왜 jQuery 를 안쓰는가 ? jQuery 를 더이상 사용하지 않는 이유를 알기 위해선, 그 당시 jQuery를 왜 많이 도입하고 사용했는지를 함께 알아보면서 그 때와 지금의 차이점을 알아볼 필요가 있다. jQuery 의 사용 이유와 더이상 사용하지 않는 이유 1. 브라우저 호환성 + 웹 표준 API 확장 초기 웹 개발에서는 브라우저 호환성 문제가 큰 문제였다. 브라우저 호환성 또는 웹 호환성이란 운영체제 및 브라우저 간 동일한 웹 사이트 경험을 제공하는 하는 것으로, 이를 준수하지 않으면 다양한 운영체제 환경 및 브라우저에서 사용이 불가능한 문제가 발생한다. jQuery는 이 호환성 문제를 해결하는 강력한 도구로 등장하여, 다양한 브라우저에서 일관된 방식으로 JavaScript를 사용할 수 있도록 해주었다. jQuery가 본격적으.. 2024. 5. 14. 변수 - JS Deep Dive 와 ECMAScript 참고 변수를 사용하려면, 1. 변수 Declaration (선언)값을 저장하기 위한 메모리 공간 확보. 변수 이름과 메모리 공간의 주소 연결해서 값을 저장할 수 있도록 준비var 키워드의 경우, 확보된 메모리 공간에는 undefined값이 암묵적으로 할당2. 변수 Initialization (초기화)선언된 이후, 최초로 값을 할당하는 것ECMA에서 살펴본 'let', 'const' 키워드 변수와 'var' 로 선언된 변수의 정의는 아래와 같다.let, const 에 대한 설명'let' and 'const' declarations define variables that are scoped to the running execution context's LexicalEnvironment. The variables .. 2024. 5. 6. 이전 1 다음