Java経験者がJavaScriptを学ぶときに戸惑うこと10選
こんにちは。ゆうせいです。
Javaをある程度学んだあとにJavaScriptに触れると、「名前が似てるからきっと似たようなものだろう」と思いきや、意外な落とし穴がたくさんあります。まるで漢字が使われているからと中国語を学び始めたら、まるで通じなかった…そんな感覚に近いかもしれません。
この記事では、Java経験者がJavaScriptを学ぶときに特に戸惑いやすいポイントを、丁寧に、例えを交えて解説します。ぜひ「あるある!」と感じながら読み進めてみてください。
1. 型の指定がない(または曖昧)
Javaでは必須だった型指定(int, Stringなど)が、JavaScriptでは基本的に不要です。
int x = 10;
let x = 10;
JavaScriptでは let
や const
で変数を宣言し、値によって自動的に型が決まります(これを「動的型付け」といいます)。
例え:
Javaが「制服が決まっている学校」だとすると、JavaScriptは「私服OKの学校」。自由だけど、ルールを知らないと混乱しやすいんです。
2. アロー関数(=>)が出てくる
JavaScriptには =>
を使ったアロー関数があります。
const sum = (a, b) => a + b;
これはJavaには存在しない記法なので、初見では「なにこれ?」となります。
ポイント:
アロー関数は「this」の扱いが違うという注意点もあります。Javaの匿名クラス的な使い方とは少し異なります。
3. クラスの裏側が違う
JavaScriptにも class
文法がありますが、実態はプロトタイプベースという全く異なる仕組みです。
class Animal {
speak() {
console.log("hello");
}
}
見た目はJavaに似ていますが、クラスの中身はまったく違う動きをすることがあるので要注意です。
4. this の挙動がバラバラ
Javaでは this
は「このインスタンス自身」として安定していますが、JavaScriptでは呼び出し方によって意味が変わります。
function show() {
console.log(this);
}
どこで show
を呼び出すかで、this
の指す先が変わってしまいます。アロー関数との違いもここで絡んできます。
5. null と undefined の違い
Javaには null
はあるけど、undefined
はありません。
null
: 意図的に「何もない」undefined
: 値がまだ定義されていない
let a;
console.log(a); // undefined
これは非常に混乱しやすく、バグの温床にもなります。
6. == と === の違い
"5" == 5 // true
"5" === 5 // false
==
は型変換をして比較するのに対し、===
は型も値も比較します。
例え:==
は「数字の5と文字の'5'を、同じとみなすことがある曖昧な先生」。===
は「厳格な先生」。
7. 非同期処理(async/await, Promise)
JavaではスレッドやFutureを使って非同期処理を行いますが、JavaScriptでは Promise
や async/await
が主流です。
async function fetchData() {
let result = await fetch(url);
}
この書き方に慣れないうちは、なぜ関数の戻り値が Promise
になるのか理解しにくいかもしれません。
8. 関数が「第一級市民」
JavaScriptでは関数を変数に代入したり、引数として渡したり、戻り値にしたりすることが簡単にできます。
const greet = function() {
return "Hello";
};
const say = greet;
console.log(say()); // Hello
Javaでもラムダ式や関数型が導入されましたが、JavaScriptはもっと自由です。
9. 配列とオブジェクトの境界があいまい
Javaでは配列とMapなどのコレクションはきっちり区別されますが、JavaScriptでは []
と {}
の使い分けが曖昧に感じられることがあります。
let arr = [1, 2, 3];
let obj = {a: 1, b: 2};
とくにオブジェクトをJSONとして扱う場面では、どこまでがデータ構造でどこからがロジックなのか混乱しやすいです。
10. スコープの扱い(var, let, const)
Javaでは変数のスコープは明確ですが、JavaScriptでは var
, let
, const
の違いがややこしいです。
var
: 関数スコープ(古い)let
: ブロックスコープ(新しい)const
: 再代入不可のブロックスコープ
if (true) {
var x = 1;
}
console.log(x); // 1(え!?)
例え:var
は「体育館に大声で叫んだら、どこからでも聞こえる」イメージです。
今後の学習の指針
JavaScriptは「自由」であるがゆえに、とても柔軟かつ強力です。その一方で、ルールや癖を知っていないと混乱しやすい言語でもあります。
今後は以下のテーマを深掘りしてみてください。
this
とアロー関数の関係- 非同期処理(Promise, async/await)のパターン
- クラスとプロトタイプチェーンの違い
- ES6以降の新機能(モジュール、テンプレートリテラルなど)
もし詳しい解説やサンプルコードが必要でしたら、お気軽にご相談ください。
セイ・コンサルティング・グループの新人エンジニア研修のメニューへのリンク
投稿者プロフィール

- 代表取締役
-
セイ・コンサルティング・グループ株式会社代表取締役。
岐阜県出身。
2000年創業、2004年会社設立。
IT企業向け人材育成研修歴業界歴20年以上。
すべての無駄を省いた費用対効果の高い「筋肉質」な研修を提供します!
この記事に間違い等ありましたらぜひお知らせください。