デバッグゲーム(このバグ見つけられますか?)

この記事は約 2 分 で読むことができます。

プログラムには「バグ」がつきものです。

正しいプログラムを書いたつもりでも、
実際に動作させてみると、思わぬエラーが発生することや
思い通りの動作をしてくれないことがあります。

そのような時、ソースコードのどこかに必ず「バグ」が潜んでいます。

バグには、特定の条件下でのみ発生するイレギュラーなものから
プログラマーの単純なスペルミスが原因で起こるものまで様々です。

例えば、先日も以下のようなバグがありました。

デバッグゲーム(このバグ見つけられますか?)

以下は、HTMLのボタンの色を変更するプログラムなのですが
最初は思い通りに色が変更されませんでした。

 ↓ ↓ ↓

誤)$('#btn_'+element_id).css('background_color', '#5cb85c');

そこで、以下のように変更したところ、正常に動くようになりました。

 ↓ ↓ ↓

正)$('#btn_'+element_id).css('background-color', '#5cb85c');

この2つの行の違いが分かりますか??

正解は・・・

答えは、この↓を文字選択すると確認できます。


background_colorの「background」と「color」の間にある区切り文字が
間違っている方は「ハイフン(-)」で、正しい方は「アンダーバー(_)」になっています。


これは、CSSのプロパティ(設置値)の指定ですが、
正しくハイフンで記述しないとボタンの色は変更されません。

このように、一見すると違いが分からないような些細なタイプミスが原因で
プログラムが思い通りに動作しないことは多々あります。

しかも、書いたプログラマーは自分でそのことに気づかないことが多いのです。

まとめ

いかがでしたか?
あなたはこのバグをすぐに見つけられたでしょうか?

バグ発見のためには、間違い探しをスピーディに出来ることも重要ですが、
上手く動かないときは、どこかでタイプミスをしている「前提で」
ソースコードを疑って見る姿勢も大切なんです。

デバッグゲーム(このバグ見つけられますか?)
この記事はあなたのお役に立てましたか?

この記事があなたのお役に立てましたら、
いいね!クリックをお願いします!

あなたも楽しくプログラミングを学んでみませんか?

コメントを残す