先月から学んでいるプログラミングですが、習得するために学んだことをブログに記録していこうとおもいます。
この記事では、JavaScript基本、変数、演算子、データ型について。できる限り、自分と同じくプログラミングを学んでいる方にわかるように書いていきます。
JavaScriptを学ぶ前に
JavaScriptって、馴染みのない人からすると、何ができるかよくわからないですよね。ざっと知っておくべきことはこんな感じでしょうか。
- 世界には200種類以上のプログラミング言語がある
- それぞれの言語には特徴があり、メリット、デメリットがある
- JavaScriptはWebページ作成に特化した言語
- ブラウザで動作するため、実行するための難しい準備は必要ない
- プログラミング言語の中で処理は遅い方である
- ソースが見えるのでセキュリティに難あり
- JavaScriptとJavaは別物
この時点では、JavaScriptを使えば、何をどこまでできるのかよくわかりませんが、Webページ作成に使える言語で、何やらセキュリティに難があるらしい。
通常、Webページを作るときは、HTMLでページの構造を作って、CSSでレイアウトや見た目整えますが、それに加えて、JavaScriptでは、Webページに動きを加えたりできるようです。
- HTML：文章の構造の定
- CSS：デザインの指定
- JavaScript：動きをつける
こんな感じですね。JavaScriptなしでもサイトは作れますけど、動きをつけることで、より表現の幅が広がりそうです。
変数・演算子・データ型の話
プログラミングを学ぶ上で避けては通れないのがこの変数の話。以前、C言語をかじったときに、イマイチよくわからん！と投げ出した部分w
「変数」はデータを入れておく箱のようなもので、どんな処理をするにしても、データを一時保管しておく場所が必要なんですね。
- データを入れる箱「変数」が必要
- 変数を利用するときは、「宣言」する必要がある
- 変数は、値を代入したり取り出したりして利用できる
- 変数名に指定された予約語は使えない（if,for,float,その他）
プログラムで処理をするには、この変数で箱を作らないと始まりません。そして、この変数を演算子を演算子などを使って、いろんな処理をかけていくんですね。扱うデータの形式にも種類があって、
- データの扱いに関する形式を「データ型」
- 数値型、文字列型、論理型、null型など（使い分けは現段階ではよくわからない）
で、上記の変数を処理するのが演算子。演算子にも、数字を処理するものから、比較を行うもの、条件を組み合わせるためのものなど、いくつかの種類に分類されます。
- 「演算子」は、あらゆる演算するための記号
- 数学の加減乗除を指示する記号：算術演算子（+,-,*,/,%）
- 数値を代入するために使う記号：代入演算子（=）
- 数値、変数の比較を行う記号：比較演算子（>,<,>=,<=）
- 条件を複数組み合わせる記号：論理演算子（&&,||,!）
- 変数を1プラスする記号：インクリメント演算子（++）
- 変数を1マイナスする記号：デクリメント演算子（–）
算術演算子で計算をしたり、数値や変数の比較や条件の組み合わせることでプログラムができているんですね。
当然、複雑な処理になればなるほど、コードの行数は多くなるし、書くのが大変なわけです。実装したい処理をこのような演算にひとつひとつ置き換えていく作業は、言語の翻訳とすごく似ています。
実装したい処理を細かく分解していって、ちびちびと書いていく。プログラマーってほんと大変な仕事なんだなーとシミジミ。というか、これ考えた人すげーわ。
最後に、CodeCampの教科書にあった課題で書いたコードを載せてみます。
税抜き価格100円のりんご3個と、税抜き価格150円のグレープを2個購入したときの合計金額（税込）を計算して表示するっていう、全く役に立たないプログラムですw
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>課題</title>
<script>
var apple = 100;
var grape = 150;
var sum;
sum = (apple*3 + grape*2)*1.08;
document.write("<p>合計：" + sum + "</p>")
</script>
</head>
<body>
</body>
</html>
変数apple、変数grapeを作って、それぞれに100、150を代入。合計値を入れるための変数sumを宣言し、数値を計算して、documtne.writeで、変数の中身を表示しています。
document.writeは、DOM（Document Object Model)という、JavaScriptでHTMLを操作する方法で、CodeCampの教科書では割と後半に出てきていました。その辺はまた後日詳しく書いてみます。
記事の内容で間違っている部分や、もっとこうした方が良いよ！など、先輩方のアドバイスがあれば絶賛受付中ですので、ご指摘いただけると嬉しいです。
