TECH I.S.

JavaScript オブジェクトメソッド


const <strong>person</strong> = {   firstName: "John",   lastName: "Doe",   id: 5566,   fullName: function() {     return <strong>this</strong>.firstName + " " + <strong>this</strong>.lastName;   } };

自分で試してみる»


thisとは?

JavaScriptでは、thisはオブジェクトを指します。

どのthisオブジェクトがどのように呼び出されるか(使用または呼び出されるか)によって決まります。

this は、使用方法に応じてさまざまなオブジェクトを参照します。
オブジェクトメソッドでは、オブジェクトthisを参照します。
単独で、グローバルオブジェクトthisを参照します。
関数では、グローバルオブジェクトthisを参照します。
関数のstrictモードでは、thisは未定義です。
イベントでは、イベントを受信した要素thisを指します。
call()apply()bind()などのメソッドは、thisを任意のオブジェクトに参照できます。

注記
thisは変数ではありません。キーワードです、thisの値は変更できません。
関連項目:JavaScriptthisチュートリアル


JavaScriptメソッド

JavaScriptメソッドは、オブジェクトに対して実行できるアクションです。

JavaScriptメソッドは、関数定義を含むプロパティです。


Property

Value

firstName John
lastName Doe
age 50
eyeColor blue
fullName function(){return this.firstName + " " + this.lastName;}

メソッドは、オブジェクトのプロパティとして保存される関数です。


オブジェクトメソッドへのアクセス

次の構文でオブジェクトメソッドにアクセスします。

<div><i>objectName.methodName()</i></div>

通常、fullName()をpersonオブジェクトのメソッドとして記述し、fullNameをプロパティとして記述します。

fullNameプロパティは、()で呼び出されると(関数として)実行されます。

この例では、personオブジェクトのfullName()メソッドにアクセスします。

name = person.fullName();

自分で試してみる»

()なしでfullNameプロパティにアクセスすると、関数定義が返されます。

name = person.fullName;

自分で試してみる»


オブジェクトへのメソッドの追加

新しいメソッドをオブジェクトに追加するのは簡単です。

person.name = function () {   return this.firstName + " " + this.lastName; };

自分で試してみる»


組み込みメソッドの使用

この例では、toUpperCase()Stringオブジェクトのメソッドで、テキストを大文字に変換します。

<div>let message = "Hello world!"; let x = message.toUpperCase();</div>

上記のコードを実行した後のxの値は次のようになります。

<div>HELLO WORLD!</div>

person.name = function () {   return (this.firstName + " " + this.lastName).toUpperCase(); };

自分で試してみる»



プログラミング学習を加速させる

プログラミングをプロの講師に教えてもらいませんか。

テックアイエスのプログラミングスクールは初心者も大歓迎です。年齢制限もありません。転職・副業に強く、挫折させない手厚いサポートで稼ぐ力を身につけましょう!

スクールの詳細