2016年11月17日(木)
コンソールを使ってJavaScriptのデバッグ効率を上げよう!
JavaScriptを使ったWebプログラミングを行う時に、覚えておきたいのがデバッグ(プログラミングの誤りを修正すること)のやり方です。
デバッグすることで、コードを正しく修正するだけでなく、開発スピードをアップさせることができます。Webブラウザのコンソールを用いて、デバッグを行う際のコツをご紹介しましょう。変数やオブジェクトの値のチェック方法
JavaScriptのデバッグ作業で、変数の中身やオブジェクトの値をチェックしたい場合、alertメソッドを使うのが一般的です。
alert("出力したい変数名");しかし、いくらチェックしたいからと言って、コード内に大量にalertを書くと、alertダイアログが沢山出てきます。開発を先に進めるためにはいちいち閉じなければならず、効率的とは言えません。
そこで、Webブラウザのコンソール機能を利用しましょう。
コンソールはブラウザの開発ツールで、元々はFirefoxのアドオンであるFirebugに実装されていた機能でした。これを利用する開発者が多かったため、chromeやSafari、IE(8以上)などの各種ブラウザにも標準搭載されるようになりました。コンソールに文字列を入力することで、動作確認やデバッグ...
author:
インターネット・アカデミー
https://www.internetacademy.jp/blog/ja/
インターネット・アカデミーは、日本初のWeb専門スクールです。母体がWeb制作会社のため、制作現場のノウハウが詰まったカリキュラムで、初心者からプロのWebデザイナー/Webディレクター/ITエンジニアを数多く輩出しています。
‹ PREV
今年も盛り上がろう!アドベントカレンダー2016参加者募集中 #BlogOlympic2016
NEXT ›
ハイクオリティーなテーマやテンプレートを集めたサイト「Best of Themes」!
関連記事
Ads
インターネット・アカデミーは、日本初のWeb専門スクールです。母体がWeb制作会社のため、制作現場のノウハウが詰まったカリキュラムで、初心者からプロのWebデザイナー/Webディレクター/ITエンジニアを数多く輩出しています。インターネット・アカデミーの記事『コンソールを使ってJavaScriptのデバッグ効率を上げよう!』についてまとめています。
この記事は特にjavascript・アイコン・HTML5・Google・Chrome・Firefox・safari・アプリについて書かれており、 HTML+CSSコーディング、Webサービスのカテゴリーに分類されます。気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のインターネット・アカデミーで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとインターネット・アカデミーの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
Ads