[Javascript] 일치하는 문자열 확인하는 .indexOf() 의 주의점

두 문자열에 일치하는 문자가 있는지 확인하는 함수 중 가장 널리 쓰이고 있는 .indexOf()

이 함수를 사용할 때 중요한 점은 비교대상 문자열이 무엇인지 잘 인지하고 있어야 한다는 점이다.
(안그러면 내가 원하는 결과값이 안나올 수 있어요...)

 

간단한 예로

aGroupStr 에는 ',' 로 이어붙인 문자열 "우리,나라,만세" 가 있고
bGroupStr 에는 단어 "우리" 가 있다고 했을 때,

aGroupStr 입장에서 bGroupStr 문자가 자기한테 있는지 확인하는거랑
bGroupStr 입장에서 aGroupStr 문자가 자기한테 있는지 확인하는거랑 리턴되는 값이 다르다.

let aGroupStr = "우리,나라,만세";
let bGroupStr = "우리";

console.log("aGroupStr 입장 : " + aGroupStr.indexOf(bGroupStr)); // 0
console.log("bGroupStr 입장 : " + bGroupStr.indexOf(aGroupStr)); // -1

브라우저 확인 값

 

jQuery 3.1 release note 에서 표준화 한 format 을 따르면 [참고]

jQuery commit message

"우리,나라,만세" 입장에서는 "우리" 가 있다고 생각했고,
"우리" 입장에서는 "우리,나라,만세" 가 없다고 생각하고 있다.

 

이럴 땐 다양한 해결방법이 있겠지만, 홈주는 javascript array function 중 하나인 .some() 을 이용하여
배열 요소 중 하나라도 특정 조건을 만족하는지 판단하는 로직으로 개발하였다.

let aGroupArray = ['우리','나라','만세'];
let bGroupArray = ['우리','나라'];

aGroupArray.some(function(item) {
    return bGroupArray.indexOf(item) > -1;
})

브라우저 확인 값

 

주체가 무엇이냐에 따라 내가 생각하는 결과값이 다르게 리턴될 수 있음을 명심하고,
적절한 상황에 적절한 함수를 사용하는 것이 바람직하다. 는 것을 또 한 번 깨닫는 시행착오였다.

메모메모 :)