JavaScript

지니씨·2023년 7월 31일

프론트엔드

목록 보기

81/84

타입

immutable vs muutable
변경 불가능(immutable)한 값, 원시(primitive) 타입의 값
: 기본 타입 값 (string, number, boolean, null, undefined, Symbol)
: 원시값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장 됨 / 원시 값을 갖는 변수를 다른 변수에 할당하면 원시 값이 복사되어 전달됨(값에 의한 전달)

변경 가능(muutable)한 값, 객체(참조) 타입의 값
: 객체(Array, Function, RegExp 등)
: 객체를 변수에 할당하면 변수에는 참조 값이 저장 됨 / 객체를 가리키는 변수를 다른 변수에 할당하면 참조 값이 복사되어 전달됨(참조에 의한 전달)

래퍼객체

원시값을 객체처럼 사용하면 자바스크립트 엔진이 일시적으로 원시값을 연관된 객체로 변환해 준다.
이처럼 문자열, 숫자, 불리언 값에 대해 객체처럼 접근하면 생성되는 임시 객체를 래퍼 객체라 한다.
null, undefined는 원시값이지만 래퍼 객체를 생성하지 않아 null, undefined를 객체처럼 사용하면 에러가 발생한다.

Symbol
자바스크립트에는 6개의 타입(문자열, 숫자, 불리언, undefined, null, 객체 타입)이 있다.
심벌은 ES6에서 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이다.
다른 값과 절대 중복되지 않는 유일무이한 값
Symbol 함수를 호출하여 생성해야 함

new Symbol() // TypeError: Symbol is not a constructor

Promise

동기 vs 비동기
동기(synchronous)
: 직렬적으로 태스크 수행하는 방식
: 요청을 보낸 후 응답을 받아야지만 다음 동작이 이루어지는 방식

비동기(asynchronous)
: 병렬적으로 태스크 수행하는 방식
: 요청을 보낸 후 응답의 수락 여부와 상관없이 다음 태스크 동작하는 방식

Promise

자바스크립트는 비동기 처리를 위한 하나의 패턴으로 콜백 함수를 사용한다.
ES6에서는 비동기 처리를 위해 또 다른 패턴으로 프로미스를 도입했다.

Async / Await

async function 함수명() {
  await 비동기_처리_메서드_명();
}

async 키워드는 function 앞에 사용, 항상 promise 반환
await는 async 함수 안에서만 동작, 프로미스가 처리될 때 까지 기다렸다가 결과 반환

JavaScript에서 비동기 작업은 코드의 실행 흐름을 블로킹하지 않고, 다른 작업을 동시에 수행할 수 있는 메커니즘을 의미합니다.
비동기 작업은 특히 네트워크 요청, 파일 읽기/쓰기, 타이머 등과 같이 시간이 걸리거나 외부 리소스와 상호 작용해야 하는 작업을 다룰 때 유용합니다.

JavaScript는 기본적으로 단일 스레드에서 동작하므로
블로킹되는 작업이 있을 경우 전체 애플리케이션의 성능이 떨어질 수 있습니다.
이를 해결하기 위해 비동기 작업이 사용됩니다.

비동기 작업의 특징:

Non-blocking: 비동기 작업은 다른 작업이 진행되는 동안 블로킹되지 않고 백그라운드에서 동작합니다.
Callback 함수: 비동기 작업이 완료되면 실행될 콜백 함수를 등록할 수 있습니다.
이벤트 루프: JavaScript는 이벤트 루프를 사용하여 비동기 작업을 관리하고, 작업이 완료되었을 때 콜백 함수를 실행합니다.
Promise와 async/await: ES6부터는 Promise와 async/await를 사용하여 비동기 작업을 보다 간결하고 읽기 쉽게 다룰 수 있게 되었습니다.