JavaScriptを勉強する上で覚えておきたいオブジェクト一覧と詳細

JavaScriptはオブジェクト指向プログラミングの要素を持つスクリプト言語です。プログラミングにおける「オブジェクト」とは、データや機能をひとまとまりにしたものを指します。本記事では、JavaScript学習者にとって必須のオブジェクトとその詳細について解説します。

基本オブジェクト

Object
説明: JavaScriptで最も基本的なオブジェクト型で、キーと値のペアを持ちます。
プロパティーやメソッド
Object.keys(obj): オブジェクトのキーを配列として取得。
Object.values(obj): オブジェクトの値を配列として取得。
Object.entries(obj): [キー, 値]のペアを配列として取得。

使用例

const person = { name: "John", age: 30 };
console.log(Object.keys(person)); // ["name", "age"]
console.log(Object.values(person)); // ["John", 30]
console.log(Object.entries(person)); // [["name", "John"], ["age", 30]]

Array
説明: 順序付きのデータを扱うためのオブジェクト。
プロパティーやメソッド
length: 配列の長さを取得。
push(value): 配列の末尾に値を追加。
pop(): 配列の末尾から値を削除。

使用例

const numbers = [1, 2, 3];
numbers.push(4);
console.log(numbers); // [1, 2, 3, 4]
numbers.pop();
console.log(numbers); // [1, 2, 3]

Function
説明: 関数はオブジェクトの一種で、再利用可能なコードブロックを作成します。
プロパティー
name: 関数の名前を取得。
length: 引数の数を取得。

使用例

function greet(name) {
  return `Hello, ${name}`;
}
console.log(greet.name); // "greet"
console.log(greet.length); // 1

組み込みオブジェクト

Date
説明: 日付と時間を扱うためのオブジェクト。
プロパティーやメソッド
getFullYear(): 年を取得。
getMonth(): 月を取得（0-11）。
getDate(): 日を取得。

使用例

const today = new Date();
console.log(today.getFullYear()); // 現在の年
console.log(today.getMonth() + 1); // 現在の月
console.log(today.getDate()); // 現在の日

Math
説明: 数学的な計算を行うためのオブジェクト。
プロパティーやメソッド
Math.PI: 円周率。
Math.random(): 0から1の間のランダムな数値を生成。
Math.floor(value): 小数点以下を切り捨て。

使用例

console.log(Math.PI); // 3.141592653589793
console.log(Math.random()); // 0.123456789 (例)
console.log(Math.floor(4.7)); // 4

JSON
説明: JSON形式のデータを操作するためのオブジェクト。
メソッド
JSON.stringify(obj): オブジェクトをJSON文字列に変換。
JSON.parse(jsonString): JSON文字列をオブジェクトに変換。

使用例

const data = { name: "Alice", age: 25 };
const jsonData = JSON.stringify(data);
console.log(jsonData); // '{"name":"Alice","age":25}'
console.log(JSON.parse(jsonData)); // { name: "Alice", age: 25 }

特殊なオブジェクト

Promise
説明: 非同期処理の結果を表現するオブジェクト。

使用例

const promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve("Done!"), 1000);
});
promise.then(result => console.log(result)); // 1秒後に "Done!" と表示

RegExp
説明: 正規表現を扱うためのオブジェクト。

使用例

const regex = /hello/i;
console.log(regex.test("Hello world")); // true

ブラウザ関連のオブジェクト

Document
説明: HTML文書を操作するためのオブジェクト。

使用例

const title = document.querySelector("h1");
console.log(title.textContent);

Window
説明: ブラウザウィンドウを表現するオブジェクト。

使用例

console.log(window.innerWidth); // ウィンドウの幅を取得

Navigator
説明: ユーザーのブラウザ情報を取得するオブジェクト。

使用例

console.log(navigator.userAgent); // ブラウザのユーザーエージェント情報

まとめ

この記事で紹介したオブジェクトは、JavaScriptを効率的に学ぶための基礎です。
特に実際のプロジェクトでこれらを活用することで、より深い理解とスキルアップが期待できます。
ぜひ、実際のコードで使いながら学んでみてください！

Favorite