プログラム素人がプログラムを使いこなせるようになるまで。

全くの素人が日々プログラムを学び、それを応用して仕事を探します。独学でどこまでできるかを日記に綴ります。

JavaScriptⅠ 練習 その①

f:id:yuta322:20180920175942j:plain

 

 

皆さまだいぶお久しぶりです。。。( ´・ω・)y─┛~~~oΟ

 

先月海外旅行に行っていまして、時差ボケでやる気が出ずにブログ更新をさぼっていました。( ´・ω・)y─┛~~~oΟ

 

さて、前回までの内容から確認します。前回の記事を見ていない方は下記からどうぞ。( ´・ω・)y─┛~~~oΟ

 

amateur-programmer.hatenablog.jp

 

前回は、JavaScriptだけではなく、ほかのプログラミングもじっくり練習できるウェブサイトProgate | プログラミングの入門なら基礎から学べるProgate[プロゲート]上での登録方法を紹介しました。

 

さて今回は実際に練習を始めていくところから始めます。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170418p:plain

マイページにログインします。JavaScriptは3つのコースから成り立っているので初心者である僕はJavaScriptⅠから始めます。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170427p:plain

まずはJavaScriptのバージョンの説明です。今現在使われているバージョンはES6といわれるものですが、業界によっては一世代前のES5を使用しているところもあるそうです。ES6とあるので最初はES1(1997年)から始まり現在に至るようです。

同一の言語でも旧式、新型と別れるとは思いもよりませんでした。まるでWindows OSなどと同じですね。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170434p:plain

それでは実際に講義に入っていきます。

最初は指定された文字列を表示するという簡単な内容です。

Hello Worldこれは初めてプログラミングが開発されたときに一番最初にシステム上で表示させた言葉だそうです。ですので、大体のプログラム言語教育ではこれを最初に表示させるとか。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170440p:plain

JavaScriptでは文字を表示させる際にconsole.logという関数を用いて表示させます。この際に色々とルールがあり、表示させたい文字は()と”ダブルまたは’シングルクオーテーションで囲み、文章の末尾には;セミコロンが必要になるそうです。何故それが必要なのかは考えずにとりあえず進めていきます。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170445p:plain

目標の課題をクリアしました!とはいってもHelloWorldを表示させるだけですが。。。

このウェブサイトでは問題をクリアすると経験値がもらえます。それによってレベルが上がっていきます。問題を解くときに自力で回答(説明スライドに戻ってもOK)すると経験値が100%もらえますが、回答を見てそれを書き写して正解すると経験値が50%しかもらえません。( ´・ω・)y─┛~~~oΟ

 

 

f:id:yuta322:20180920170448p:plain

次に四則演算についてです。画像にあるような記号(関数)を用いて四則演算を行います。この関数ですが、エクセルをしている人であれば見覚えがあると思います。まったくもって同じ関数を使ってるので覚えやすいです。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170455p:plain

次のページに進みました。

難しい言葉が出ましたね。変数。漢字から見るからに数が変わるもののイメージですが

なんか違う感じがします。。。変数とは箱。。。?謎です。

 

次のページで詳細に説明しているのでそこを確認しましょう。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170501p:plain

写真の内容でわかりましたでしょうか?私はいまいち理解できませんでした。( ´・ω・)y─┛~~~oΟ

何となくですが、買い物サイトの右上とかにある『ようこそゲスト様』がログインすると『ようこそOO様』にかわる点も同じロジックでしょうか。この感じではログイン前の変数は”ゲスト”という文字が変数に登録されていましたが、ログイン後はその変数が書き換えられ”OO”とそのアカウントに登録している人の名前に書き変わる。

という感じでしょうか。( ´・ω・)y─┛~~~oΟ

 

変数があればその部分は書き換えが不要でその後ろで働く情報だけを書き換えるから入力文字数が少なくなる。。。?

 

よくわかりません。( ´・ω・)y─┛~~~oΟ

 

次に行きましょう。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170507p:plain

応用編ですね。このように変数+固定文字、変数+四則演算で計算できる用です。

以下に変数を使用することのまとめが書いてあります。やはり繰り返し処理に使いやすかったり、変更に対応しやすいというメリットがあるそうです。( ´・ω・)y─┛~~~oΟ

 

f:id:yuta322:20180920170512p:plain

 

 

長くなってしまったので今回はこれでいったん終了します。( ´・ω・)y─┛~~~oΟ

 

それではまた。( ´・ω・)y─┛~~~oΟ