[JS] 객체의 참조

객체가 아닌 숫자, 문자열, 불 값, null, undefined는 모두 true를 반환합니다.

'str' === 'str';			// true
123 === 123;				// true
false === false;			// true
null === null;				// true
undefined === undefined;	// true

하지만 객체는 다릅니다. 두 객체 모두 비어있다는 점에서 같아 보이지만, 독립된 객체이기 때문에 일치·동등 비교하면 false가 반환됩니다.

{} === {} // false

객체는 모양이 같아도 생성할 때마다 새로운 객체가 생성됩니다. 따라서 같은 객체인지 비교하고 싶다면 기존 객체를 변수에 저장해 두어야 합니다.

const a = {
    name: '김철수',
};
const array = [1, 2, a];
console.log(a === array[2]); // true

// [1, 2, a] 라는 새로운 배열을 만들었기 때문에 모양은 같지만 위의 array와 다름
array === [1, 2, a]; // false

객체는 변수에 저장해두지 않으면 서로 비교할 때 모양이 같게 생겼어도 다 다릅니다. 원시 값들은 모양이 똑같으면 똑같습니다.

메모리관점

객체인 경우엔 변수에는 주소가 저장되어 있고 원시값인 경우에는 그 값이 저장되어 있다고 보시면 될 것 같습니다. 배열 리터럴 [], 객체 리터럴 {} 틀 자체가 다르면 false 입니다.

객체

const a = {
    name: '김철수',
};
const array = [1, 2, a];
console.log(a === array[2]); // true

array === [1, 2, a]; // false

위 코드를 메모리 관점에서 설명하면 [1, 2, a] 라는 배열을 array 이름으로 가져옵니다. array === [1, 2, a];를 작성하면 아래와 같이 이름 없는 [1, 2, a] 라는 배열이 새로 만들어지기 때문에 false를 출력합니다. array의 a는 변수 a를 가리키고 있기 때문에 true로 출력합니다. 객체인 경우 변수에는 주소가 저장되어 있다고 보면 됩니다.

원시값

원시값은 공간이 따로 있는데 그 공간에 1이라는 값이 있고 a와 b가 같은 값을 가리키고 있습니다. 그래서 a와 b를 비교했을 때 값이 같다고 나옵니다.