Object.keys()

オブジェクト・キーズ（組み込みオブジェクト）

意味キーの配列取得

Object.keys()とは？

`Object.keys()`メソッドは、指定されたオブジェクトの直接の列挙可能なプロパティ名を配列として返します。

Object.keys()の具体的な使い方

ボタンクリックでオブジェクトのキーを取得する例

<button onclick='keysExample()'>Keys Example</button>
<div id='result'></div>
<script>
function keysExample() {
  const student = {
    name: '山田太郎',
    age: 18,
    grade: 3,
    subjects: ['数学', '国語', '英語']
  };
  const keys = Object.keys(student);
  document.getElementById('result').innerHTML = 
    '<p>学生情報のプロパティ名：<br>' + keys.join(', ') + '</p>' +
    '<p>プロパティ数: ' + keys.length + '</p>';
}
</script>

この例では、`student`オブジェクトのすべてのキー（プロパティ名）が配列として取得され、ページ上に表示されます。また、プロパティの数も表示されます。

オブジェクトのキーを使用してプロパティを列挙する例

const book = {
  title: 'JavaScript入門',
  author: '佐藤一郎',
  year: 2023,
  pages: 300
};

const keys = Object.keys(book);

console.log('書籍情報:');
keys.forEach(key => {
  console.log(`${key}: ${book[key]}`);
});

console.log('\n配列のインデックスをキーとして扱う例:');
const fruits = ['りんご', 'バナナ', 'オレンジ'];
const fruitKeys = Object.keys(fruits);
fruitKeys.forEach(key => {
  console.log(`${key}: ${fruits[key]}`);
});

👇出力結果

書籍情報:
title: JavaScript入門
author: 佐藤一郎
year: 2023
pages: 300

配列のインデックスをキーとして扱う例:
0: りんご
1: バナナ
2: オレンジ

この例では、まず`book`オブジェクトのキーを取得し、それを使用してオブジェクトのプロパティを列挙しています。次に、配列に対して`Object.keys()`を使用し、配列のインデックスがキーとして扱われることを示しています。

Object.keys()に関するよくある質問

Q. 継承されたプロパティは含む？

A. いいえ、Object.keys()は直接のプロパティのみを返し、プロトタイプチェーンから継承されたプロパティは含みません。

Q. 列挙不可能なプロパティは？

A. Object.keys()は列挙可能なプロパティのみを返します。列挙不可能なプロパティは含まれません。

Q. 配列でも使える？

A. はい、配列でも使用できます。配列のインデックスがキーとして返されます。例えば、['a', 'b', 'c']に対してObject.keys()を使用すると、['0', '1', '2']が返されます。

Object.keys()が学べる書籍の紹介

「プログラミング単語帳」を使って、プログラミングの単語を英単語のように学習してみませんか？
プログラミング単語帳には、JavaScriptのObject.keys()やDate.now()、Object.seal()、string.repeat()、などのような実務でよく使われる単語が数百以上収録されています。
この書籍には、プログラミングの単語の意味や読み方、単語の使い方がわかる例文などが掲載されており、いつでもどこでもプログラミングの学習ができます。

よく使われる単語にだけ絞って学習することができるので、効率的にプログラミングが学習できます。