JavaScript9 [JS] async/await async/await는 JavaScript에서 비동기 작업을 처리하는 데 사용되는 구문입니다. 이것은 Promise 기반 코드를 보다 간결하고 직관적으로 작성할 수 있게 도와줍니다. 먼저 Promise와 관련된 기본 개념을 이해한 후, async/await를 사용하는 방법을 설명하겠습니다. 1. Promise 복습 JavaScript의 Promise는 비동기 작업의 성공 또는 실패를 나타내는 객체입니다. 이를 사용하면 비동기 작업의 완료 시점에 대한 처리를 할 수 있습니다.const myPromise = new Promise((resolve, reject) => { // 비동기 작업 const success = true; if (success) { resolve('작업 성공'); } else.. 2024. 9. 20. [JS] 얕은복사, 깊은복사 *얕은 복사(Shallow Copy)**와 **깊은 복사(Deep Copy)**는 자바스크립트에서 객체나 배열을 복사할 때 사용되는 중요한 개념입니다. 두 가지 방식의 차이는 복사된 객체가 원본 객체와 어떤 식으로 연결되는지에 따라 달라집니다. 1. 얕은 복사 (Shallow Copy) 얕은 복사는 객체의 최상위 레벨 속성만 복사하는 방식입니다. 원본 객체와 복사된 객체는 같은 참조를 공유하는 중첩된 객체를 가집니다. 즉, 얕은 복사는 1단계만 복사하기 때문에, 객체나 배열 내부에 중첩된 객체나 배열이 있을 경우, 원본과 복사된 객체가 같은 참조를 공유하게 됩니다. 얕은 복사의 특징 • 객체의 최상위 레벨 속성만 복사됩니다. • 중첩된 객체나 배열은 참조만 복사되므로, 복사된 객체와 원본 객체는 내부 .. 2024. 9. 8. [JS] Promise Promise는 자바스크립트에서 비동기 작업을 처리하는 데 사용되는 객체로, 비동기 작업의 완료 또는 실패 상태를 나타냅니다. 기본적으로 Promise는 비동기 작업이 성공했는지 실패했는지를 추적하고, 그에 맞는 후속 처리를 관리하는 방식입니다. **콜백 지옥(Callback Hell)**을 피하고, 비동기 흐름을 더욱 읽기 쉽고, 관리하기 쉽게 만들어주는 중요한 도구입니다. 1. Promise의 기본 개념 Promise는 비동기 작업이 완료되었을 때의 약속을 나타냅니다. Promise는 3가지 상태를 가집니다: • Pending (대기): 초기 상태로, 비동기 작업이 아직 완료되지 않은 상태입니다. • Fulfilled (이행됨): 작업이 성공적으로 완료된 상태입니다. • Rejected (거부됨):.. 2024. 9. 8. [JS] 자바스크립트의 동작방식(비동기,동기) 1. 기본적으로 동기적으로 처리되는 자바스크립트 자바스크립트는 단일 스레드로 동작하기 때문에, 한 번에 하나의 작업만 처리할 수 있습니다. 동기적으로 처리된다는 것은 각 작업이 순차적으로 실행되고, 이전 작업이 완료되기 전까지는 다음 작업이 실행되지 않는다는 의미입니다. 예를 들어, 동기적 코드에서는 블로킹(Blocking)이 발생하여 시간이 오래 걸리는 작업이 있다면 그 작업이 완료될 때까지 다른 코드가 실행되지 않습니다. • 동기적 처리 예시:console.log("첫 번째 작업 시작");for (let i = 0; i 위 코드는 for 루프가 끝나기 전까지 “두 번째 작업 시작” 로그가 출력되지 않습니다. 동기적인 코드이기 때문에, 첫 번째 작업이 끝나야 다음 작업이 실행됩니다. 2. 비동기 처리.. 2024. 9. 8. [JS] Callback 1. 자바스크립트의 콜백(Callback) 함수 콜백 함수는 자바스크립트에서 매우 중요한 개념 중 하나입니다. 기본적으로 콜백 함수는 다른 함수의 인자로 전달되어 그 함수가 실행된 이후에 호출되는 함수를 의미합니다. 자바스크립트는 비동기 처리가 필요한 작업(예: 데이터베이스 호출, 파일 읽기, HTTP 요청 등)에서 주로 콜백을 사용하여 해당 작업이 완료된 후 어떤 동작을 수행할지 정의합니다. 1.1 콜백 함수의 특징 • 비동기 작업에서 주로 사용되지만, 동기 작업에서도 사용될 수 있습니다. • 콜백 함수는 나중에 호출될 함수를 인자로 받는 패턴으로, 특정 작업이 완료되면 해당 함수가 호출됩니다. • 콜백 패턴은 자바스크립트의 이벤트 기반 구조와 비동기 처리에서 매우 자주 사용됩니다. 1.2 콜백 함수.. 2024. 9. 8. [JS] 함수와 클래스(this) 1. 함수 선언 방식 자바스크립트에서는 여러 가지 방식으로 함수를 정의할 수 있습니다. 각 방식은 함수의 스코프, 호이스팅, this와의 관계 등에 영향을 미칩니다. 1.1 함수 선언문 (Function Declaration) • 정의: 가장 일반적인 함수 선언 방식입니다. 함수 선언문은 코드에서 독립적인 함수로 정의되며, 해당 함수는 스코프 내에서 어디서든 호출할 수 있습니다. • 호이스팅: 함수 선언문은 자바스크립트 엔진에 의해 호이스팅됩니다. 즉, 함수가 선언된 위치와 상관없이 스코프의 맨 위로 끌어올려지기 때문에 함수 선언 전에 함수 호출이 가능합니다. • 예시:function greet() { console.log("Hello!");}greet(); // Hello! • 함수 선언 전 호.. 2024. 9. 8. 이전 1 2 다음