객체에서의 in 연산자 사용 시 주의사항

객체에서의 in 연산자 사용

in 연산자는 객체의 자체 속성뿐만 아니라, 그 객체가 상속받은 모든 속성을 확인합니다. 

const person = {
  name: 'John'
};

console.log('name' in person); // true
console.log('toString' in person); // true

여기서 person 객체는 name 속성만을 직접 가지고 있지만, toString 메서드는 person 객체의 프로토타입 체인 상에 존재합니다. 따라서 'toString' in person은 true를 반환합니다. 이러한 상황에서 객체의 자체 속성만을 확인하고 싶다면 hasOwnProperty() 메서드를 사용해야 합니다.

console.log(person.hasOwnProperty('name')); // true
console.log(person.hasOwnProperty('toString')); // false

배열에서의 in 연산자 사용

배열에 대해서 in 연산자를 사용할 때는, 이 연산자가 배열의 요소 값이 아닌 인덱스를 기준으로 작동합니다.

const array = ['apple', 'banana', 'cherry'];

console.log(0 in array); // true
console.log(2 in array); // true
console.log(3 in array); // false
console.log('banana' in array); // false

여기서 0, 1, 2는 배열 array의 유효한 인덱스이므로 0 in array와 2 in array는 true를 반환합니다. 반면, 3은 배열의 범위를 벗어난 인덱스이므로 3 in array는 false를 반환합니다. 마지막으로, 'banana' in array는 false를 반환하는데, 이는 'banana'가 인덱스가 아니라 배열의 값이기 때문입니다. in 연산자는 배열의 값이 아닌 인덱스의 존재 여부를 확인하기 때문에 이러한 결과가 나타납니다.

이러한 특성 때문에 배열의 요소가 존재하는지 확인하고 싶을 때는 in 연산자 대신 includes() 메서드를 사용하는 것이 더 적합합니다.

console.log(array.includes('banana')); // true