1. ウェブ開発の学習
  2. よくある質問
  3. よくある JavaScript の問題の解決

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

よくある JavaScript の問題の解決

JavaScript のコードが正しく動作しないので修正したい、というような場合にみられる、よくある問題の解決方法へのリンクを以下に示します。

初心者によくある誤り

スペル、大文字小文字を訂正する

コードが正しく動かない場合や、何かが未定義であるとブラウザーがエラーを出した場合、変数名や関数名のスペルが正しいか確認してください。

間違いやすいブラウザーの組み込み関数の例です。

正 誤
getElementsByTagName() getElementByTagName()
getElementsByName() getElementByName()
getElementsByClassName() getElementByClassName()
getElementById() getElementsById()

セミコロンの位置

セミコロンの位置に誤りがないか確認してください。例を挙げます。

正 誤
elem.style.color = 'red'; elem.style.color = 'red;'

関数

関数についての誤りは何点かあります。

よくある誤りの一つとして、関数を定義したがどこからも呼び出していない、というものがあります。例を挙げます。

js
function myFunction() {
  alert("This is my function.");
}

上記のコードで定義した関数は、例えば以下のように呼び出さないかぎり何もしません。

js
myFunction();

関数のスコープ

関数は関数自身のスコープを持ちます。変数をグローバルに（関数の外で）定義するか、返値として変数の値を関数の外に返さないかぎり、関数の外から関数の中で定義された変数にアクセスすることはできません。

return 文の後ろのコードの実行

return 文で関数から値を返したとき、 JavaScript のインタープリターはその関数を終了します。 return 文の後ろのコードは実行されません。

Firefox などのいくつかのブラウザーは、 return 文の後ろにコードが存在する場合、開発者ツールのコンソールにエラーメッセージを出力します。 Firefox が出力するメッセージは "unreachable code after return statement" です。

オブジェクトリテラル記法 vs 通常の代入

JavaScript で普通に何かを代入するときは、単一の等号を使用します。

js
const myNumber = 0;

ただし、オブジェクト では、正しい構文を使用するように注意する必要があります。オブジェクトは中括弧で囲み、メンバー名とその値はコロンで区切り、メンバーはカンマで使用しなければなりません。例えば、次のようになります。

js
const myObject = {
  name: "Chris",
  age: 38,
};

基本的な定義

初級のユースケース

全般

変数

数学

文字列

配列

JavaScript のデバッグ

JavaScript のデバッグに関する詳細については、JavaScript のよくある問題を扱うを参照してください。よくあるエラーの説明についてはその他のよくあるエラーを参照してください。

コード内での決定

ループ/反復処理

中級のユースケース

関数

オブジェクト

JSON

イベント

オブジェクト指向 JavaScript

Web API

Help improve MDN

Learn how to contribute

This page was last modified on by MDN contributors.

View this page on GitHub • Report a problem with this content