eatthefrog
모던 자바스크립트 모듈,클래스,함수 정리 본문

언제 사용하는가?
- 모듈:
- 프로젝트가 커질 때 파일 단위로 코드 분리.
- 여러 파일에서 공통 기능을 가져와 사용.
- 예: 유틸리티 함수, API 호출 로직 등.
- 클래스:
- 객체지향 프로그래밍(OOP)을 구현할 때.
- 복잡한 데이터 구조와 메서드가 필요한 경우.
- 예: 사용자 객체(User), 데이터 모델 등.
- 함수:
- 특정 작업이나 계산을 수행할 때.
- 코드가 간단하고 상태 관리가 필요 없을 때.
- 예: 단순 계산, 데이터 변환 등.
예시 코드

모듈
// math.js (모듈)
export function add(a, b) {
return a + b;
}
export function multiply(a, b) {
return a * b;
}
// app.js (모듈 사용)
import { add, multiply } from './math.js';
console.log(add(2, 3)); // 5
console.log(multiply(2, 3)); // 6
클래스
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
return `Hello, my name is ${this.name}.`;
}
}
const person1 = new Person("NewJeans", 2);
console.log(person1.greet()); // Hello, my name is Newjeans
함수
function greet(name) {
return `Hello, ${name}!`;
}
console.log(greet("NewJeans")); // Hello, NewJeans!'프론트엔드 노트' 카테고리의 다른 글
| 모던 자바스크립트_Module Pattern(import,export) (1) | 2025.01.02 |
|---|---|
| 모던 자바스크립트 모듈 Top-Level await (ES2022) (0) | 2025.01.02 |
| CSS) 자식박스를 가운데 정렬시키기 위해서 부모 박스에 flex box 설정하는 이유 (1) | 2025.01.01 |
| 모던 자바스크립트_ES6 모듈 VS 스크립트 2탄(파일로딩,다운로드) (1) | 2024.12.31 |
| 모던 자바스크립트 모듈 (0) | 2024.12.31 |