반응형 javascript32 [JavaScript 33가지 개념] 10. setTimeout, setInterval, requestAnimationFrame 1. setTimeout const greeting = (name) => { console.log(`Hello, ${name}!`); } setTimeout(greeting, 2000, "John"); console.log("Waiting for 2 seconds..."); /* 실행 결과 Waiting for 2 seconds... Hello, John! */ setTimout을 사용하는 방법은 위와 같다. 위의 예시에서는 2000밀리초(2초) 지연 후 실행되도록 예약되었기 때문에 console.log가 먼저 실행되고 greeting 함수가 실행된다. 2. setInterval let count = 0; const increment = () => { count += 1; console.log(`Coun.. 2023. 3. 12. [JavaScript 33가지 개념] 09. 메시지 큐와 이벤트 루프 JavaScript는 단일 스레드 언어이므로 한 번에 하나만 실행할 수 있다. 그러나 다른 코드가 계속 실행되는 동안 코드가 백그라운드에서 실행될 수 있는 비동기 프로그래밍도 지원한다. 이는 JavaScript의 두 가지 주요 기능인 메시지 큐와 이벤트 루프 때문에 가능하다. 1. 메시지 큐 메시지 큐는 처리해야 하는 메시지(또는 작업)의 목록이다. 대기열의 각 메시지는 메시지가 처리될 때 실행될 함수와 연결된다. 메시지는 대기열에 추가된 순서, 즉 FIFO(First In, First Out) 순서대로 실행된다. 2. 이벤트 루프 이벤트 루프는 대기열의 메시지 처리를 담당한다. 아래의 과정을 반복한다. 백그라운드에서 계속 실행되어 처리할 새 메시지의 대기열을 확인한다. > 메시지가 발견되면 관련 기능이.. 2023. 3. 12. [JavaScript 33가지 개념] 08. IIFE, Modules, Namespaces IIFE, Modules, Namespaces는 자바스크립트에서 코드 구조화를 위해 사용되는 중요한 개념이다. 각각의 개념은 서로 다른 방식으로 코드의 구조화와 유지보수를 용이하게 하는데 도움을 준다. 1. IIFE IIFE (Immediately Invoked Function Expression) IIFE는 즉시 실행되는 함수 표현식으로, 함수를 정의하고 즉시 호출하는 것을 의미한다. 이를 통해 전역 스코프를 오염시키지 않고 모듈화할 수 있으며, 클로저를 이용하여 비공개 변수를 만들어 정보 은닉에도 사용된다. 사용 방법은 아래와 같다. (function() { // 함수 내 코드 })(); 2. Modules Modules는 자바스크립트 코드를 여러 파일로 분리하여 개발하고 유지보수하는 방법이다. 각각.. 2023. 3. 2. [JavaScript 33가지 개념] 07. 함수 표현식(expression) vs 함수 선언문(declaration) 자바스크립트에서 함수를 만드는 방법은 대표적으로 두가지가 있다. 1. 함수 표현식(expression) 함수 표현식을 사용하는 방법은 다음과 같다. const [이름] = function (param1, param2, ...param3) { // 함수 본문 및 로직 } 2. 함수 선언문(declaration) 함수 선언문을 사용하는 방법은 다음과 같다. function [이름] (param1, param2, ...param3) { // 함수 본문 및 로직 } 3. 함수 표현식 vs 함수 선언문 함수 선언문은 호이스팅되지만 함수 표현식은 호이스팅되지 않습니다. 즉, 정의되기 전에 함수 선언을 호출할 수 있지만 함수 식으로는 이 작업을 수행할 수 없다. 함수 표현식을 사용하면 함수를 정의한 직후 함수를 사용.. 2022. 12. 8. [JavaScript 33가지 개념] 06. 함수 범위, 블록 범위, 렉시컬(lexical) 범위 변수를 선언하는 위치에 따라 사용할 수 있는 범위가 다르게 정의된다. 기본적으로 javascript 변수는 함수 범위로 동작한다. 1. 함수 범위 function nameFunc() { var name1 = 'tom'; console.log('1-1', name1); } nameFunc(); console.log('1-2', name1); if (true) { var name2 = 'bob'; console.log('2-1', name2); } console.log('2-2', name2); 위 처럼 변수를 선언하고 호출하면 아래와 같은 결과가 나온다. 1-1 tom 1-2 undefined error 2-1 bob 2-2 bob 1-2에서 에러가 발생하는 걸 확인할 수 있다. 즉, 변수 선언 후 사용은.. 2022. 6. 6. [JavaScript 33가지 개념] 05. == vs === vs typeof 코딩을 하다보면 조건문을 많이 사용하게 된다. 조건문에서 특히 Equality 문법을 사용하게 되는데, 해당 문법에 대해 자세히 알아보자. 1. === === 는 엄격한 Equality 연산자이다. === 는 데이터의 값과 타입이 모두 같아야 true를 반환해준다. console.log(0 === 0); // true console.log('hello!' === 'hello!'); // true console.log(null === null); // true console.log(undefined === undefined); // true console.log(0 === 5); // false console.log(0 === '0'); // false console.log(0 === 'hello!'); .. 2021. 5. 27. 이전 1 2 3 4 ··· 6 다음 반응형
