자바스크립트에서 객체가 가진 키 값의 개수 구하는 방법

Last Modified : 2020-03-17 / Created : 2020-03-15

6,796
View Count

주소 복사하기

자바스크립트에서 객체가 가진 키의 개수만 구하는 방법을 알아봅니다.

# 자바스크립트 객체의 키의 개수 구하는 방법

객체 타입을 선언 후 값이 있는지 없는지 확인하기 위해서 키값의 여부를 확인하는 것도 하나의 방법입니다. 이런 이유로 키 값의 개수를 알기 위해서 사용 가능한 방법이 바로 Object.keys() 입니다.

Object.keys(객체)

Object 객체의 내장함수인 keys()는 객체가 가진 모든 키들을 하나의 배열로 반환해줍니다. 즉 아래와 같은 객체가 존재하는 경우 하나의 변수에 키만 저장할 수 있습니다.

var myObj = {
id: 1,
name: 'webisfree',
url: 'webisfree.com'
};

myObjArray = Object.keys(myObj);

이제 myObjArray를 출력하면 아래와 같이 나타납니다.

console.log(myObjArray);

[ 1, 'webisfree', 'webisfree.com' ] // 출력결과

! 객체의 값 여부를 확인하는 방법

앞에도 언급했지만 API 등을 통해 변수 값이 업데이트 되는 경우~ 업데이트 되어 값이 있는지 없는지 확인할 때 keys()를 사용해 반환된 배열의 길이를 조건으로 사용할 수 있습니다. 예를들어 아래처럼 사용할 수 있죠.

var sites = {};
var hasValue = Object.keys(sites).length > 0;

if (hasValue) {
// 0개가 아닌 1개 이상인 경우에만 코드를 실행
}

위의 조건은 객체가 가진 키 값이 없으므로 당연히 if 조건 안의 코드가 실행되지 않습니다. 값을 아래처럼 업데이트하면 잘 실행됩니다.

sites = {
sitename: 'webisfree'
};
var hasValue = Object.keys(sites).length > 0;

이제 키 값이 1개이므로 if 안의 조건은 정상적으로 실행될 것입니다.

여기까지 객체의 키 값을 구하는 방법을 알아봤습니다.

object 객체 keys

아래의 글도 찾고 계시지 않나요?

자바스크립트 배열에서 빈 값만 제거하기

순수 자바스크립트로 스크롤 이동 애니메이션 구현하기, animate