JavaScriptの「this」はJavaと何が違うのか？―新人エンジニアのためのやさしい比較解説
山崎講師
こんにちは。ゆうせいです。
JavaScriptの勉強をしていると、こんな場面でつまずきませんか？
console.log(this);
「え、this って自分自身のことじゃないの？」「クラスの中じゃないのに使えるの？」「Javaと動きが違いすぎて混乱する…！」
そんなあなたのために、今回は「JavaScriptの this」と「Javaの this」を、比較しながらわかりやすく解説していきます。
そもそも「this」とは？
まずは共通点からスタートしましょう。
「this」とは、自分自身（のオブジェクト）を指すキーワード
これはJavaでもJavaScriptでも共通の概念です。ただし、「自分自身」とは何か？その決まり方に違いがあるのです。
Javaのthis：常に「そのクラスのインスタンス」
例：Javaのクラスとthis
public class Person {
String name;
public Person(String name) {
this.name = name;
}
public void greet() {
System.out.println("こんにちは、私は " + this.name + " です");
}
}Javaの特徴：
- 常にそのクラスのインスタンスを指す
- コンテキスト（状況）にかかわらず固定
- メソッドの中でしか使えない
つまり、Javaのthisはブレないんです！
JavaScriptのthis：呼び出し方によって変わる！
一方、JavaScriptはどうでしょう？
const person = {
name: '太郎',
greet: function () {
console.log('こんにちは、私は ' + this.name + ' です');
}
};
person.greet(); // → "こんにちは、私は 太郎 です"
このときの this は person オブジェクト を指しています。
でも次のようにすると…？
const greetFunc = person.greet;
greetFunc(); // → "こんにちは、私は undefined です"
「えっ！同じ関数なのに、thisが変わった！？」
そうなんです。JavaScriptの this は「関数がどう呼び出されたか」によって指すものが変わります。
両者の比較表
| 項目 | Javaのthis | JavaScriptのthis |
|---|---|---|
| 指す対象 | 常にクラスのインスタンス | 呼び出し方によって変わる |
| 安定性 | 常に固定 | 実行時に動的に決まる |
| 使える場所 | クラス内のメソッド | グローバル、関数、オブジェクト内など様々 |
| メソッドの外での意味 | 無効（使えない） | グローバルオブジェクトを指すことがある（厳密モードでは undefined） |
JavaScriptのthisが変わるパターン
1. 通常の関数呼び出し
function showThis() {
console.log(this);
}
showThis(); // → window（または global）
2. オブジェクトのメソッドとして呼び出す
const obj = {
name: '花子',
show: function () {
console.log(this.name);
}
};
obj.show(); // → "花子"
3. イベントリスナー内のthis
const button = document.querySelector('button');
button.addEventListener('click', function () {
console.log(this); // → クリックされたbutton要素
});
4. アロー関数のthis（特別ルール）
const obj = {
name: '一郎',
show: () => {
console.log(this.name);
}
};
obj.show(); // → undefined（thisは親スコープを継承する）
アロー関数ではthisは「外側のthis」をそのまま使うという仕様があります。これがまたややこしい！
図でイメージする：JavaとJavaScriptのthis
[Javaの場合]
class Foo {
this → Fooのインスタンス
}
[JavaScriptの場合]
this
↓ 呼び出し方で変化
- グローバルから呼べば → window
- オブジェクトから呼べば → そのオブジェクト
- アロー関数なら → 親のthisを参照
まとめ：JavaとJavaScriptでthisは全然ちがう！
| ポイント | Java | JavaScript |
|---|---|---|
| ブレない | ◎ | ×（呼び方次第で変化） |
| 明快さ | ◎ | △（慣れが必要） |
| 安心感 | ◎ | △（アロー関数・イベントで混乱） |
今後の学習のヒント
this の理解を深めるために、次のテーマもおすすめです！
- bind(), call(), apply() の違い：
thisを手動で指定するテクニック - アロー関数と普通の関数の違い
- JavaScriptのスコープとクロージャ
- class構文と
thisの扱い（ES6以降）
「Javaと似ているはず」と思っていると、逆に混乱しやすいのが this。
でも、仕組みを一度つかんでしまえば「なぜこうなるのか？」がすっきり理解できますよ！
セイ・コンサルティング・グループの新人エンジニア研修のメニューへのリンク
投稿者プロフィール