ケースタディ!

プログラミングやITに関する知識、私なりの様々な学習方法、読書感想などを綴っていきます!

プログラミングはイメージが大事!

この記事では、

プログラミングで色々な文法習ったけど、中々理解出来ない。

簡単なプログラムを作りたいけど、どこから考えたら良いか悩んでいる。

という悩みを抱える方々に対して、その対処法の一部をご紹介します!f:id:keisuke-studyingIT:20200801163959p:plain

⑴プログラムをイメージで捉えよう!

どのプログラミング言語でも、初めて「変数」の概念を知った方は

「変数」は色々な値を収納出来る箱である

と教わった記憶があると思います。イメージ図としては以下の引用図の通りです。

f:id:keisuke-studyingIT:20200801085456g:plain

引用元:プログラミングとゲームの杜 様https://www.greenowl5.com/gprogram/basic/basic1_070.html

 プログラム文中で中身がちょくちょく入れ替わる変数のイメージを捉える方法としては、実に理に適っていると言えます。

 そこで、この様にプログラムの概念を常にイメージで捉える習慣をつけることをお薦めします。

例えば大抵のプログラミング言語で登場する「条件式」「繰り返し文」「関数(メソッド)」「配列」などの考えも、同様に図を用いてイメージするだけで大分理解度が変わってきます

 例えば、配列に関して見てみましょう。

まずは配列の定義:配列とは、同一の型のデータをメモリ上に一列に並べたものである。

・・・初めて学ぶ際は頭を抱えてしまいますね…

イメージ図は以下の引用図です。

f:id:keisuke-studyingIT:20200801083904j:plain

引用元:もう一度基礎からC言語 様https://dev.grapecity.co.jp/support/powernews/column/clang/022/page02.htm

 大分、スッキリしますね。今後は配列を扱うときは常に上の図をイメージしてみると、思考がまとまりやすくなると思います!

他の文法に関するイメージ図も、上の引用図と同様にネット上に沢山存在します。悩んだときは探してみることをお薦めします!

⑵プログラムのソースコードをイメージで追ってみよう!

プログラムのソースコードを読む鉄則は「常に今、何をしているのか?」考えることです。

文法が一つだけ出てくる程度の短いソースコードでしたら、その内容を捉えるのは容易です。しかし、条件式(IF文など)などが幾つも重なった多少複雑な文を読む際には「何がどうなっているのか分からない」と悩む方も多いでしょう。

そこで用いるのがフローチャート図です!

例えば、以下のif文が入れ子構造になったJavaソースコードを見てみます。

f:id:keisuke-studyingIT:20200801092537p:plain

引用元:神田ITSCHOOL IT教育専門研修機関 様

https://kanda-it-school-kensyu.com/java-super-intro-contents/jsi_ch06/jsi_0605/

 条件文に慣れ親しんだ方でしたら、この引用文は理解出来るかも知れません。

しかし、もっと複雑な条件式は沢山存在します。ここでは「ソースコード対するフローチャート」を見てみましょう。

f:id:keisuke-studyingIT:20200801093215g:plain

引用元:神田ITSCHOOL IT教育専門研修機関 様

https://kanda-it-school-kensyu.com/java-super-intro-contents/jsi_ch06/jsi_0605/

 これがフローチャート図です。プログラム文中の流れが可視化されて理解しやすくなっていますこれよりもっと複雑なソースコードを読む際も、同様のフローチャート図を考えることで理解が深まる場合も多いです。

なお、フローチャート図で用いられる規則は以下の引用図の通りです。

 

f:id:keisuke-studyingIT:20200801093603p:plain

引用元:ITパスポート試験対策BINARY 様

https://www.sophia-it.com/it-passport/

⑶プログラム文の設計書を作ろう!

IT企業がアプリケーションなどを開発するプロセスの一つに「詳細設計」という工程がございます。プログラマー達が実際にプログラミングによるコーディングを行う前に、「アプリケーションの機能の実装に必要な、書くべきコードを洗い出す」工程です。

企業で作る様な大掛かりなプログラムでは画面遷移図や詳細設計書などを細かく記載する様です。我々も個人でアプリケーションを開発しようとなると、そういった設計書を考えることでしょう。

しかし、今回は考え方を学ぶことに焦点を置くためにフローチャート図を用いた設計書の書き方をご紹介いたします

先に完成図からご紹介します。以下の引用図の通りです。

f:id:keisuke-studyingIT:20200801100756p:plain

引用元:エンジニアの入り口 リナックスアカデミー 様

https://eng-entrance.com/programming_flowchart

 書き方は⑵の後半で説明したフローチャート図の規則に乗っ取って、

1.必要な機能を洗い出す(とりあえず紙にメモ書きしていく)

2.それらを実行される順番に一本道で並べてみる

3.条件式が登場する場合、分岐した場所から別の枝を用意する

4.フローチャート図の図形の中に詳しい条件式などを記述していく

大体、この流れで完成します。

何の設計図もない状態でプログラムを書き出すより、上の引用したフローチャート図を自分で作成して参照した方が遥かに効率よくプログラムを作成ことが出来ます!

 

以上がプログラミングでイメージを用いるメリットです。

難しい概念は簡単な物事に例えると理解が進むことが多いです。それと同じ様に、複雑なプログラムの流れでも、図に書いて考えるとあっさりと理解出来てしまう場合もあります今後は是非、常にこれらの図を用いてプログラミングの勉強をされることをお薦めします!