[javascript] callback function

'use strict';

// javascript 는 synchronous.
// 호이스팅이 끝난 후 코드를 실행한다.
// hoisting : var, function declaration
//      모든 함수는 실행될 때 가장 먼저 선언된다.

// Synchronous callback
function printImmediately(print) {
    print();
}

// Asynchronous callback
function printWithDelay(print, timeout) {
    setTimeout(print, timeout);
}

console.log('1');
setTimeout(() => console.log('2'), 1000);
console.log('3');

printImmediately(() => console.log('hello'));
printWithDelay(() => console.log('async callback'), 2000);

// Callback Hell example
class UserStorage {
    loginUser(id, password, onSuccess, onError) {
        setTimeout(() => {
            if(
                (id === 'ellie' && password === 'dream') ||
                (id === 'coder' && password === 'academy')
            ) {
                onSuccess(id);
            } else {
                onError(new Error('not found'));
            }
        }, 2000);
    }

    getRoles(user, onSuccess, onError) {
        console.log(`user: ${user}`);
        setTimeout(() => {
           if(user === 'ellie') {
               onSuccess({name: 'ellie', role: 'admin'});
           } else {
               onError(new Error('no access'));
           } 
        });
    }
}

const userStorage = new UserStorage();
const id = prompt('enter your id');
const password = prompt('enter your password');
userStorage.loginUser(
    id, 
    password, 
    user => {
        userStorage.getRoles(
            user, 
            (userWithRole) => {
                alert(`Hello ${userWithRole.name}, ${userWithRole.role}`);
            }, (error) => {
                console.log(error);
            }
        );
    },
    error => {console.log(error)}
);
// 콜백지옥의 문제점
//  한눈에 알아보기 어려움
//  에러발생시나 디버깅이 어려움