본문 바로가기

Dev25

CommonJS, AMD, UMD, ESM CommonJS (이하 CJS), AMD, UMD, ESM 모두 자바스크립트의 모듈 시스템을 말한다. 먼저, 모듈 시스템은 코드의 재사용성과 캡슐화를 위해 서로 관련된 기능들을 하나의 단위(모듈)로 묶어 관리하는 방법을 말한다. 시간이 흐르면서 위와 같이 여러 방식이 등작했으며, 각 방식은 사용 환경과 필요에 따라 발전해 왔다.1. 초기 자바스크립트와 모듈의 필요성초기 상황:자바스크립트가 등장했을 때는 모듈 시스템이 존재하지 않아, 모든 함수와 변수가 전역 스코프에 존해앴다. 이로 인해 네임스페이스 충돌, 코드 관리의 어려움이 발생했다.모듈의 필요성:코드의 재사용, 유지보수, 독립적인 테스트 등을 위해 모듈화를 도입하게 되었으며, 이를 통해 코드가 명확하게 분리되고 독립적으로 관리될 수 있게 되었다. 2.. 2025. 2. 24.
about AssemblyScript & vs Rust & vs C/C++ AssemblyScript는 TypeScirpt와 유사한 문법을 기반으로 하는 언어로, WebAssembly(WASM) 모듈을 생성하기 위해 설계되었다. JavaScript 및 TypeScript 개발자들이 친숙한 환경에서 고성능 코드를 작성할 수 있도록 도와주며, 별도의 시스템 언어(C/C++, Rust 등)를 배우지 않고고 WebAssembly를 활용할 수 있게 한다. 주요 특징TypeScript 친화적 문법:TypeScript와 매우 유사한 문법을 사용하여, 기존 JavaScirpt/TypeScript 개발자들이 빠르게 학습하고 사용할 수 있다.WebAssembly 타겟:AssemblyScript로 작성된 코드는 WebAssembly 모듈로 컴파일되어 브라우저나 Node.js 환경에서 높은 성능으로.. 2025. 2. 22.
ECMAScript 2024 : ES2024 - 주요 추가 기능 2025년도 벌써 2개월이 다 지나갔는데 왜 2024년도에 발표된 ES2024에 대해서 포스팅을 하냐고? 현재 가장 최신 자바스크립트 버전은 ES2024이기 때문이다.주요 추가 기능은 아래와 같다. 1. Object.groupBy / Map.groupBy컬렉션(ex: 배열)의 각 요소를 특정 기준에 따라 그룹화할 수 있도록 한다. Object.groupBy:배열을 순회하며, 제공된 콜백 함수의 반환값(그룹 키)에 따라 요소들을 일반 객체의 프로퍼티로 그룹화한다.const data = [ { year: "2024", id: 0 }, { year: "2023", id: 1 }, { year: "2024", id: 2 },];const grouped = Object.groupBy(data, (el) =>.. 2025. 2. 22.
V8! V8! Witeness me! Witness You! Witnessed! - 2 블로그를 해 보겠다고 시작한게 2년전이네... ㅋㅋㅋ 온갖 핑계로 아무것도 안하다가 이제 다시 시작한다. 진짜 야무지게 해야지~ 햇수로 3년전 글에 이은 V8의 작동 방식에 대해 설명한다. V8 엔진은 구글이 개발한 오픈 소스 자바스크립트 엔진으로, 웹 브라우저와 Node.js 등에서 자바스크립트 코드를 빠르고 효율적으로 실행하기 위해 설계 되었다. 그래서 그 동작 방식은 아래와 같다. 1. 파싱 및 AST 생성소스 코드 분석:자바스크립트 소스 코드를 읽어 들여 먼저 렉서(lexer)에 의해 토큰(token)으로 분해된다. 추상 구문 트리 (AST, Abstract Syntax Tree) 생성:토큰들을 기반으로 파서가 소스 코드의 문법적 구조를 나타내는 트리( AST )를 생성한다. 2. 바이트코드 생성.. 2025. 2. 21.
Generator Function - 제너레이터 함수 제너레이터 함수는 자바스크립에서 순회 가능한(iterable) 객체를 생성하거나, 함수의 실행을 중간에 일시 중단(pause)하고 다시 재개(resume)할 수 있도록 해주는 특별한 함수다. 제너레이터 함수는 일반 함수와 다르게 실행 흐름을 제어할 수 있는 강력한 기능을 제공한다. 1. 제너레이터 함수의 정의와 문법제너레이터 함수는 함수 선언문 앞에 *를 붙여 정의하며, 함수 내에서 yield  키워드를 사용하여 값을 반환한다.function* myGenerator() { yield 1; yield 2; yield 3;} 2. yield 키워드와 실행 흐름 제어yield의 역할:yield는 함수의 실행을 일시 중단하고, 호출자에게 특정 값을 반환하는 역할을 한다. 제너레이터 함수는 yield에서 멈.. 2025. 2. 21.
Rust: Syntactic Sugar 1. 구조체 필드 축약 (Shorthand Field Initialization)구조체의 필드 이름과 같은 이름의 변수가 있을 경우, 필드 초기화를 간단하게 작성할 수 있다.struct Point { x: 132, y: 132,}fn main() { let x = 5; let y = 10; // 필드 이름과 변수명이 동일하므로 축약 가능 let p = Point { x, y }; // 위 코드는 Point { x: x, y: y }와 동일함} 2. if let 및 while let복잡한 match 구문 대신, 특정 패턴 하나만 처리할 경우에 사용하는 축약 구문. if let:fn main() { let maybe_value = Some(42); if let Some(val) = maybe.. 2025. 2. 21.

티스토리툴바