JavaScript 객체의 속성 수를 계산하는 방법

객체에서 속성 수를 찾는 두 가지 방법을 찾았습니다. 그것들은 다음과 같습니다:

1. for 루프 사용
2. Using Object.keys

아래에 표시된 대로 "cat"이라는 개체를 생각해 보십시오.

var cat = {
    name: 'foo',
    age: 9
}

아래 목록과 같이 for 루프 및 업데이트 카운터를 반복하여 여러 속성을 찾을 수 있습니다.

let count = 0;
for (var c in cat) {
    count = count + 1;
}
console.log(count);// 2

위의 코드는 출력으로 "2"를 인쇄합니다.

위의 접근 방식은 객체의 자체 열거 가능한 속성을 인쇄 할뿐만 아니라 객체의 속성을 인쇄하여 링크됩니다.  이를 더 잘 이해하기 위해 다음을 나열해 보겠습니다.

var animal = { 
    canRun: true
}
 
var cat = {
    name: 'foo',
    age: 9
}
 
cat.__proto__ = animal;

cat과 animal의 두 개체가 있으며 cat 개체는 __proto__ 속성을 사용하여 동물 개체에 연결됩니다.  이제 for 루프를 사용하여 여러 속성을 반복하고 계산하면 동물 객체의 열거 가능한 속성도 계산됩니다. 따라서 아래 코드 목록에는 "3"이 인쇄됩니다.

var animal = {
    canRun: true
}
 
var cat = {
    name: 'foo',
    age: 9
}
 
cat.__proto__ = animal;
 
let count = 0;
for (var c in cat) {
    count = count + 1;
}
console.log(count);// 3

JavaScript for 루프는 객체의 모든 연결된 속성을 반복합니다.

객체의 자체 열거 가능한 속성을 계산하려면 객체의 자체 열거 가능한 속성만 열거하는 다른 접근 방식인 Object.keys()를 사용하는 것을 고려할 수 있습니다. 개체의 연결된 속성을 열거하지 않습니다.

앞으로 동물 객체에 연결된 고양이 객체를 다시 고려하고 Object.keys를 사용하여 속성 수를 계산해 보겠습니다.

var animal = {
    canRun: true
}
 
var cat = {
    name: 'foo',
    age: 9
}
 
cat.__proto__ = animal;
 
var count = Object.keys(cat).length;
console.log(count);

이제 "2"가 출력으로 인쇄됩니다.

Object.keys는 객체의 자체 열거 가능한 속성만 열거합니다.

개체의 속성 enumerable이 false로 설정된 경우 Object.keys 배열의 멤버가 아닙니다.  다시 cat 객체를 고려하고 해당 name 속성을 열거 가능하도록 설정 합니다.

var cat = {
    name: 'foo',
    age: 9
}
 
Object.defineProperty(cat, 'name', { enumerable: false });

이제 Object.keys 를 사용하여 여러 속성을 찾으면 하나만 계산됩니다.

var count = Object.keys(cat).length;
console.log(count);  // print 1

마지막으로, JavaScript 개체에서 여러 속성을 찾는 데 사용할 수 있는 두 가지 방법입니다.

이 게시물이 마음에 드시면 공유해 주세요. 또한 Infragistics Ignite UI for Angular 구성 요소를 확인하지 않았다면 반드시 확인하십시오! 우리는 30+ 자료 기반 Angular 구성 요소를 가지고 있어 빠른 웹 앱을 더 빠르게 코딩할 수 있습니다.