eventLoop

21779 ワード

function a(callback){
    setTimeout(time2,0)                 // 비동기 코드
    console.log('hello world')          //
    setTimeout(time,0)
    callback()                          // 5
}

// 비동기 코드중 여럿이 같이 있을경우 promise 객체 먼저 실행

console.log(3)

function time2(){

    console.log('hi')
}
function time(){

    console.log('5')
}

a(time)

// 
function jch(){
    console.log('3')
    return 4
}//선언

function jung(){
    console.log('1')
    return jch()
}//선언

function hello(callback){
    jung()
    console.log('5')
    callback('6')
}//선언

const result = jch() // 대입연산자 기준 = 의 오른쪽을 먼저 읽는다 // jch()호출 후 선언
hello(jung) // 호출
console.log(typeof result) // 호출

// console.log() // 호출

// callstack call / stack 

// 선언과 호출을 선언한 부분 호출call

// 힙 콜스택
event loop関連のビデオの推薦:薄い鼻、0秒

callback

// 선언과 호출의 차이 확실히 구분

const 더하기 = (a, b) => a+b
const 함수 = (callback, a, b) => callback(a,b)

// ES6 문법 공부가 필요하구나.. 

function 더하기(a,b){
    return a+b
}
            // 합수 선언내용이 그대로 들어가면된다. 매개변수에 어떤내용이 있느냐...
function 함수(callback,a,b){
    return callback(a,b)
}

함수(더하기,1,2)
// function 아반떼(callback) {
//     console.log('아반떼 go')
//     callback()
// }

// function 소나타(callback) {
//     console.log('소나타 go')
//     callback()
// }

// function 제네시스() {
//     console.log('제네시스 go')    
// }

// 아반떼()    // 1초뒤에
// 소나타()    // 2초튀에
// 제네시스()  // 3초뒤에

// setTimeout(아반떼, 1000)        // 비동기
// setTimeout(소나타, 2000)        // 비동기
// setTimeout(제네시스, 3000)      // 비동기
// 총 걸린 시간. 3초



//아반떼 1초 / 나오고 나서 2초 소나타 / 나오고 나서 3초 제네시스

// function 자동차경주(){
//     아반떼(()=>{
//         소나타(()=>{
//             제네시스()
//         })
//     })
// }

// function 아반떼(callback) {
//     /* ()=>{
//         소나타(()=>{
//             제네시스()
//         })
//      */
//     console.log('아반떼 go')
//     callback()
// }

// function 소나타(callback) {
//     /* 
//     ()=>{
//             제네시스()
//         }
//      */
//     console.log('소나타 go')
//     callback()
// }

// function 제네시스() {
//     console.log('제네시스 go')    
// }


// 자동차경주()


/////////////////////////////////////////////// callback



// function 자동차경주(){
//     아반떼(()=>{
//         소나타(()=>{
//             제네시스()
//         })
//     })
// // }

// function 아반떼(callback) { 
//     setTimeout(callback, 1000)
// }

// function 아반떼(callback) { 
//     setTimeout(()=>{
//         console.log('아반떼 go')
//         callback()
//     }, 1000)
// }

// function 소나타(callback) { 
//     setTimeout(()=>{
//         console.log('소나타 go')
//         callback()
//     }, 2000)
// }

// function 제네시스(callback) { 
//     setTimeout(()=>{
//         console.log('제네시스 go')
//     }, 3000)
// }

// 아반떼(
//     ()=>{
//         소나타(제네시스)
//     }
// )

// 콜백지옥 callback hell


function 아반떼() { 
    return new Promise((resolve, reject)=>{ // background 
        setTimeout(()=>{
            resolve('아반떼 go')
        }, 2000)
    })
}

function 소나타() { 
    return new Promise((resolve, reject)=>{ // background 
        setTimeout(()=>{
            resolve('소나타 go')
        }, 1000)
    })
}

function 제네시스() { 
    return new Promise((resolve, reject)=>{ // background 
        setTimeout(()=>{
            resolve('제네시스 go')
        }, 3000)
    })
}

// 아반떼().then((data)=> {
// console.log(data)
// return 소나타()
// })
// .then((data)=> {
//     console.log(data)
//     return 제네시스()
//     })
//     .then((data)=> {
// console.log(data)
// })
// // promise 객체

async function 자동차(){
    const result = await 아반떼()
    console.log(result)
    const result2 = await 소나타()
    console.log(result2)
    const result3 = await 제네시스()
    console.log(result3)
}

자동차()
// async await 




// function 아반떼(callback) { 
//     setTimeout(()=>{
//         console.log('아반떼 go')
//         callback()
//     }, 1000)
// }

// function 소나타(callback) { 
//     setTimeout(()=>{
//         console.log('소나타 go')
//         callback()
//     }, 2000)
// }

// function 제네시스(callback) { 
//     setTimeout(()=>{
//         console.log('제네시스 go')
//     }, 3000)
// }

// 아반떼(
//     ()=>{
//         소나타(제네시스)
//     }
// )

// 콜백지옥 callback hell


// function 아반떼콘솔(){              //
//     console.log('아반떼 go')
// }

// ()=>{                               // 익명함수
//     console.log('아반떼 go')
// }


// 아반떼(아반떼콘솔)




// function 소나타() {
    
// }

// function 제네시스() {
        
// }


// 자동차경주()


// 비동기를 조작할수 있는 방법 3가지
// 1. callback 
// 2. promise
// 3. async / await