[Error] console.log Execution Order (실행 순서)

해당 문제는 땅따먹기 DFS문제인데 땅을 먹을 때 마다 변화된 땅을 보려 했지만 원하는 값이 나오지 않았습니다.

 

즉, console.log를 활용해서 chrome에서 debugger대신 사용하고 있던 중 문제가 발생하였습니다.

 

console.log의 값이 즉시 발생되는 값이 아니라 setTimeout 을 한것과 같이 값이 나오는 것 이었습니다.

 

다음과 같았습니다.

 

    function  solution(board){
        let  dx=[-1, -1, 0, 1];
        let  dy=[0, 1, 1, 1];
        let  n = board.length;

        const  DFS = (sx, sy) => {
            board[sx][sy] = 0;

            for (let  i = 0; i < 4; i++) {
                let  nx = sx + dx[i];
                let  ny = sy + dy[i];
                if (nx < 0 || ny < 0 || nx > n - 1 || ny > n - 1) continue;
                if (board[nx][ny] === 1) DFS(nx, ny);
            }
        }
    for (let  i = 0; i < n; i++) {
        for (let  j = 0; j < n; j++) {    
            if (board[i][j] === 1) {
                DFS(i,j);
                //****문제****//
                console.log(board);
                //**********//
                //해결
                //1,
                console.log(JSON.stringify(board));
                //2.
                debugger;
            }
        }
    }
}
let  land=    [[1, 1, 1, 0, 0, 1, 0],
            [0, 1, 1, 1, 1, 1, 0],
            [0, 1, 0, 0, 0, 0, 0],
            [0, 0, 0, 1, 0, 1, 1],
            [1, 1, 0, 1, 1, 0, 0],
            [1, 0, 0, 0, 1, 0, 0],
            [1, 0, 1, 0, 1, 0, 0]];
console.log(solution(land));

 

원인

chrome console은 JavaScript 언어가 아니고 Browser에서 제공하는 Web API 입니다.

그래서 JavaScript 동작 을 할 때 call stack이 실행되고 난 후 실행 되는 것이라고 생각 할 수 있었습니다.
정말 당연하게 생각 했던 것에서 문제가 발생한 것이었습니다.

 

해결방법

1. JSON.stringify, parse사용 하기

console.log(JSON.stringify('~~~'));
console.log(JSON.parse('~~~'));

2. debugger; 사용하기

...
debugger;
...

 

Reference
https://medium.com/swlh/console-log-isnt-in-the-javascript-language-2b0f24d57397
https://blog.sessionstack.com/how-does-javascript-actually-work-part-1-b0bacc073cf
https://stackoverflow.com/questions/12737826/javascript-console-log-execution-order
https://jsdev.kr/t/topic/3377/2