Skip to content

기글하드웨어기글하드웨어

인터넷 / 소프트웨어 : 윈도우즈, 리눅스, 기타 운영체제, 각종 어플리케이션, 프로그램, 소프트웨어, 인터넷, 인터넷 서비스에 대한 이야기, 소식, 테스트, 정보를 올리는 게시판입니다.

Extra Form

다른 비동기 프로그래밍 언어도 그런건지는 잘 모르겠으나 이게 루프 돌릴때 참 골때립니다.

해보신분은 알겠지만 자바스크립트에서 지연처리를 한다고 하면 setTimeout이나 setInterval을 쓰죠

 

setTimeout(fn, delay)

 

이렇게 쓰면 함수fn이 delay시간(밀리세컨드 단위) 후에 실행이 되는건데 그러면 누구나 상식적으로

 

for(var i = 0; i < 10; i++) {

setTimeout(function() {

console.log(i);    //반복작업 구문 example

}, 1000);

}

 

이런 식으로 쓰겠죠. 그런데 문제는.. 이러면 결과는 1초 후에 10만 열번 출력됩니다. What the..

 

결론적으로 말하면 setTimeout이 기다리거나 말거나 for는 죽어라 루프를 돌리고 setTimeout이 i를 찾을때는 10만 남아있는거죠

여기서 해결책이 두가지입니다. (물론 더 있겠지만..)

 

A : 내부에 함수를 하나 더 만들어서 i를 인자로 입력받습니다. 어려워보이지만 쓰고보면 별거 아닙니다.

 

// 익명함수 버전

for (i=0; i < 3; i++) {

(function(x) {

setTimeout(function() {

console.log(x);

}, 1000*x);

})(i);

}

}

 

// 기명함수 버전

function loop(x) {

setTimeout(function() {

console.log(x);

}, 1000*x);

}

for (i = 0; i < 3; i++) {

loop(i);

}

 

함수로 setTimeout을 감싸고 i를 놓치지 않고 죄다 익명함수의 x라는 변수로 받아서 시간 순서대로 실행되도록 만드는 거죠

오~ 기발한데~ 라고 생각이 들다가도 이게 뭔짓인가 싶습니다(...) 필요한 갯수만큼 setTimeout을 다 만들어놓는거니까요

 

B : 재귀함수를 만듭니다. 백문이 불여일견

 

function start(counter){

if(counter < 10){

setTimeout(function(){

counter++;

console.log(counter);

start(counter);

}, 1000);

}

}

 

start(0);

 

A와 비교하면 for 대신 if, 스코프는 한 단계 줄었습니다. (A도 결국 function 안에 속한다고 치면 말이죠.) 그러나 재귀함수가 그렇듯이 실행되기 시작하면 루프 개수만큼 늘어날테죠. 아무래도 재귀함수 자체가 좀 어려운 개념이다 보니 A 방식을 더 많이 본거 같긴 하네요

 

비동기 이슈로 한차레 골머리를 썩고 나니 ES6를 빨리 공부해야 할것 같습니다. Promise가 그렇게 좋다던데.. 파이썬 공부도 해야 하고 바쁘네요

 

오늘의 밥 아저씨

A: http://goo.gl/LuY4Qe

B: http://goo.gl/82thlY

 

Bob_ross.jpg

 



  • ?
    한걸음 2016.08.22 09:20
    settimeout 에 함수 넣을때 함수가 매개변수로 가지고 가게 만들어도 안되나요?
  • ?
    WebGL 2016.08.22 13:08
    옙, 바로 그 setTimeout이 함수실행 시점을 딜레이시키기 때문에 매개변수를 받는 시점도 늦어집니다
    직접 해보니 undefined만 시간순서에 맞춰서 출력되네요 setTimeout(......)까지는 전달이 되지만 매개변수의 함수까지는 전달이 늦춰지는 것 같습니다.

작성된지 4주일이 지난 글에는 새 코멘트를 달 수 없습니다.


  1. No Image

    구글 드라이브, 휴지통의 파일을 한달 후 삭제

    2020년 10월 13일부터 구글 드라이브의 휴지통 보관 정책이 바뀝니다. 앞으로 휴지통에 있는 파일은 30일 후 자동 삭제됩니다. 지금까지는 사용자가 휴지통을 비우기 전까지는 계속해서 남아 있었지요. 휴지통에 있는 파일만 지워도 용량...
    Date2020.09.18 소식 By낄낄 Reply5 Views1071
    Read More
  2. 기가비트 구성(야곱님 글에 대한 설명)

    단자함에서 거실로 갔다가 다시 단자함으로 돌아오는 구성이라면 4페어를 2페어로 나눠서 구성했을꺼에요. 그러면 그부분에서 100메가급이 되어버립니다. 이부분은 선을 추가 포설해야하는데 그건 난이도가 좀 있으니     이렇게 구성하시...
    Date2020.09.18 일반 Bytitle: 명사수가네샤 Reply3 Views654 file
    Read More
  3. No Image

    티스토리 계정 체계가 카카오계정 기반으로 변경됩니다.

    공지가 길어서 요약하면 1. 지금은 이메일 주소로 로그인하지만 앞으로는 카카오 계정에 연결해야 함. 카카오 계정으로 연결 후 기존 ID 사용 불가. 6개월 후에는 카카오계정으로만 로그인 가능. 2. 2개 이상의 티스토리 계정을 운용하겠...
    Date2020.09.17 소식 By낄낄 Reply3 Views863
    Read More
  4. MSI 듀엣 디스플레이 기능 추가

    MSI 듀엣 디스플레이입니다. iOS 디바이스의 스크린 미러링과 크로스 플랫폼 게임이 가능하게 도와주는 프로그램입니다. 엄밀히 말하면 드래곤 센터나 크리에이터 센터의 추가 기능이겠네요. 크로스 플랫폼 게임의 경우 보조 모니터에 게...
    Date2020.09.17 소식 By낄낄 Reply1 Views850 file
    Read More
  5. No Image

    엑셀 VBA질문

    A파일에서 손으로 전체 셀을 선택해서 ctrl+c하고   B파일에서 메크로 버튼을 누르면 자동으로 지정한 셀에 방금 ctrl+c한 내용을 붙여넣는 메크로를 만들었습니다.   다만 손에 익숙하지 않은 유저들이 [A파일에서 손으로 전체 셀을 선택...
    Date2020.09.16 질문 Byclowl Reply5 Views470
    Read More
  6. 구글, 웹페이지 URL 번역 제공 국가에서 대한민국 제외

    구글 번역 기능중 하나인  웹페이지 URL 번역 서비스 지원 국가에서 대한민국을 제외시켰습니다.   앞으로 구글 웹페이지 URL 번역 서비스를 사용하려면 반드시 크롬 브라우저를 사용하여 크롬 자체의 번역기능을 사용해야 합니다.
    Date2020.09.16 소식 Bytitle: AI깍지 Reply11 Views10931 file
    Read More
  7. No Image

    카카오, 업무 전용 "카톡" 나왔다... 카카오워크 출시

    카카오톡 같은 UI 기반에 화상회의, 전자결재, 근태관리 등이 있다고 합니다 아직까진 오픈채팅 정도의 기능이라고 하며 사실상 국내판 슬랙 같네요 얼마나 대체할 수 있을련지?
    Date2020.09.16 소식 By애옹 Reply8 Views1388
    Read More
  8. No Image

    애플, 구독서비스 끌어모은 '애플원' 발표

    애플이 15일(현지시간) 각종 콘텐츠 구독 서비스를 한데 합친 '애플 원(One)'을 올가을 일부 국가에서 출시한다고 발표했다. 애플 원에는 클라우드 저장공간을 제공하는 아이클라우드, 음악 스트리밍 서비스 인 애플뮤직, 영화&mi...
    Date2020.09.16 소식 By낄낄 Reply2 Views708
    Read More
  9. 틱톡 안드로이드의 취약점, 임의의 코드를 실행

    틱톡 안드로이드 버전에 임의의 코드를 실행하는 취약점이 존재합니다. 4개의 고위험 취약점으로 일단 성공하면 계정을 탈취할 수 있습니다. 17.7.7 버전에선 막혔다고 합니다.
    Date2020.09.16 소식 By낄낄 Reply2 Views798 file
    Read More
  10. No Image

    마우스 휠버튼 클릭 하면 복사/붙여넣기 하는거 GNOME만 되는건가요?

    얼마전에 알게 된 사실인데, 텍스트를 지정(블록)한 뒤 마우스 휠버튼 클릭하고, 텍스트 에디터 등지에 또 한번 휠버튼 클릭하면 붙여넣기가 되더라구요.   현재 우분투(커널만 5.8로 업) 사용중이라 이게 우분투만 그런건지, 혹은 GNOME...
    Date2020.09.15 질문 By뚜찌`zXie Reply3 Views1104
    Read More
  11. 홈페이지 문의사항을 이용해 스팸메일이 자꾸 오는데 어떻게 해야 할까요?

      저희 회사 홈페이지는 이렇게 문의하기 페이지가 있습니다. 내용을 넣고 등록을 누르면 지정된 메일로 문의 내용이 날아오게 되어 있는데요,   며칠 전 부터 이런 메일이 자꾸 오고 있더라구요.   이런 경우는 어떻게 해결을 해야 하는...
    Date2020.09.15 질문 ByBearPD Reply12 Views1031 file
    Read More
  12. 윈앰프 스킨 박물관

    요새 사람들은 알지도 못하겠지만, 하여간 옛날에는 윈앰프라는 MP3 재생 프로그램이 있었고, 그 프로그램의 스킨을 바꿀 수 있었습니다. 어떤 스킨이 있었는지 궁금하시다면 위 링크를 보세요.
    Date2020.09.15 일반 By낄낄 Reply11 Views1793 file
    Read More
  13. 크롬 OS 순정 일반 노트북 설치후 3주 리뷰

    저번에 크롬 OS 순정버전을 일반 노트북에 설치하는 방법을 제가 올렸었습니다. 메인에도 걸어주시고 감사하면서도 신기한 경험이었습니다.   첫주는 별 탈 없이 잘 사용하고 있었는데, 둘째주부터 창들이 하얀색으로 바뀌는 오류를 경험...
    Date2020.09.14 일반 By준0111 Reply9 Views822 file
    Read More
  14. 안드로이드 가상머신(AVD) 생각보다는 속도가 괜찮네요

      워낙 AVD가 악명이 높아서 조금 걱정하긴 했는데 속도 꽤 괜찮네요 물론 고성능 모드로 올려서 작업을 하긴했는데 AVD설정후 처음 부팅시에도 생각보다 빨리 커진걸 감안하면 사양을 받춰주면 그럭저럭 쓸만하긴 한거 같다고 느낍니다 ...
    Date2020.09.14 일반 Bytitle: AIBlackbot Reply3 Views958 file
    Read More
  15. No Image

    바이트댄스, 틱톡 MS·오라클에 매각 안해...소스코드도 제공 못한다

    바이트댄스는 틱톡을 인수하는 미국기업에는 틱톡의 소스코드를 절대로 넘기지 않을 생각이라고 소식통은 밝혔다. 바이트댄스는 이런 방식으로 틱톡을 처리해 중국 정부의 우려를 안심시키고 미국의 매각명령도 회피할 속셈이라고 한다. ...
    Date2020.09.14 소식 By낄낄 Reply4 Views759
    Read More
목록
Board Pagination Prev 1 ... 314 315 316 317 318 319 320 321 322 323 ... 572 Next
/ 572

최근 코멘트 30개

한미마이크로닉스
AMD
MSI 코리아
더함

공지사항        사이트 약관        개인정보취급방침       신고와 건의


기글하드웨어는 2006년 6월 28일에 개설된 컴퓨터, 하드웨어, 모바일, 스마트폰, 게임, 소프트웨어, 디지털 카메라 관련 뉴스와 정보, 사용기를 공유하는 커뮤니티 사이트입니다.
개인 정보 보호, 개인 및 단체의 권리 침해, 사이트 운영, 관리, 제휴와 광고 관련 문의는 이메일로 보내주세요. 관리자 이메일

sketchbook5, 스케치북5

sketchbook5, 스케치북5

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소