Google Chrome의 console.log()가 배열 및 객체에 일관되지 않은 동작을 나타냄

문제 이해

Google Chrome에서 코드를 디버깅하는 동안 다음과 같은 문제가 발생했습니다. 중첩된 배열을 처리할 때 console.log()가 이상하게 동작하는 것을 관찰했습니다. 배열이 로그될 때, 로깅 후 내부 값을 수정하면 로깅 당시의 값 대신 업데이트된 값이 로그된 출력에 반영됩니다. 이 동작은 Firefox에서는 없었습니다.

추가 조사 결과 로드 중에 Chrome 콘솔이 열려 있을 때 불일치가 발생하는 것으로 나타났습니다. 콘솔이 처음에 닫혔다가 페이지가 로드된 후 열린 상태에서 console.log()는 로깅 당시 배열의 실제 값을 표시했습니다.

이상 현상 추적

철저한 조사 끝에 이 동작은 Webkit에서 버그로 인정된 것으로 나타났습니다. 그러나 2012년 8월에 수정 사항이 구현되었지만 Google Chrome에는 아직 출시되지 않았습니다.

Chromium 개발자의 관점

Chromium 개발자는 이 버그에 대해 댓글을 달며 콘솔에 개체 복제가 발생할 수 있다고 표현했습니다. 실현 가능하지 않습니다. 또한 정확한 값을 유지하기 위해 객체 속성 변경을 수신하는 것은 실용적이지 않습니다.

설명

console.log()의 현재 구현은 콘솔에 객체를 표시할 때 객체 복제를 방지합니다. 대신, 로깅하는 동안 간략한 미리 보기가 생성되어 개체 속성의 스냅샷을 제공합니다. 이는 콘솔이 이미 열려 있는 경우에만 발생하며, 이는 콘솔의 초기 상태에 따른 동작의 불일치를 설명합니다.

결론

Google Chrome의 console.log()에서 이러한 일관되지 않은 동작은 콘솔 내에서 객체 처리가 구현되었기 때문입니다. 미리보기는 로깅 당시 개체의 값을 반영하므로 예상되는 동작은 그대로 유지되어야 합니다. 개발자는 이 동작을 인식하고 가능하면 대체 디버깅 방법을 사용해야 합니다.