최근 Javascript에 대한 관심이 커지면서 문법적인 부분을 먼저 공부하였다. 기본적인 문법을 익히고 나서는 Javascript의 동작 방식에 대해 궁금증이 생겼고, 가장 자주 쓰이며 꼭 알아야 할 지식인 동기(Synchronous)와 비동기(asynchronous)에 대해 공부를 하게 되었다.
Javascript는 기본적인 싱글 스레드 언어!
이 글을 보는 사람 중에 저처럼 입문한 지 얼마 안 되신 분은 싱글 스레드란 말이 생소할 수도 있다. 쉽게 말하자 Javascript는 기본적으로 두 가지 일을 동시에 하지 못한다. 즉 한 개의 함수가 동작하고 있으면 다른 함수는 동작하지 않는다는 의미이다.
동기란(Synchronous)란?
앞서 말한 Javascript의 기본적인 동작 방식은 동기 형태로 동작한다. 우선 동기(Synchronous) 의 사전적인 의미는 동시에 일어난다는 의미이다. 즉 한 가지 동작이 실행되면 동작의 결과를 얻을 때까지 다른 일을 할 수 없다는 것이다. 예를 들면 인터넷으로 옷을 주문한 후에 옷을 받을 때까지 아무 일도 하지 못한다는 뜻이다. 하지만 일하지 못하는 시간 동안 해야 할 일이 있을 수도 있다.
비동기(asynchronous)의 등장? - 비동기적 처리가 필요한 이유
앞서 말한 동기(Synchronous)에 방식을 설명하면서 나왔었던 문제처럼 Javascript에서의 동시성의 문제는 풀어야 할 문제였다. 사전적인 뜻은 동기(Synchronous)에 반대되는 말로 동시에 일어나지 않는 것을 의미한다. 즉 비동기(asynchronous)의 동작 방식을 사용하면 응답받는 시간 동안 다른 일을 처리할 수 있다. 자세한 설명에 앞서 이해를 돕기 위해 Javascript의 engine에 대한 이해가 필요하다.
Javascript Engine이란?
Javascript Engine은 Call Stack과 Memory heap를 통해 Javascript의 코드의 실행을 관리하는 역할을 한다.
- Memory heap : 메모리의 할당이 이루어진다. -참조타입과 데이터 저장
- Call Stack : 코드의 실행 순서에 대한 기록이 쌓이는 곳 - Javascript코드의 실행 순서가 저장
마무리
Call Stack에 코드의 실행 순서가 쌓이게 되고 한 개씩 실행하다 보면 시간이 오래 걸리는 순서가 있을 것이다. 이러한 긴 시간을 요구하는 작업이 있으면 기다리는 시간 동안 다음의 실행 순서가 실행한다면 총 실행 시간이 줄 수 있을 것이다. 실행을 순서대로 할 수 있는 동기 방식은 직관적이며 설계하는 것이 쉬웠지만, 실행 순서에 대한 제약이 있었다. 이러한 문제를 해결하기 위해 비동기 동작 방식에 대해 알아보았지만 설계를 하는 데 있어서 더 복잡하다고 생각하였다. 효율적으로 프로그래밍하기 위해 적재적소에 맞는 동작 방식을 사용해야 할 것이다.
'Languages > Javascript' 카테고리의 다른 글
| [Javascript]배열 안의 요소를 더하는 여러가지 방법(배열의 합, reduce) (4) | 2023.05.19 |
|---|---|
| [Javascript]JSON 데이터의 키의 값을 추가 및 삭제하기 (0) | 2023.05.14 |
| [Javascript]배열(Array)에서 중복 요소 찾기 - filter(), indexOf() (4) | 2023.02.08 |
| [Javascript]화살표 함수(Arrow Function) 사용하기 (2) | 2023.01.17 |
| [프로그래머스]마법의 엘레베이터(JavaScript) (7) | 2023.01.06 |