Wikibooks

JavaScript/メソッド

< JavaScript

メソッド

編集

メソッドとは、JavaScriptにおけるオブジェクトのプロパティとして定義された関数のことを指します。オブジェクトの動作や機能を表現するために使用されます。

メソッドの基本構造

編集

メソッドはオブジェクト内で定義され、以下のように呼び出されます。 

// メソッドの定義
const obj = {
  greet: function(name) {
    return `Hello, ${name}!`;
  }
};

// メソッドの呼び出し
console.log(obj.greet("Alice")); // "Hello, Alice!"

また、簡略化した構文を使用してメソッドを定義することも可能です。 

// 簡略化されたメソッド定義
const obj = {
  greet(name) {
    return `Hello, ${name}!`;
  }
};

console.log(obj.greet("Bob")); // "Hello, Bob!"

this キーワード

編集

メソッドの中でthisキーワードを使用すると、そのメソッドが属するオブジェクトを参照できます。 

const obj = {
  name: "Charlie",
  introduce() {
    return `My name is ${this.name}.`;
  }
};

console.log(obj.introduce()); // "My name is Charlie."

thisの値は、メソッドがどのように呼び出されたかによって異なる場合があるため注意が必要です。

メソッドの種類

編集

メソッドには以下のような種類があります。

インスタンスメソッド

編集

オブジェクトインスタンスごとに呼び出されるメソッド。 

const obj = {
  multiply(a, b) {
    return a * b;
  }
};

console.log(obj.multiply(3, 4)); // 12

静的メソッド

編集

クラスに紐づくメソッドで、インスタンスを必要とせずに呼び出せます。 

class Calculator {
  static add(a, b) {
    return a + b;
  }
}

console.log(Calculator.add(5, 7)); // 12

メソッドの動的追加

編集

メソッドは、動的にオブジェクトに追加することができます。 

const obj = {};
obj.sayHello = function() {
  return "Hello!";
};

console.log(obj.sayHello()); // "Hello!"

関数との違い

編集

通常の関数とメソッドは似ていますが、以下の点で異なります。

  • thisの参照先: メソッド内ではthisが定義されているオブジェクトを参照しますが、関数内では異なる場合があります。
  • オブジェクトへの結びつき: メソッドは特定のオブジェクトに属しますが、関数はオブジェクトに属さない独立した存在です。

組み込みオブジェクトのメソッド

編集

JavaScriptの組み込みオブジェクトにも多くの便利なメソッドが用意されています。例として以下のものがあります。 

const numbers = [1, 2, 3];
numbers.push(4); // 配列に4を追加
console.log(numbers); // [1, 2, 3, 4]

const text = "Hello, World!";
console.log(text.slice(7, 12)); // "World"

console.log(Math.max(1, 5, 3)); // 5

メソッドチェーン

編集

メソッドを連続的に呼び出す「メソッドチェーン」というパターンが使用されることがあります。 

const result = "  Hello, World!  "
  .trim() // 前後の空白を削除
  .toUpperCase() // 文字列を大文字に変換
  .slice(0, 5); // 最初の5文字を抽出

console.log(result); // "HELLO"

まとめ

編集
"https://ja.wikibooks.org/w/index.php?title=JavaScript/メソッド&oldid=265502" より作成