본문 바로가기

JavaScript9

setTimeout과 setInterval setTimeout과 setInterval을 활용하면 일정 시간이 지난 후 원하는 함수를 실행할 수 있다. 프로젝트에서 이러한 호출 스케쥴링(scheduling a call)을 사용하고 있는데 제대로 이해하지 못하고 사용하고 있는 거 같아 이번 기회에 공부해보려고 한다. setTimeout setTimeout의 경우 일정 시간이 지난 후 원하는 함수를 실행한다. 원하는 함수를 한 번 실행한 후 종료된다. let timerId = setTimeout(func|code, [delay], [arg1], [arg2], ...) 첫 번째 매개변수인 func|code는 일정 시간이 지난 후 실행될 함수이다. 두 번째 매개변수인 delay는 실행 전 대기 시간으로 밀리초 단위를 작성하며, 기본값은 0이다. 마지막 매.. 2023. 11. 2.
배열 🧀 배열 여러 개의 값을 순차적으로 나열한 자료구조. 배열 안에는 요소를 가지고 있고, 각 요소는 배열 안에서 인덱스를 가지고 있다. 인덱스는 0부터 시작하고, 각 요소의 인덱스를 사용하면 요소에 접근할 수 있다. const arr = ['a', 'b', 'c']; arr[0]; //a arr[1]; //b arr[2]; //c 🧀 배열 생성 배열은 다양한 방법으로 생성할 수 있다. const array1 = new Array(1, 2); console.log(array1); //[ 1, 2 ] const array2 = Array.of(1, 2); console.log(array2); //[ 1, 2 ] const array3 = [1, 2]; console.log(array3); //[ 1, 2 ] .. 2023. 2. 26.
클래스 🌼 클래스의 기본 문법 class ClassName { constructor() { } method1() { } method2() { } method3() { } } 클래스를 생성한 뒤 'new ClassName()'을 호출하면 객체가 생성된다. constructor는 new에 의해 자동으로 호출되며, 객체를 초기화할 수 있다. class Fruit { constructor(name) { this.name = name; } say() { console.log(this.name); } } const apple = new Fruit('apple'); apple.say(); //apple new Fruit를 하는 순간 새로운 객체가 생성되고 constructor가 자동으로 실행된다. this.name에 'ap.. 2023. 2. 24.
객체 ☀️ 객체 객체는 0개 이상의 프로퍼티로 구성된 집합이며, 프로퍼티는 키와 값으로 구성된다. 객체는 다양한 방법으로 생성할 수 있는데 가장 일반적인 방식은 객체 리터럴을 사용하는 것이다. const fruit = { name: 'apple', color: 'red', }; 객체는 { key : value } 형태를 기본으로 가지고 있다. key에는 문자, 숫자, 문자열 등이 사용가능하고 value에는 원시값, 객체 등이 사용가능하다. ☀️ 프로퍼티 접근 프로퍼티에 접근하기 위해서는 두 가지 방법이 있다. 먼저, 마침표 표기법이다. const fruit = { name: 'apple', color: 'red', }; console.log(fruit.name); 두번째는 대괄호 표기법이다. 다만, 첫 번째 .. 2023. 2. 21.
함수 🍋 함수 입력을 받아 출력을 내보내는 일련의 과정 // 함수 정의 function 함수이름(매개변수) { return 반환값; } 함수이름(인수) // 함수 호출 function add(a, b) { return a + b; } const result = add(1, 2); console.log(result); //3 🍋 함수를 사용하는 이유 만약 동일한 작업을 반복적으로 사용해야 한다면 같은 코드를 계속 작성해야 한다. 이때 미리 정의된 함수를 사용하면 중복을 제거하고 코드를 재사용하는 것에 유리하다. let a = 0; let b = 0; let addResult = 0; a = 1; b = 1; addResult = a + b; a = 2; b = 2; addResult = a + b; //이 코드.. 2023. 2. 19.
제어문 🍯 조건문 if 문 if (조건 1) { //조건 1이 참이면 실행될 코드블럭 } else if (조건 2) { //조건 2가 참이면 실행될 코드블럭 } else { //조건 1과 조건 2 모두 거짓이면 실행될 코드블럭 } 조건식의 평과 결과가 true일 경우 if문의 코드가 실행되고, false일 경우 else문의 코드가 실행된다. let emotion = 'happy'; if (emotion === 'happy') { console.log('😁'); } else if (emotion === 'sad') { console.log('🥲'); } else { console.log('🤔'); } 조건을 더 늘리고 싶다면 else if를 사용해 추가하면 된다. 삼항연산자 if 조건문은 삼항 연산자로 바꿔 작성.. 2023. 2. 19.