[javascript] “비동기 이벤트”의 정의를 이해하기 쉽습니까? [닫은]

나는이 용어를 많이 접했고 인터넷 검색 이후에도 그것이 정확히 무엇을 의미하는지 여전히 이해할 수 없습니다. 누군가가 제공 할 수있는 비동기 이벤트가 무엇인지에 대한 이해하기 쉬운 (이상적으로는 예제 포함) 정의가 있습니까?

감사!



답변

비 프로그래밍 예 :

동기식
당신은 저녁에 피자를 원하고 당신은 냉동 종류가 아닙니다. 그래서 길드를 화나게하는 WOW 플레이를 그만둬야합니다. 당신은 부엌에 가서 반죽을 만들고, 소스로 덮고, 치즈를 추가하고, 당신이 가장 좋아하는 베이컨 토핑을 질식시킵니다. 오븐에서 10 분 더 피자를 만드는 데 20 분을 보냈습니다. 타이머가 울리고 뜨거운 파이를 꺼냅니다. 컴퓨터 앞에 앉아서 피자를 먹고 급습을 계속할 수 있습니다.

비동기식
WOW를 플레이하는 동안 저녁 식사로 피자를 원합니다. 5 번째 모니터에서 브라우저 창을 엽니 다. 피자 웹 사이트를로드하고 베이컨 그리스 마늘 소스를 곁들인 치즈 베이컨 피자를 추가로 주문합니다. 습격으로 돌아가서 20 분 후 초인종이 울립니다. 당신은 피자를 얻습니다. 컴퓨터 앞에 앉아 피자를 먹고 급습을 계속합니다.

그렇다면 차이점은 무엇입니까? 한 가지 방법은 귀중한 WOW 시간을 20-30 분 낭비하고 다른 방법은 $ 20와 팁을 낭비하는 것입니다.


답변

페이지는 서버에서 인터넷 어딘가에있는 클라이언트 브라우저로 전달됩니다. 브라우저는 화면에 페이지를 그렸고 누군가 또는 어떤 것이 그것을보고 있습니다. 기다리는 게임입니다. 눈이 앞뒤로 이동하면서 빠른 점프로이 부분이나 그 세부 사항을 받아들이고, 때때로 옆으로 돌진 한 다음 화면에서 멀어지면서 주변 환경의 산만 함을 조사합니다. 시계가 똑딱입니다. 사용자가 비활성 상태로 마우스를 가져 가면 페이지가 부드럽고 수동적으로 빛납니다. 손은 마우스 위로 느슨하게 드리워지고, 목은 아래로 구부러지고, 페이지가 제공해야하는 매력적인 무언가에 점점 더 집중하게됩니다.

갑자기 아무런 경고없이 마우스의 손이 약간 뻣뻣 해지고 테이블의 거친 표면 위의 작은 플라스틱 범프를 찌르기 시작하면서 커서가 움직이기 시작합니다. 마우스가 움직이면 화면의 대리자가 페이지 내용에있는 흥미로운 이미지와 재치있는 말을 지나쳐 가까이 모방하여 움직입니다. 결국 결정이 내려지고, 움직임이 멈추고, 근육 하나 또는 둘이 약간 수축되고, 끈질긴 손가락으로 마우스 버튼을 눌렀습니다. 마우스의 마이크로 스위치는 전자적 충동을 유발하고 갑자기 브라우저가 무슨 일이 일어 났는지 인식하게됩니다. 마우스 클릭.

이 모든 것에서 사용자가 페이지를 응시하는 동안 수행 한 모든 작업은 브라우저, 웹 페이지의 모든 클라이언트 코드, 서버에있는 모든 것에 완전히 예측할 수없는 방식으로 발생했습니다. 인간 행동 사이에는 알 수있는 “대기 시간”이 없었습니다. 따라서 사용자의 컴퓨터에 연결된 장비에 의해 전송 된 동작 은 예측 가능한 시계에 따라 발생 하지 않고 발생 했을 때 발생 했습니다. 즉, 비동기 적으로 발생했습니다 .


답변

인터뷰가 끝날 때를 생각하면 그들은 “우리에게 전화하지 마십시오. 전화하겠습니다”라고 말합니다. 이것이 비동기 이벤트의 본질입니다.

일반적으로 함수를 정의하고 명시 적으로 함수를 호출합니다. 프로그램은 1 행에서 시작하여 2 행으로 시작하는 구조를 가지고 있으며 일부 조건부 코드 및 반복, 함수 호출 등을 제외하고는 단순하고 라이너 동기식 구조가 있습니다.

그러나 어떤 경우에는 프로그램의 직접 제어를 벗어난 이벤트에 의해 트리거되는 작업, 사용자 인터페이스 이벤트 (사용자가 마우스 클릭) 또는 네트워크 이벤트 (누군가 연결 시도)와 같이 프로그램 외부에서 발생하는 작업이 있습니다. 귀하의 서버). 코드는 이러한 이벤트를 직접 생성하지 않습니다. 이들은 사용자 인터페이스 장치 및 기타 시스템의 모니터링을 기반으로하는 OS에서 프로그램 외부에서 생성되는 경우가 많습니다. 이를 비동기 이벤트라고합니다.

“전화하지 마세요. 전화 할게요”라고 기억하세요.


답변

“프로그래밍에서 비동기 이벤트는 기본 프로그램 흐름과 독립적으로 발생하는 이벤트입니다. 비동기 작업은 비 차단 방식으로 실행되는 작업으로, 기본 프로그램 흐름이 처리를 계속할 수 있도록합니다.”

“Ajax를 사용하면 웹 애플리케이션이 기존 페이지의 표시 및 동작을 방해하지 않고 백그라운드에서 비동기 적으로 서버에서 데이터를 검색 할 수 있습니다.”

편집 및 저장을 클릭하면 비동기 적으로 발생합니다.


답변

비동기 이벤트는 애플리케이션의 기본 스레드 외부에서 실행되는 이벤트입니다.

이해하는 가장 좋은 방법은 동 기적으로 실행되는 이벤트와 비교하는 것입니다. 가장 일반적인 예는 웹 페이지를로드하는 것입니다.

이 페이지로 이동했을 때 링크를 클릭하고 페이지가로드 될 때까지 기다렸으며로드가 완료 될 때까지이 페이지와 상호 작용하거나 사용할 수 없었습니다. 대조적으로이 페이지에 일부 사용자 작업과 연결된 AJAX 이벤트 (즉, 비동기 JavaScript 및 XML 이벤트)가있는 경우이 페이지는 다른 작업이 진행되는 동안 병렬로 (이론적으로) 다른 소스의 일부 데이터를 비동기 적으로로드합니다.

두 개의 동기 이벤트 (A 및 B)가있는 예 : 첫 번째 A는 작업을 수행합니다. A가 끝나면 B는 무언가를합니다.

두 개의 비동기 이벤트 (A 및 B)가있는 예 : A와 B 모두 동시에 작업을 수행하고 두 이벤트 모두 다른 이벤트를 기다리지 않습니다.


답변

다음은 자바 스크립트에서 비동기 작업의 예입니다 (JavaScript 콘솔을 열어야 함).

console.log('One!');
setTimeout(function(){console.log('Two!');},0);
//Doesn't wait
console.log('Three!');};

//OUTPUT:
//One!
//Three!
//Two!

에 대한 호출 console.log('Two!')은 이후에 발생하는 나머지 코드를 차단하지 않고 실행됩니다.

실제 시나리오에서는 setTimeout을 웹 페이지의 버튼을 클릭하는 사람으로 바꿉니다. 버튼 클릭에 대한 응답은 페이지 렌더링과 같은 다른 코드 실행을 차단하지 않고 결국 발생합니다.


답변

간단히 말해, 알 수없는 시간 후에 발생하는 일을 의미하므로 즉각적인 결과를 기대하지 마십시오.

예를 들어 “엄마, 5 달러 주실 래요?”

돈을 위해 손을 뻗는 것은 그녀가 나에게 돈 (동기식)을 제공함으로써 즉시 응답하기를 기대하는 것입니다.

현실적으로, 그녀는 잠시 나를 쳐다 본 다음 (비동기) 원할 때 응답하기로 결정합니다.