Menu
Coddy logo textTech

算出プロパティ

CoddyのJavaScriptジャーニー「オブジェクト指向プログラミング」セクションの一部 — レッスン 44/56。

算出プロパティは、単に保存されたデータを返すのではなく、値を計算して返すゲッターです。これらは通常のプロパティのように見えますが、その場で値を計算します。

例を見てみましょう。通常のプロパティを持つオブジェクトがあります:

const circle = {
  radius: 5
};

次に、ゲッターを使用して算出プロパティを追加します:

const circle = {
  radius: 5,
  get diameter() {
    return this.radius * 2;
  }
};

このようにして算出プロパティにアクセスします:

console.log(circle.diameter); // 出力:10

半径を更新すると、直径も自動的に更新されます:

circle.radius = 10;
console.log(circle.diameter); // 出力: 20

算出プロパティは、プロパティの値が他のプロパティに依存している場合や、計算が必要な場合に便利です。

challenge icon

チャレンジ

widthheightプロパティを持つRectangleクラスが与えられています。あなたのタスクは、areaとperimeterのための算出プロパティを追加することです。

  1. 算出プロパティ <strong>area</strong> - width × heightを返します
  2. 算出プロパティ <strong>perimeter</strong> - 2 × (width + height)を返します

チートシート

算出プロパティは、単に保存されたデータを返すのではなく、値を計算して返すゲッターです。これらは必要に応じてその場で値を計算します。

getキーワードを使用して算出プロパティを定義します:

const circle = {
  radius: 5,
  get diameter() {
    return this.radius * 2;
  }
};

算出プロパティには、通常のプロパティのように(括弧なしで)アクセスします:

console.log(circle.diameter); // 出力: 10

算出プロパティは、依存しているプロパティが変更されると自動的に更新されます:

circle.radius = 10;
console.log(circle.diameter); // 出力: 20

自分で試してみよう

import { Rectangle } from './rectangle.js';

// テストコード - 変更しないでください
const rect = new Rectangle(5, 10);
console.log(`Area: ${rect.area}`);        // "Area: 50" と出力されるはずです
console.log(`Perimeter: ${rect.perimeter}`); // "Perimeter: 30" と出力されるはずです
quiz icon腕試し

このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。

オブジェクト指向プログラミングのすべてのレッスン