JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで配列内のオブジェクトの数を数える方法

JavaScriptで配列の中に含まれるオブジェクトの数を数えたい場合、Object.prototype.__proto__プロパティを利用する方法があります。このプロパティはオブジェクトのプロトタイプチェーンをたどるもので、要素がプレーンなオブジェクトかどうかを判別する際に役立ちます。

仕組みの解説

配列の各要素に対してval.__proto__.__proto__が偽（falsy）になるかどうかをチェックします。オブジェクトリテラルの場合、__proto__はObject.prototypeを指し、そのさらに上位の__proto__はnullとなるため条件が真になり、カウントが1つ増えます。一方、配列など他の型ではプロトタイプチェーンの構造が異なるため、カウント対象から除外されます。

サンプルコード

以下のコードを実行すると、配列内のオブジェクトの総数を取得できます。

<html>
   <head>
      <title>JavaScriptでオブジェクトを数える</title>
   </head>
   <body>
      <script>
         var len = 0;
         var myArr = [{"Hello World!":"Welcome!","int":10},{"Learn":"Share","int":20},{"Tutorials":"Quiz","int":30}];
         myArr.forEach(function(val){
            if(!val.__proto__.__proto__){
               len++;
            }
         });
         document.write("オブジェクトの合計: "+len);
      </script>
   </body>
</html>

実行結果

オブジェクトの合計: 3

補足：より安全な判定方法

__proto__プロパティは現在では非推奨（deprecated）とされているため、実務ではfilter()メソッドとArray.isArray()を組み合わせた次のような書き方が推奨されます。

var len = myArr.filter(function(val){
  return val !== null && typeof val === 'object' && !Array.isArray(val);
}).length;

console.log("オブジェクトの合計: " + len); // オブジェクトの合計: 3

この方法であれば、プロトタイプチェーンに直接依存せず、配列やnullを除外しながらオブジェクトだけを正確に数えることができます。

  1. JavaScriptでIDごとにオブジェクトの配列をグループ化する方法

    JavaScriptでオブジェクトの配列をidなどの特定のキーごとにグループ化したい場合、reduce()メソッドを使うと簡潔に実装できます。この記事では、どのプロパティにも対応できる汎用的なgroupBy関数を作成し、実際のサンプルコードとともにその仕組みを詳しく解説します。 reduce()によるグループ化の考え方 reduce()は、配列の各要素を順番に処理しながら、1つの累積値（ここではオブジェクト）を組み立てていくメソッドです。各要素からキーの値を取り出し、その値がまだ結果オブジェクトに存在しなければ新しい配列を作成して、そこへ要素を追加していくことでグループ化を実現します。 サ

  2. JavaScriptでオブジェクトを含む「配列の配列」をループ処理する方法

    JavaScriptでオブジェクトを含む多次元配列をループするには？JavaScriptでは、オブジェクトを含む配列の配列（入れ子構造の配列）をループ処理する際、forEach()メソッドをネストして使用し、さらにfor...inループで各オブジェクトのプロパティにアクセスするのが一般的な方法です。以下に、具体的な実装例を紹介します。コード例<!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device