> 웹 프론트엔드 > 프런트엔드 Q&A > es6에서 객체에 특정 속성이 있는지 확인하는 방법

es6에서 객체에 특정 속성이 있는지 확인하는 방법

青灯夜游
풀어 주다: 2022-04-11 15:15:18
원래의
5036명이 탐색했습니다.

판단 방법: 1. "object.property name!== 정의되지 않음" 문을 사용하여 반환 값이 true인 경우 개체에 특정 속성이 있는 것입니다. 2. 다음에서 "'속성 이름'을 사용합니다. object" 문, true를 반환하는 경우 그러면 특정 속성이 있습니다. 3. "object.hasOwnProperty('property name')" 문을 사용합니다.

es6에서 객체에 특정 속성이 있는지 확인하는 방법

이 튜토리얼의 운영 환경: Windows 7 시스템, ECMAScript 버전 6, Dell G3 컴퓨터.

es6 객체에 특정 속성이 있는지 확인

방법 1: 점(.) + 정의되지 않음을 결정

객체의 속성 값은 점이나 대괄호를 통해 얻을 수 있음을 알고 있습니다. 객체, 속성이 존재하지 않으면 정의되지 않은 값을 반환합니다. 이 메서드는 지정된 개체의 고유 속성과 상속된 속성을 확인할 수 있습니다. 개체 자체에 감지된 속성이 없고 해당 속성이 프로토타입 체인에 있는 경우 프로토타입 체인의 속성 값이 반환됩니다.

// 创建对象
let obj = {
    name: 'Scarlett',
    age: 37
}
console.log(obj.name !== undefined)  // true 自身属性存在
console.log(obj.gender !== undefined)  // false gender属性不存在

// 在原型上添加一个可枚举属性
Object.prototype.nationality = 'America'

// 在obj对象上添加一个不可枚举属性
Object.defineProperty(obj, 'occupation', {
    value: 'actress',
    enumerable: false
})
로그인 후 복사

간단히 Object.propertyName !== undefound의 반환 값을 사용하여 객체에 특정 속성이 포함되어 있는지 확인할 수 있습니다. 그러나 한 가지 상황이 있습니다. 즉, 속성 이름이 존재하고 속성 값이 정의되지 않은 경우 원하는 결과가 반환되지 않습니다.

// 新增一个值为undefined的属性
obj.birthday = undefined

console.log(obj.birthday !== undefined)  // false
로그인 후 복사

음, in 연산자를 사용하여 이 문제를 해결할 수 있습니다.

방법 2: 연산자

이 방법은 특정 속성이 지정된 객체의 고유 속성과 상속 속성에 존재하는지 여부를 확인하고, 존재하는 경우 true를 반환할 수 있습니다. in 연산자는 프로토타입 체인의 속성도 감지할 수 있습니다.

'name' in obj  // true 自身属性存在
'occupation' in obj  // true 不可枚举属性存在
'nationality' in obj  // true 继承属性
'birthday' in obj  // true 值为undefined的属性
로그인 후 복사

in 연산자의 구문도 매우 간단합니다. 범위와 효과는 점(.) 또는 대괄호([])와 동일하지만, 정의되지 않은 값을 가진 속성도 정상적으로 판단할 수 있다는 점이 다릅니다. .

  • 위 두 가지 방법의 한계는 자신의 속성과 프로토타입 체인의 속성을 정확하게 구분할 수 없다는 것입니다. 자신의 속성이 존재하는지 확인하려면 Object.hasOwnProperty()가 필요합니다.

방법 3: Object.hasOwnProperty()

Object.hasOwnProperty()는 지정된 개체 자체에 특정 속성(상속되지 않음)이 포함되어 있는지 확인하고 부울 값을 반환하는 데 사용됩니다.

obj.hasOwnProperty('name')  // true 自身属性
obj.hasOwnProperty('occupation')  // true 不可枚举属性
obj.hasOwnProperty('birthday')  // true
obj.hasOwnProperty('nationality')  // false 原型链上继承的属性
로그인 후 복사

이 메소드는 상속된 속성을 필터링하고 감지된 속성이 자체 속성인 경우 true를 반환합니다.

【관련 추천: javascript 비디오 튜토리얼, web front-end

위 내용은 es6에서 객체에 특정 속성이 있는지 확인하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿