JavaScript not in 연산자

객체는 JavaScript에서 가장 일반적으로 사용되는 키-값 속성입니다. 특정 속성이 있는지 여부를 확인하기 위해 JavaScript는 여러 가지 가능성을 제공합니다. 오늘 포스팅은 자바스크립트에서 객체에 특정 속성이 있는지 없는지 확인하는 방법을 알려드릴 것입니다.

JavaScript에 속성이 있는지 여부 확인

속성은 개체에 저장된 키 값과 쌍을 이룹니다. 객체에는 이러한 속성이 많이 포함될 수 있습니다. JavaScript에 특정 속성이 있는지 여부는 id in object 또는 Object.prototype.hasOwnProperty() 연산자에 의해 결정됩니다.

JavaScript의 Object.prototype.hasOwnProperty()

지정된 속성이 Object에 속하는지 여부를 확인하기 위해 JavaScript에서 제공하는 내장 메서드입니다. 객체를 반복하고 결과에 따라 부울 값을 반환합니다.

통사론:

Object.prototype.hasOwnProperty(prop);

이 함수는 prop을 string 형식의 입력으로 사용합니다. 필수 매개변수입니다. 이 메소드는 값에 관계없이 주어진 속성이 객체에 존재하는지 여부만 확인합니다. 속성 값이 null 또는 undefined인 경우에도 true를 반환합니다. 이 메서드는 배열이 Object의 자손이기 때문에 Array에서도 호출할 수 있습니다. 자세한 내용은 hasOwnProperty() 메서드 문서를 참조하세요.

const inputObject = {
  id: 42,
  name: 'John Doe'
};

console.log(inputObject.hasOwnProperty('name'));
if (!inputObject.hasOwnProperty('email')) {
  inputObject.email = 'Johndoe@gmail.com';
}
console.log(inputObject);

위의 코드 블록에서 id와 name 개체의 두 가지 속성을 정의했습니다. inputObject.hasOwnProperty('name')를 전달하면 inputObject에 name 속성이 있는지 여부를 확인합니다. 반대 조건을 확인하려면 !를 추가하세요. 조건 앞에 있으며 검사를 무효화합니다. 예를 들어, 개체 내부에 존재하지 않는 경우 새 속성을 추가할 수 있습니다. 위의 코드가 제공하는 출력은 아래에서 볼 수 있습니다.

출력:

true
{
  email: "Johndoe@gmail.com",
  id: 42,
  name: "John Doe"
}

JavaScript의 in 연산자

객체 또는 프로토타입 체인이 지정된 속성을 소유하는지 확인하는 JavaScript에서 제공하는 내장 메서드입니다. 객체를 반복하고 결과에 따라 부울 값을 반환합니다.

통사론:

prop in object

이 함수는 prop을 string 형식의 입력으로 사용합니다. 필수 매개변수입니다. 이 메서드는 주어진 속성이나 배열 인덱스가 Object 또는 prototype chain에 있는지 여부만 확인합니다. 이 메서드는 배열이 Object의 자손이기 때문에 Array에서도 호출할 수 있습니다. 자세한 내용은 in 연산자 메서드 설명서를 참조하세요.

hasOwnProperty와 in 연산자의 주요 차이점은 속성이 객체 내부에서 상속되거나 선언되지 않은 경우 이전 연산자가 false를 반환한다는 것입니다. 이에 비해 in 연산자는 개체의 프로토타입 체인에서 지정된 속성을 확인하지 않습니다. 예를 들어 Object 기본 클래스는 hasOwnProperty를 함수로 가지고 있으므로 hasOwnProperty는 false를 반환하는 반면 in 연산자는 true를 반환합니다.

const inputObject = {
  id: 42,
  name: 'John Doe'
};

console.log('name' in inputObject);
if (!('phone' in inputObject)) {
  inputObject.phone = '7878787878';
}
console.log(inputObject);

위의 코드 블록에서 id와 name 개체의 두 가지 속성을 정의했습니다. inputObject에 name을 전달하면 inputObject에 name 속성이 있는지 확인합니다. 반대 조건을 확인하려면 !를 추가하세요. 조건 앞에 체크를 무효화합니다. 예를 들어 개체 내부에 존재하지 않는 경우 phone이라는 새 속성을 추가할 수 있습니다. 위의 코드 조각이 제공하는 출력은 아래와 같습니다.

출력:

true
{
  id: 42,
  name: "John Doe",
  phone: "7878787878"
}