변경 사항이 적용되기 전에 `console.log()`에 변경된 배열 값이 표시되는 이유는 무엇입니까?

Console.log()가 변경된 배열 값을 너무 일찍 표시함

프로그래밍에서는 자주 변수를 조작하고 해당 값을 콘솔에 기록하여 추적합니다. 변화. 그러나 배열의 경우 변경이 이루어지기 전에도 console.log()가 배열의 수정된 값을 출력하는 예상치 못한 동작이 발생합니다.

이 현상은 다음 코드 조각에서 관찰할 수 있습니다.

var A = [2, 1];
var C = A;
console.log(C); // [1, 2]
A.sort();
console.log(C); // [1, 2]

이 예에는 다른 변수 C에 할당된 두 요소가 있는 배열 A가 있습니다. C를 기록하면 처음에는 원래 값 [1, 2]가 표시됩니다. 그러나 A에서 sort() 메서드를 호출하면 변경 사항이 A에 적용되었음에도 불구하고 C에서도 정렬된 값 [1, 2]가 표시되는 것을 볼 수 있습니다.

동작 이해하기

이 동작은 console.log()에 해당 값의 복사본 대신 개체에 대한 참조가 전달되기 때문에 발생합니다. 어레이를 기록하면 콘솔에 메모리의 어레이에 대한 참조가 표시되며 이는 어레이 변경에 따라 업데이트됩니다.

이를 설명하기 위해 다음 수정된 코드를 고려하십시오.

var A = [2, 1];
var C = JSON.parse(JSON.stringify(A));
console.log(C); // [1, 2]
A.sort();
console.log(C); // [2, 1]

배열 A를 JSON 문자열로 변환한 다음 다시 배열로 변환하여 메모리에 새 개체를 만듭니다. 이는 이제 C가 A의 원래 값의 복사본을 보유하고 있음을 의미합니다. A를 정렬하면 C는 별도의 개체이므로 변경되지 않은 상태로 유지됩니다.

MDN의 경고

이 동작은 특히 Chrome 및 Firefox와 같은 최신 버전의 브라우저와 관련이 있습니다.

MDN warns: ... at the moment you open the console.

이는 콘솔에 표시되는 기록된 값이 기록 당시 개체의 실제 값을 나타내지 않을 수 있음을 의미합니다. 대신 콘솔을 처음 열었을 때의 값이 표시될 수 있어 혼란을 초래할 수 있습니다.

결론

배열로 작업할 때는 다음 사항이 중요합니다. console.log()의 참조 전달 동작을 인식합니다. 조기 변경 위험 없이 배열의 실제 값을 기록하려면 먼저 JSON.parse() 및 JSON.stringify() 메서드를 사용하여 배열의 전체 복사본을 생성하는 것이 좋습니다.

위 내용은 변경 사항이 적용되기 전에 `console.log()`에 변경된 배열 값이 표시되는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!