### 目次 - プログラミングって? - プログラミングでできること - そもそも言語って何? - 重要な考え方 - 実践 --- ### 前提として デジタルは0と1の組合せによって出来ており、それをもとにpcができている。 --- 数学のように理路整然と一つずつ理解していかないと、応用が効かなくなる。 --- プログラミングって? --- ![](https://i.imgur.com/Q2xj7xy.png) --- どんなことができるのか?? --- - Webアプリ開発 - スマートフォンのアプリ開発 - AI(人工知能)開発 - ゲーム開発 - システム開発 <!-- 物流の配送管理システム 金融機関の入出金システム コンビニの商品管理システム --> --- そもそも言語って何? --- <!-- 一言でプログラミング言語とは何かを説明するのは難しいのですが、例をあげるとすれば人が話す言葉と一緒で、日本語、英語、ドイツ語など種類があります。その言葉によって特徴もさまざまで、使う単語も違います。 --> 言語によって特徴に違いがある --- - Webアプリ開発が得意な言語 - スマホアプリ開発が得意な言語 - ゲーム開発が得意な言語 - AI開発が得意な言語 --- 例えば... --- C言語だと,, - ロボット開発・組み込み系 - ソフトウェア開発・OS開発 この辺りが得意! --- javascriptだと,, - Webアプリ開発・Webサイト制作 - イベント処理 - 非同期通信 --- 重要な考え方 --- ### 暗記しない --- ### 理解する --- JavaScriptとは?? <!-- jsと呼ぶことにする. --> --- 主にユーザーの目に見える「フロントエンド」といわれる部分を開発するためのプログラミング言語 Webページに「動き」「変化」を出すことができる. <!-- さっき言語によって役割が違うといいましたが,それです. --> --- 特徴:非同期処理 地図アプリとかは読み込みをしなくとも表示される. <!-- javaやphpはスクロールをするたびに読み込みをしなければならない --> --- ![](https://i.imgur.com/GHrT4Wu.png) <!-- css Cascading Style Sheets Hyper Text Markup Language 例 ecサイト ネット通販 --> --- ちょっと注意点 昔はJavaScriptはフロントエンドだけだったが,「せっかくJSが書けるようになったからこれバックエンドでも同じような処理を書けるようになれば全部jsだけでかけるんじゃね??」 →今ではどちらも書ける. --- 最終目標 ``` javascript [1|5|8-10] let num1 = 1; let num2 = 3; // <課題1> // 変数名sumと変数名avgを定義して,それぞれsumはnum1およびnum2の合計. // avgはnum1とnum2の平均を代入して,数値をコンソールに表示しなさい. ``` --- 環境構築について --- 前提知識 いわゆるC言語とかJavaScriptとかいう言語は人間に読みやすように設計された言語であり、コンピュータは理解することができません。 --- コンピュータが理解できるのは、「0」と「1」で書かれた「機械語」と呼ばれるものです。 ※電気的なONとOFFが1,0に相当する. --- 人間が書いたコードをコンピュータに実行してもらうためには, プログラミング言語から機械語へ変換することが必要 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 変換するソフトウェアが必要! --- [a](https://ja.reactjs.org/docs/cdn-links.html) ![](https://i.imgur.com/APGgXRX.png) 変換するソフトウェアは「コンパイラ」と言われる.画像のように言語を使うには変換作業が必要. --- でも,Webページに「動き」「変化」を出すためだけに毎回変換するのはだるいし使わない. --- そこで、もっと手軽にプログラミングを利用するために使われたのが、「スクリプト言語」というもの! --- テキスト形式のソースコードを**そのままプログラムのように**実行できるのが特徴です。 ※実際には自動的に変換している. jsはスクリプト言語 <!-- そのままプログラムを実行しているわけではない. --> --- このようにソースコードをその場で順を追って解釈する形式を「インタープリタ方式」といいます。 ![](https://i.imgur.com/fKbQvNL.png) --- JavaScriptのソースコードはどこに記述させるのでしょうか? JavaScriptはHTMLのソースコードに直接記述する方法と外部のソースファイルを読み込ませる2つのやり方がある。 ![](https://i.imgur.com/ULCdihr.png) --- 結局環境構築ってなんなの?? --- 使う言語をダウンロード,インストールして,かつ機械語への変換に必要なもろもろの道具を自分のPC上に落としてきて、使えるようする作業と言えます。 --- 環境構築に必要なもの 1.node.js 2.Visual Studio Code 3.JavaScript --- ### node.jsとは? サーバ側で動くjsの環境 入れるとjsがターミナル,コマンドプロンプトで実行できるようになる. --- ### Visual Studio Code microsoftが開発したプログラムを書くためのエディタ vscodeと呼ばれる. イメージとしては超多機能プログラミング特化メモ帳 ※エディタって何やねん。 何かを編集するときに使うソフトの総称。 --- jsはmacやwindowsに標準で入っているので今回は入れなくてもよい <!-- システムかbit数を確認 --> <!-- mac アプリケーションフォルダに追加,dockに追加 --> <!-- dock→システム環境設定→セキュリティとプライバシー→一般→このまま開く --> <!-- 右上の検索からターミナルと検索  node --version --> --- 〜実践〜 --- プログラミングの基本構造 ![](https://i.imgur.com/zlC2QM2.png) --- 順次進行 ![](https://i.imgur.com/EpcMC2q.png) --- 条件分岐 ![](https://i.imgur.com/w88uWMe.png) --- 繰り返し ![](https://i.imgur.com/BkXexte.png) --- では実践 --- --- vscodeを入れた時点で日本語化拡張機能は入れる。 軽い計算が終わってから。 jsでの変数名の定義のルール --- 使えるもの - unicode - アンダーバー - $ ※大文字と小文字は区別される。 --- ### unicodeって?? Unicodeコンソーシアムという業界団体が定める、地球上の全ての文字を網羅する符号化文字集合(文字コード表)である。 [wikiによると、、](https://ja.m.wikipedia.org/wiki/Unicode) --- 使えないもの - 一文字目に数字がある。 - jsの予約語である。 ---
{"metaMigratedAt":"2023-06-17T04:43:16.027Z","metaMigratedFrom":"Content","title":"Untitled","breaks":true,"contributors":"[{\"id\":\"5f80877f-5840-4d3c-8ce5-a802be1c3c8d\",\"add\":3788,\"del\":470}]"}
    204 views