- 自分で書いたコードを、はじめて動かす
console.log( )で画面に文字を 出力 できる- 文字(もじ)と数(かず)のちがいが分かる
パソコンとブラウザ(Chrome など)をつかいます。15〜20分。
コードを試す「あそび場」を出す
じつは、いつも見ているブラウザの中に、コードを打って試せる場所がかくれています。コンソールといいます。まずこれを開きます。
- ブラウザでこのページを開いたまま、キーボードの
F12をおす(Mac は⌘ + option + J) - 出てきた画面の上の「Console(コンソール)」をクリック
>マークの横が、コードを打つところ!
はじめての命令
コンソールに、つぎをそのまま打って Enter をおしてみよう。
console.log("Hello!")
▼ こう出たら成功Hello!
console.log( ) は「カッコの中のものを、画面に出して!」という 命令。まさに「しょり → 出力」だね。
文字(もじ)と 数(かず)
さっきの "Hello!" には ダブルクォート(")がついていた。これは「これは文字だよ」という目じるし。文字のことをプログラムでは 文字列 と言います。
数はクォートをつけません。だから計算もできる↓
console.log(3 + 5)
// → 8 と出る(計算してくれる)
console.log("3" + "5")
// → "35" になる!(文字をくっつけただけ)
おなじ + でも、数ならたし算、文字ならくっつける。コンピューターはクォートを見て区べつしているんだね。
コンソールで、つぎの3つを自分で打ってみよう。
- 自分の名前を出す 例:
console.log("たろう") - すきな計算をする 例:
console.log(100 - 7) - 名前とあいさつをくっつける 例:
console.log("こんにちは、" + "たろう")
わざとまちがえてみよう: console.log(Hello!) とクォートなしで打つと、どうなる? 赤いエラーが出るはず。エラーはこわくない。「ここが分からないよ」とコンピューターが教えてくれているだけ。
💡 赤いエラーが出たら:その文を そのままコピーして AI にはって「これどういう意味?どう直す?」と聞いてみよう。エラー文を読む練習は、プログラミングでいちばん役に立つ力です。
console.log( )は何をする命令?(→ カッコの中を画面に出す)- 文字を書くとき、まわりに何をつける?(→ ダブルクォート " ")
"3" + "5"はなぜ35になる?(→ 文字どうしをくっつけたから)
つぎの回では、出した文字を「へんすう」という箱に入れて、つかい回せるようにします。