Chrome, Firefox 및 Safari에서 콘솔 로그에 다른 값이 표시되는 이유는 무엇입니까?

Chrome, Firefox 및 Safari의 콘솔 개체 값 차이

JavaScript에서 개체는 참조로 저장됩니다. 즉, console.log가 호출됩니다. 객체 인수를 사용하면 객체 참조를 기록합니다. 이로 인해 콘솔에서 개체를 볼 때 놀라운 동작이 발생할 수 있습니다.

Firefox의 Firebug에서 개체를 로깅하면 일관되게 올바른 값이 표시됩니다.

Object { bar=1111 }
1111

Object { bar=2222 }
2222

그러나 Chrome 및 Safari의 콘솔에서는 다른 동작이 관찰됩니다.

Object { bar=2222 }                      // Object shows updated value
1111                                      // Attribute value remains unchanged

Object { bar=2222 }                      // Object shows updated value
2222                                      // Attribute value is correct

이러한 불일치는 첫 번째 console.log 호출 후 객체를 캐시하기 위한 Chrome(및 WebKit을 사용하는 Safari)의 설계 결정에서 비롯됩니다. 캐시된 값은 그 동안 객체가 업데이트되더라도 모든 후속 console.log 호출에 사용됩니다.

이러한 혼란을 피하려면 다음과 같이 객체 값을 기록하기 위해 객체가 아닌 메서드를 사용하는 것이 좋습니다.

console.log(JSON.stringify(foo));      // Serializes the object into a JSON string

또는 유사한 기능을 제공하는 Chrome의 toJSON 및 valueOf 메소드를 사용할 수 있습니다.

console.log(foo.toJSON());                // Invokes the object's `toJSON` method (if defined)
console.log(foo.valueOf());               // Invokes the object's `valueOf` method (if defined)

이러한 기술을 사용하면 콘솔에 표시되는 값이 물체의 실제 상태와 일치합니다.

위 내용은 Chrome, Firefox 및 Safari에서 콘솔 로그에 다른 값이 표시되는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!