비동기 동기 헷갈려요..

Question

자바스크립트에서 비동기처리를 위해(?)콜백, promise, async/await 를 쓴다고 보았습니다.여러 유튜브, 블로그들을 보면서 혼란스러운게…자바스크립트는 원래 싱글스레드로 동기적 방식으로 처리가 되는데왜 비동기처리를 위해 위의 기능(?)을 사용한다고 하는데 그 사용 방법이 A처리 후 B가 수행되도록 코드를 짜나요??A 처리 후 B가 수행되는 것이 동기적 방식이고..비동기처리를 위해 사용하지만 동기적 방식으로 작동되도록 사용된다는 게…위의 처리를 하는 동안 별도의 작업 C가 기다리지 않고 실행되기 위해서 쓰는건가요??그렇다면 순서대로 처리가 되어야하는 작업에서는 굳이 위의 방식을 사용하지 않고, 순서대로 코드를 짜면 문제없나요??요약하자면.. 비동기처리를 위해 사용된다고 하는데 왜 실행되는 방식은 동기적인지의 질문입니다!

토끼왕 · Answer

여러 비동기 작업중에서 순서가 중요한 경우가 있어서 그렇습니다. 그리고 그 모든 여러 비동기 작업들은 메인 스레드 동작을 막지 않기 위함 입니다. 즉 async 함수는 비동기 함수로써 Promise를 반환하고 메인 스레드를 막지 않습니다. 하지만 이 비동기 함수 안에서의 await은 여러 비동기 함수들사이에 순서가 중요할 때 사용합니다. 한마디로 그냥, Promise.then().then().....catch() 쓰기 불편했다 이말입니다.

하태연 · Answer

이게 직접 해봐야지 와닿지.. 말로만 들어서는 헷갈리실겁니다.검색해보시면 예제들 있는데 왜 비동기 쓰셔야 하는지 테스트 해보시면 바로 이해하실겁니다.

Clickin · Answer

요 블로그가 좀 설명이 자세하니 한번 읽어보시고요https://velog.io/&#64;chojs28/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EB%8F%99%EC%9E%91-%EC%9B%90%EB%A6%AC%EC%99%80-%EB%B9%84%EB%8F%99%EA%B8%B0-%EC%B2%98%EB%A6%AC%EC%9D%98-%EC%9B%90%EB%A6%AC-Event-Loop-Task-Queue비동기와 동기의 차이가 대체 뭐냐? 하시면 좀 더 알기 쉽게 설명해드릴 수 있겠습니다.동기적 방식이라는건 다른 task를 호출했을 때 무작정 끝날 때까지 기다리는겁니다. 이걸 그래서 영어로 bloking이라고 부르고요반면 비동기 방식은 다른 task에게 심부름을 시키고 자신은 다른 작업을 하는겁니다.그래서 non-blocking이라고 하고요현실의 상황을 예로 들어보죠.어머니가 저녁으로 돈까스를 만들어주신다고 합니다. 근데 튀김가루가 없네요. 자식한테 마트가서 튀김가루를 사오라는 task를 시킵니다. 이때 자식이 튀김가루를 사올 때까지 어머니가 가만히 기다리면 동기식 방식, 튀김가루를 사오는 동안 고기를 자르고 연육하고 밥을 안치고 등등의 작업을 하면 비동기식 방식입니다.콜백 함수는 튀김가루를 사온 이후의 작업을 지정해주는거고요. 처음에는 콜백 함수로만 비동기 구현이 가능했는데 promise라는 게 나오고 세상이 달라졌습니다.값을 나중에 받을거다 하는 promise가 나오니 튀김가루가 오면 뭘 하겠다는 프로세스를 같은 함수 안에서 정의할 수 있게 되었습니다.

장독깨기 · Answer

console.log(&#34;a&#34;);console.log(&#34;b&#34;);a를 출력하고 b를 출력합니다. 이게 동기입니다. console.log(&#34;a&#34;) 호출이 끝날때까지 기다렸다 console.log(&#34;b&#34;) 를 호출하니 blocking 이라 합니다.function print(callback) { console.log(callback()); }function name() { return &#34;name&#34;; }print(name);console.log(&#34;c&#34;);여기서 name 콜백함수입니다. print 함수에서 callback 함수를 호출하니 콜백이라 합니다.name 을 출력하고 c 를 출력합니다. 역시 동기이고 blocking 입니다. 그니까, 콜백은 비동기를 위해 있는게 아닙니다.function print() { console.log(&#34;a&#34;); }setTimeout( print, 1000);console.log(&#34;b&#34;);b를 출력하고 1초 후에 a를 출력합니다. 비동기라 합니다.setTimeout 함수가 끝날때까지 기다리지 않으니 non blocking 이라 합니다.ajax, axios, fetch, setInterval 이런 함수가 nob blocking 에 해당합니다.print 가 콜백 함수입니다. setTimeout 은 1초 후에 함수를 호출해야하니 인자로 함수를 넘겨줘야 합니다.그니까, 비동기 함수는 후속 처리를 위해 콜백을 사용한다라 보면 됩니다.람다, Promise, async/await, 이런 건 콜백의 변형이라 생각하면 될 거 같습니다.동기, 비동기, 콜백이 좀 구분 되는지 모르겠네요. :)

으악 또 · Answer

서버나 쓰레드 사용 하시면 비동기로 작동 됨 서버 호출 함수(){로그(1)결과 받는 함수(){로그(2)}}로그(3)이면 결과는 1 , 3, 2 로 결과가 이렇게 됨 서버 호출 함수(){로그(1)결과 받는 함수(){로그(2)}}로그(3)서버 호출 함수2(){로그(1-1)결과 받는 함수(){로그(2-2)}}로그(3-2)이런 식이면 1,3,1-1,3-2, (2 또는 2-2) 로 호출이 됨 이유는 먼저 끝나는 호출을 받아서 그럼두가지 경우가 서로 연관성이 없으면 문제가 없지만 2 뜨고 2-2가 떠야 한다면 콜벡으로 만들던지 프로 미슈로 만드는 방법 뿐임콜벡으로 만든다 치면 실행 (() &#61;>{}) 요런 스타일인데 이게 많으면실행(((()&#61;>{})&#61;>{})&#61;>{})요런식으로 더러워짐프로미 슈를 사용하면 Promise.then().then().....catch() 요런식으로 되죠근데 요걸 좀더 파면 더 간단한 수식으로도 되요 그건 기억이 안나네용 찾아보삼

비동기 동기 헷갈려요..

5개의 답변

기타 목록