자바스크립트 8

실행컨텍스트와 호이스팅

실행 컨텍스트(Execution Context)란?실행 컨텍스트는 JavaScript 코드가 실행되는 환경입니다.코드가 실행될 때 변수, 함수, 객체가 어떻게 메모리에 할당되고, 그 순서는 어떻게 되는지를 결정하는 것이 실행 컨텍스트입니다.실행 컨텍스트의 종류JavaScript에는 두 가지 주요 실행 컨텍스트가 있습니다.글로벌 실행 컨텍스트(Global Execution Context): 자바스크립트가 처음 시작될 때 생성되는 전역 컨텍스트입니다. 브라우저에서는 window 객체가 글로벌 실행 컨텍스트의 일부입니다.함수 실행 컨텍스트(Function Execution Context): 함수가 호출될 때마다 생성되며, 각 함수는 고유한 실행 컨텍스트를 가집니다.실행 컨텍스트 생성 단계실행 컨텍스트는 코드가..

코드/JavaScript 2024.10.15

Promise와 Async

Promise와 Async자바스크립트에서 비동기 처리를 다루기 위한 두 가지 주요 패턴인 'Promise'와 'async/await'는 각각 고유한 특징과 사용 방법을 가지고 있다.이 두 패턴은 비동기 작업을 더 쉽게 관리할 수 있도록 도와주지만, 사용 방식과 코드의 가독성 측면에서 차이가 있다.Promise'Promise'는 비동기 작업의 완료 또는 실패를 처리하기 위한 객체이다.'Promise'는 비동기 작업이 완료된 후의 결과를 약속(promise)하고, 그 결과에 따라 'then' 또는 'catch' 메서드를 통해 처리할 수 있다.// Promise를 사용하는 예제function fetchData() { return new Promise((resolve, reject) => { set..

코드/JavaScript 2024.06.20

화살표 함수와 일반 함수의 차이점

화살표 함수와 일반 함수의 차이점자바스크립트에서 화살표 함수(Arrow Function)와 일반 함수(Regular Function)은 몇 가지의 차이점을 가지고 있다. 문법적 차이화살표 함수화살표 함수는 더 간결한 문법을 사용한다.const add = (a, b) => a + b; 일반 함수일반 함수는 'function' 키워드를 사용하여 정의한다.function add(a, b) { return a + b;} this 바인딩화살표 함수화살표 함수는 자신만의 this 바인딩을 가지지 않는다.대신, 화살표 함수는 자신이 정의된 위치의 'this' 값을 상속받는다.이를 렉시컬 스코핑(lexical scoping)이라고 한다.const obj = { value: 42, arrowFunctio..

코드/JavaScript 2024.06.19

호이스팅과 스코프

호이스팅과 스코프호이스팅(Hoisting)과 스코프(Scope)는 자바스크립트에서 중요한 개념으로 변수와 함수의 선언과 접근 가능성을 이해하는데 필수적이다. 이 두 개념은 서로 관련이 있지만, 각각 다르다. 스코프(Scope)스코프는 변수와 함수가 접근 가능한 범위를 정의한다.스코프는 크게 세 가지로 나눌 수 있다.전역 스코프(Global Scope)코드 어디서나 접근할 수 있는 변수와 함수이다.전역 스코프에 선언된 변수는 'window' 객체의 속성이 된다.var globalVar = "I am a global variable";function globalFunction() { console.log(globalVar); // I am a global variable} 함수 스코프(Function Sc..

코드/JavaScript 2024.06.19

let, var, const 기초

let, var, const 차이점변수를 선언하는데 사용되는 키워드이다.이들 간의 주요 차이점은 변수의 스코프, 재할당 가능성 그리고 호이스팅 방식에 있다.* 스코프(scope): 사전적 의미는 범위이고, 프로그래밍에서의 의미도 비슷한 개념으로 변수에 접근할 수 있는 범위로 재해석 하면 된다.* 호이스팅(hoisting): 인터프리터가 코드를 실행하기 전에 함수, 변수, 클래스 또는 임포트 선언문을 해당 범위의 맨 위로 끌어올리는 것처럼 보이는 현상  호이스팅과 스코프호이스팅과 스코프호이스팅(Hoisting)과 스코프(Scope)는 자바스크립트에서 중요한 개념으로 변수와 함수의 선언과 접근 가능성을 이해하는데 필수적이다. 이 두 개념은 서로 관련이 있지만, 각각jundev717.tistory.com va..

코드/JavaScript 2024.06.18

콜백함수 (Callback)

콜백 함수란?콜백 함수는 다른 코드의 인자로 넘겨주는 함수입니다.뜻을 살펴보면 callback은 '호출'의 의미를 갖는 call과 '되돌아오다'의 의미를 갖는 back의 합성어로 되돌아 호출해달라는 명령입니다.쉽게 말해서 어떤 함수 X를 호출하면서 '특정 조건을 만족할 때' 함수 Y를 실행해서 반환해달라는 요청을 함께 보내는 것입니다. 이처럼 콜백 함수는 다른 함수(메서드)에게 인자로 넘겨줌으로써 그 제어권도 함께 위임한 함수입니다. 콜백 함수를 위임받은 코드는 자체적인 내부 로직에 의해 이 콜백 함수를 조건이 만족할 때 실행할 것입니다. 제어권호출 시점다음은 setInterval 함수를 통한 콜백 함수 예제입니다.var count = 0;var callbackFunc = function() { c..

코드/JavaScript 2024.05.17

undefined와 null의 차이

자바스크립트의 '없음'을 나타내는 값은 undefined와 null로 두 가지가 있습니다.두 값의 의미는 같은 것 같지만 미세하게 다르고, 사용하는 목적 또한 다릅니다. Undefinedundefined는 사용자가 명시적으로 지정할 수도 있고, 자바스크립트 엔진이 자동으로 부여하는 경우도 있습니다. 다음은 자바스크립트 엔진이 자동으로 undefined를 부여하는 경우는 세 가지 경우입니다.// 값을 대입하지 않은 변수, 즉 데이터의 영역의 메모리 주소를 지정하지 않은 식별자에 접근할 때var a;console.log(a) // undefiend// 객체 내부의 존재하지 않는 프로퍼티에 접근하려고 할 때var obj = { a: 1};console.log(obj.b); // undefined// retur..

코드/JavaScript 2024.05.17

얕은 복사와 깊은 복사

얕은 복사와 깊은 복사얕은 복사(shallow copy) - 바로 아래 단계의 값만 복사하는 방법깊은 복사(deep copy) - 내부의 모든 값들을 하나하나 전부 복사하는 방법 다음은 얕은 복사를 구현한 함수와 객체 복사 결과를 보여주는 코드이다.// 기존 정보를 복사해서 새로운 객체를 반환하는 함수 (얕은 복사)var copyObject = function(target) { var result = {}; for (var item in target){ result[item] = target[item]; }}var user = { name: 'kim', info: { gender: 'male', age: '26' }};var user2 = ..

코드/JavaScript 2024.05.17