JavaScript 16

[JavaScript] 비동기 프로그래밍 (Promise, async/await)

1. 비동기 프로그래밍이란?기본적으로 JavaScript는 단일 스레드(single-threaded) 언어입니다. 즉, 한 번에 한 가지 작업만 처리할 수 있습니다. 하지만 비동기 프로그래밍을 사용하면 시간이 오래 걸리는 작업을 기다리지 않고 다른 작업을 먼저 수행할 수 있습니다.예를 들어, 웹사이트에서 서버로 데이터를 요청할 때 비동기 처리를 하지 않으면 응답을 받을 때까지 웹페이지가 멈추게 됩니다. 하지만 비동기 처리를 하면 응답을 기다리는 동안 다른 작업을 수행할 수 있습니다. 2. 콜백 함수 (Callback)과거에는 비동기 처리를 위해 콜백 함수를 사용했습니다.function fetchData(callback) { setTimeout(() => { console.log("데이터..

JavaScript 2025.01.31

[JavaScript] ES6+ 문법

ES6+ 문법 자세한 설명JavaScript는 2015년 ECMAScript 6(ES6) 이후 지속적으로 새로운 기능을 도입하여 코드의 가독성과 효율성을 향상시키고 있습니다. 이번 글에서는 ES6+의 핵심 문법 중 let, const, 화살표 함수, 템플릿 리터럴, 구조 분해 할당, 스프레드 연산자에 대해 자세히 설명하겠습니다. 1. let과 const (변수 선언)기존에는 변수를 선언할 때 var를 사용했지만, ES6에서는 let과 const가 도입되었습니다.let**블록 스코프(block scope)**를 가집니다.동일한 변수 이름을 같은 블록 내에서 중복 선언할 수 없습니다.재할당이 가능합니다.let age = 30; age = 31; // 가능 console.log(age); // 31const*..

JavaScript 2025.01.30

[JavaScript] 고차함수

JavaScript에서 자주 쓰이는 고차 함수JavaScript에는 이미 정의된 고차 함수들이 많습니다. 배열 메서드에서 특히 자주 사용됩니다.1. forEach()란?forEach()는 JavaScript 배열(Array)의 메서드로, 배열의 각 요소를 순회하며 주어진 함수를 실행하는 역할을 합니다.즉, forEach()는 배열에 저장된 요소마다 한 번씩 특정 작업을 수행할 때 사용됩니다.1) 기본 문법array.forEach(callbackFunction(currentValue, index, array));2) 매개변수 설명callbackFunction (필수): 각 배열 요소에서 실행할 함수currentValue (필수): 현재 처리 중인 배열 요소index (선택): 현재 요소의 인덱스array ..

JavaScript 2025.01.29

[JavaScript] 클로저(Closure)

1. 클로저란 무엇인가?클로저는 함수가 선언될 당시의 렉시컬 환경(Lexical Environment)을 기억하여, 외부 함수의 변수에 접근할 수 있는 함수를 의미합니다.JavaScript에서 함수는 선언된 위치를 기준으로 스코프가 결정되는데, 이 스코프를 기억하고 유지할 수 있는 것이 클로저의 핵심입니다.1) 클로저의 특징외부 함수의 변수에 접근할 수 있다.내부 함수는 자신이 선언된 함수의 변수에 접근할 수 있습니다.외부 함수 실행이 종료된 후에도 변수 상태를 유지한다.클로저를 사용하면 외부 함수가 종료된 후에도 그 함수의 변수가 소멸되지 않고 유지됩니다.데이터 은닉 및 캡슐화가 가능하다.클로저를 사용하면 외부에서 직접 접근할 수 없는 private 변수를 만들 수 있습니다.2) 클로저의 동작 원리클로..

JavaScript 2025.01.28

JavaScript 기본 문법

JavaScript 기본 문법JavaScript는 웹 개발에서 필수적인 언어로, 웹 페이지에 동적 기능을 추가하고 사용자와의 상호작용을 가능하게 만듭니다. 이 글에서는 JavaScript의 기본 문법에 대해 간단히 정리해보겠습니다.1. 변수와 데이터 타입변수 선언JavaScript에서는 var, let, const 키워드를 사용하여 변수를 선언합니다.var: ES5 이전에 사용된 방식으로 함수 스코프(function scope)를 가집니다.let: ES6에서 도입된 방식으로 블록 스코프(block scope)를 가집니다. 변경 가능한 변수에 사용합니다.const: 값이 변경되지 않는 상수에 사용하며, 블록 스코프를 가집니다.let name = "John"; // 변수 선언 후 값 할당 const age ..

JavaScript 2025.01.28

JavaScript에 대해서

1. JavaScript란?JavaScript(자바스크립트)는 웹 개발을 위한 프로그래밍 언어입니다. 웹페이지에 동적인 기능을 추가하고, 사용자와의 상호작용을 가능하게 만드는 역할을 합니다. 웹페이지의 버튼을 클릭하면 창이 뜨거나, 사용자가 입력한 데이터를 처리하는 등 인터랙티브한 요소를 구현할 수 있게 해줍니다.웹의 세 가지 핵심 기술웹페이지를 구성하는 세 가지 핵심 기술은 HTML, CSS, JavaScript입니다.HTML: 웹페이지의 구조를 정의합니다.CSS: 웹페이지의 스타일과 디자인을 담당합니다.JavaScript: 웹페이지에 동적인 기능을 추가하고, 사용자의 행동에 반응하도록 만듭니다.JavaScript는 기본적으로 브라우저에서 실행되는 언어로, 사용자가 웹페이지에서 버튼을 클릭하거나 마우스..

JavaScript 2025.01.28