JS에서 indexOf 의 동작에 관해서
조회수 1151회
JS 공부 중 배열의 indexOf에 대해 이해가 안되는게 있어서 질문드립니다.
const o = { name: "Jerry" };
const arr = [1, 5, "a", o, true, 5, [1, 2], "9"];
arr.indexOf({ name: "Jerry" }); // -1
arr.indexOf(o); // 3
arr.indexOf([1, 2]); // -1
제가 궁금한 것은
o
와{ name: "Jerry" }
의 참조가 서로 일치하지만arr.indexOf({ name: "Jerry" })
가 -1을 반환하는 이유는 배열안에 저 객체가 직접 존재하지 않아서 인가요?arr.indexOf([1, 2]);
가 왜 -1을 반환하는 건가요? 분명arr
안에는 [1, 2] 가 존재하는 것 아닌가요?
-
(•́ ✖ •̀)
알 수 없는 사용자
1 답변
-
비교하고 계신 것들이 하필 객체인데 indexOf()는 객체 인스턴스를 엄격하게 비교하기 때문에 그렇다고 합니다.
const o
에 담긴 객체와arr.indexOf()
에 담긴 객체는 겉보기는 똑같지만 객체의 인스턴스가 다르므로 서로 다른 별개의 객체들입니다. 따라서 둘을 같다고 할 수가 없습니다.const arr
안에 있는[1, 2]
와arr.indexOf([1, 2])
의 경우도 마찬가지입니다.// 콘솔에서 돌려 보세요. const A = {name: "A"}; /* 이 시점에서 인스턴스 1개 */ A === {name: "A"}; /* 비교하려는 과정에서 새 인스턴스가 1개 더 생김, 둘은 다름, 결과는 false */ [1, 2] === [1, 2]; /* 이것도 같은 이치로 false */
답변
- 배열 안에 그 객체가 직접 존재하지 않아서라기보다, 배열 안에 존재하는 그 객체 인스턴스를 찾지 않기 때문입니다.
arr.indexOf({ name: "Jerry" })
는arr
배열 안에서 (우연의 일치로{ name: "Jerry" }
를 내용으로 갖는) 새 인스턴스를 찾아달라는 명령입니다. 방금 새로 만든 인스턴스를 기존의 배열 안에서 찾아 달라고 하면 없다고 할 수밖에 없습니다. - 1번과 같은 원리입니다. 실제로
arr
안에는[1, 2]
의 내용을 가진 인스턴스가 존재하지만arr.indexOf([1, 2])
를 했을 때는 그 인스턴스를 찾는 게 아니라 별도의 인스턴스(우연히[1, 2]
라는 내용을 갖는)를 찾으려고 시도하게 됩니다. 결과는 "없음"이 되지요.arr.indexOf(o)
는 작동하잖아요?o
라는 이름을 가진 바로 그걸 찾으려고 시도하니 결과가 나오는 겁니다.
저도 답변 달면서 공부가 되었네요. 도움이 되면 좋겠습니다.
- 친절한 답변 정말 감사드립니다. ㅎㅎ 그러면 아마 객체를 찾으려고 한다면 대부분 안된다고 생각을 하고 있으면 되나요? 알 수 없는 사용자 2018.9.4 11:18
- 객체를 찾거나 참조하거나 하려면, const o의 사례처럼, 그 객체가 어딘가에서 이름을 한 번 부여받은 다음, 배열 안에 들어가든 검색에 걸리든, 오직 그 이름으로만 다루어져야 하는 거죠. "내용"으로 찾으려면 (답변글에 링크한 스택오버플로 질문의 답변들처럼) 삽질을 해야 하고요. 엽토군 2018.9.4 11:19
- 이해했습니다. 감사합니다.! 알 수 없는 사용자 2018.9.4 11:22
- 음.. 봐도 여전히 어렵네요 ㅜㅜ 감사합니다! 알 수 없는 사용자 2018.10.5 15:39
- 배열 안에 그 객체가 직접 존재하지 않아서라기보다, 배열 안에 존재하는 그 객체 인스턴스를 찾지 않기 때문입니다.
댓글 입력