728x90 300x250 SMALL javaScript529 ES6 모듈 시스템 : import/export를 활용한 최신 개발 방법 ES6 모듈이란?ES6 모듈 시스템은 JavaScript 파일을 독립적인 모듈로 나누어 관리할 수 있도록 해주는 기능이다.즉, 코드를 여러 개의 파일로 나눠서 필요할 때만 불러오는 방식 기존에는 script태그를 여러 개 추가하거나, require.js, CommonJS등을 사용했지만, ES6부터는 표준을 내장된 import / export 문법을 사용할 수 있다. ES6 모듈의 기본 문법1) 모듈에서 export 하기// math.jsexport function add(a, b) { return a + b;}export const PI = 3.14; 2) import 해서 사용하기// main.jsimport { add, PI } from "./math.js";console.log(add(2, 3)).. 2025. 3. 13. 미니 블로그 만들기2- 비 보호되어 있는 글 입니다. 2025. 3. 4. reduce() 기본 개념부터 활용까지 쉽게 이해하기 reduce()란?reduce()는 배열의 요소를 하나씩 순회하면서 누적된 값을 만들어내는 함수다.array.reduce((누적값(prev), 현재값(curr), 인덱스(i)) => { }, 초기값) prev : 이전까지의 누적된 값(첫 번째 실행 때는 "초기값"이 들어감)curr : 현재 순회 중이 요소i : 현재 순회중인 요소의 인덱스 (0부터 시작)초기값 : reduce()가 처음 실행될 때 prev에 들어갈 값숫자 더하기const numbers = [1, 2, 3, 4];const sum = numbers.reduce((prev, curr) => prev + curr, 0);console.log(sum); // 10 최종적으로 prev에 10이 저장돼서 반환됨 2025. 2. 28. 함수 매개변수에서 디스트럭처링 제대로 이해하기 디스트럭처링은 여러 가지 상황에서 유용하다. 예를 들어, 함수의 매개변수로 객체나 배열을 전달할 때, 각 값에 쉽게 접근할 수 있도록 도와준다. JavaScript 함수에서 객체 디스트럭처링을 활용하는 방법JavaScript에서 함수의 매개변수로 객체를 받을 때, 디스트럭처링(구조 분해)을 이용하면 코드가 더 간결하고 직관적이 된다.function greet({ name, age }) { console.log(`Hello, ${name}. You are ${age} years old.`);}const person = { name: "Alice", age: 25 };greet(person); // "Hello, Alice. You are 25 years old." 이 코드에서 greet({name, a.. 2025. 1. 27. 이전 1 2 3 4 ··· 133 다음 728x90 반응형 LIST