중괄호 {} 로 된 자바스크립트 객체에서 키를 찾는 방법은 Object 의 keys 사용, key in Object 활용 그리고 hasOwnProperty를 사용하는 방법이 있습니다.
자바스크립트 키 확인 방법
자바스크립트를 이용하여 프로젝트를 진행하다보면 객체 형태의 데이터를 많이 다루게 되고, 로직에 따라 키 값을 찾아야할 경우가 많습니다. 제시된 3가지 형태에서 편한 방법으로 사용하면 되겠습니다.
- Object.keys + include
- key in Object
- hasOwnProperty
Object.keys + include
Object 모듈을 사용하여 객체의 key 값들을 배열로 가져옵니다. 이 후 배열 중 원하는 키값이 포함되었는지 include를 사용하여 확인합니다.
// 객체 예시
const obj = {
name : "홍길동",
age: 12,
}
// Object.keys + include 조합
const is_existed_1 = Object.keys(obj).includes('name'); // name 키값 존재, true
const is_existed_2 = Object.keys(obj).includes('address'); // address 키값 없음, false
console.log(is_existed_1);
console.log(is_existed_2);
Object.keys(obj) 를 실행하면 obj 객체 안의 모든 키값들을 배열로 리턴합니다.
리턴된 배열에서 include 함수를 통해 원하는 값이 존재하는지를 확인하는 방법입니다.
key in Object
in 연산자를 사용하는 방법으로, 간단하게 사용할 수 있습니다. 다만 속도가 느리다고 알려져있습니다.
const obj = {
name : "홍길동",
age: 12,
}
// in 연산자 활용
const is_existed_1 = 'name' in obj;
const is_existed_2 = 'address' in obj;
console.log(is_existed_1);
console.log(is_existed_2);
결과는 아래와 같습니다.
다만,
이 방법은 object의 프로토타입 체인으로 생성한 프로퍼티도 체크를 한다는 점을 유의해야 합니다.
hasOwnProperty('key')
hasOwnProperty 함수를 사용하여 스스로 정의한 프로퍼티에 한해 특정 키의 소유 여부를 반환하는 방법입니다.
const obj = {
name : "홍길동",
age: 12,
}
// hasOwnProperty
const is_existed_1 = obj.hasOwnProperty('name');
const is_existed_2 = obj.hasOwnProperty('address');
console.log(is_existed_1);
console.log(is_existed_2);
결과는 아래와 같습니다.
마무리
자바스크립트를 통해 프로젝트를 진행하면 객체타입의 데이터를 다룰 일이 많습니다. 복잡한 형태의 객체에서 원하는 키값 존재여부를 확인하는 상황이 많으므로, 해당 부분을 기억해 두면 많은 도움이 될 수 있습니다.
오늘도 행복한 코딩생활 되시기 바라겠습니다.
감사합니다.
'개발 > javascript' 카테고리의 다른 글
자바스크립트 - string 대문자로 변경 toUpperCase(), 소문자로 변경 toLowerCase() (0) | 2023.01.14 |
---|---|
자바스크립트 - 소수점 자리수 처리 방법, 반올림하는 toFixed() (0) | 2022.11.14 |
자바스크립트 기초 ep.8 - 자료구조 관점에서의 객체(object) (0) | 2022.05.10 |
자바스크립트 기초 ep.7 - 자료구조 - 배열(array) (2) | 2022.04.28 |
자바스크립트 기초 ep.5 - 입력 (prompt, confirm) (2) | 2022.04.27 |
댓글