【初心者】JavaScript基礎を学ぼう!初めてのプログラミング言語

JavaScript

プログラミング言語を何から始めようか悩んでいる方に、まずはJavaScriptをおすすめしたい。JavaScriptは人気のプログラミング言語で、世界中多くの人が使っている言語のためネット上に数多くの参考になるサイトが存在しています。

今回はプログラミングを学んだことがない人向けにJavaScriptによるプログラミングの解説をしていきます。

JavaScriptを使ってみる

JavaScriptの特徴のひとつとしてとても簡単に始めることができます。

必要なものはWEBブラウザとテキストを編集するエディタです。JavaScriptは書いてすぐにブラウザで確認できる言語となるので、気軽にプログラミングを実行して結果を確認することができます。

プログラミングは全てを理解しなければいけないと思っている方もいますが、基本的なことを理解していれば構文などは必要なときに調べるという形で問題はありません。

何度も繰り返しプログラムを書くことが大切となります。

まずはHello world

まずは「Hello world」とブラウザに出力する方法について紹介します。

適当(任意)のフォルダにindex.htmlという名前のテキストファイルを作成してください。

エディタを開いて、下記の内容を書いてください。

<html>
<body>

<script>
	document.write("Hello world")
</script>

</body>
</html>

このように書くと、Hello worldがブラウザ上で表示されます。

JavaScriptはブラウザ上で動作するので、開発時はHTML、もしくはJavaScriptファイルを編集し、ブラウザをリロードして実行確認をするという流れになります。

※文字列を扱うときはダブルクォーテーション( ” )、もしくはシングルクォーテーション( ‘ )で囲む必要があります。

デベロッパー ツールの使い方Google Chrome

まずはグーグルクロムでブラウザをたちあげてください。

[F12]キー、もしくは[Ctrl]+[Shift]+[i]キーを押すと、デベロッパーツールが表示されます。

コンソールパネルの表示
デベロッパーツールの上部にある[Elements]、[Console]、[Sources]といったメニューから[Console]をクリックするとコンソールパネルが表示されます。

コンソールパネル使い方


文頭の > となっている行にJavaScriptの命令文を入力し[Enter]キーを押すと、命令文が実行されます。たとえば 1+1 と入力し[Enter]キーを押すと2と計算が表示されます。

複数行の命令文を実行したい場合、[Alt]+[Enter]キーで改行できます。たとえば a=1+1 で[Alt]+[Enter]キーを押し、次の行に a+1 と入力して[Enter]キーを押すと合計の 3 が表示されます。

console.log()を使った出力

HTMLファイルを作成し、次のように記述します。

<script>console.log("Hello world");</script>

ブラウザで表示させると何も表示されませんが、コンソールから確認するとHello worldと表示がされています。

エラーや警告の出力方法について

console.log(“ログ”);
console.debug(“デバッグ”);
console.info(“情報”);
console.warn(“警告”);
console.error(“エラー”);

ここで使った出力は console.log() といいます

メッセージを出力するために用意されたオブジェクトでJavaScriptはこのようにあらかじめ便利に使える機能がいくつもあります。

次の章では本格的にJavaScriptについて説明をしていきます。

コメント

タイトルとURLをコピーしました