JavaScript에서 변수가 어떻게 유지되는지 이해: 값 또는 참조로

JavaScript 또는 프로그래밍에서 변수는 데이터를 저장하는 데 사용되는 컴퓨터 메모리의 위치입니다. 변수는 선언되고(이름, 식별자 지정) 언어에 따라 즉시 또는 나중에 값이 할당될 수 있습니다. 그러면 이 변수는 동일한 값을 명시적으로 다시 명시하는 대신 나중에 프로그램에서 참조될 수 있습니다.

JavaScript에서 데이터는 값 형식으로 전달되며 이러한 값은 기본 값이거나 개체 값일 수 있습니다. JavaScript 개발자로서 JavaScript가 데이터를 처리하는 방법을 이해하는 것은 언어의 강력한 기본을 갖추는 데 중요합니다.

기본 값은 다음과 같습니다.

• 문자열.
• 숫자.
• 부울.
• BigInt.
• 상징.
• 한정되지 않은.

반면에 개체 값은 다음과 같습니다.

• 배열.
• 기능.
• 사물.

이러한 값 유형은 전달될 때 다르게 동작합니다. 아래 스니펫을 고려하세요.

var myName = "프레드";
var otherName = myName;
myName = "애슐리";
console.log(내이름); //애슐리
console.log(다른이름); //프레드

otherName은 myName의 "사본"처럼 보이지만 동일하게 유지됩니다. 실제로 실제로 일어난 일은 otherName에 myName이 할당되었을 때 문자열 "Fred"의 복사본으로 할당된 것이 아니라 새 문자열 "Fred"가 생성되었다는 것입니다. 따라서 myName과 otherName 사이에는 직접적인 링크가 없습니다. 이것이 JavaScript가 기본 값을 전달하는 방법입니다.

개체 값은 다르게 처리됩니다. 아래 스니펫을 살펴보세요.

var myObj = {색상: "빨간색"};
var otherObj = myObj;
myObj.color = "파란색";
console.log(myObj.color); //파란색
console.log(otherObj.color); //파란색

여기서 객체가 생성되어 myObj에 할당된 후 otherObj에 할당되었습니다. myObj의 색상 속성을 변경하여 otherObj 및 myObj 색상 속성이 모두 어떻게 변경되었는지 확인하세요. 이는 개체 값이 참조로 전달되기 때문입니다. myObj는 객체를 직접 참조하지 않고 대신 해당 참조를 가리키며, otherObj에는 실제 객체에 대한 참조인 myObj가 할당됩니다. 따라서 두 변수는 동일한 참조를 가리키기 때문에 동일한 객체에 연결되며, 하나의 변경 사항이 다른 변수에 영향을 미칩니다.

두 개체의 비교(===)가 직접 false를 반환하는 이유는 문자 그대로 두 개의 서로 다른 참조를 비교하는 것입니다. 여기서 myObj === otherObj는 동일한 참조를 비교하기 때문에 true를 반환합니다.

이 글을 통해 JavaScript가 이면에서 어떻게 작동하는지에 대한 새로운 관점을 얻을 수 있기를 바랍니다.

그때까지 버그 없는 상태를 유지하세요.