JavaScript コーディング練習

まず定義

JavaScript とは何か

JavaScript は、コンピューターに正確な手順を伝えるためのプログラミング言語です。最初は暗記ではなく「入力、手順、出力」の流れだけをつかみます。

最小実行情報ファイル app.js実行 node app.js習慣抽象化する前に console.log と開発者ツールで値を確認する

プログラム

順番に実行される命令の集まりです。入力を読み、処理し、出力します。

値と変数

値はデータです。変数はそのデータにつける名前です。

関数

小さな仕事をまとめたものです。入力を受け取り、結果を返します。

実行環境

ブラウザーコンソールまたは Node.js が app.js のコードを実行します。

最初に読むコード

値と変数

値変数文字列数値真偽値オブジェクト配列

const score = 40 + 2;
console.log(score);

出力 42

言語の系譜

JavaScript の系譜

JavaScript の出自、近い言語、次に学ぶ候補を一目で確認します。

起源

CJavaSchemeSelf

現在JavaScriptWeb と UI の言語ファミリー

近い言語

TypeScript Dart Lua PHP

ファミリーWeb と UI の言語ファミリー

向いている用途

向いている用途 Web アプリ、自動化、API 連携に使う言語

次に学ぶ

TypeScript Python Go

ゼロベース

1規則を一つ読む2出力を予測3記憶で入力4チェックを実行5一つ変えて反復

問題バンク

検索してから練習

段階を選ぶか、現在の言語の問題を検索して練習へ移動します。

18 件

プログラミング問題を検索

問 1選択第1段階定義

JavaScript 問題 1

JavaScript 問題 1 定数変数に最も合う説明を選んでください

問 2選択第1段階定義

JavaScript 問題 2

JavaScript 問題 2 関数の戻り値に最も合う説明を選んでください

問 3選択第1段階定義

JavaScript 問題 3

JavaScript 問題 3 配列の map に最も合う説明を選んでください

問 4選択第1段階定義

JavaScript 問題 4

JavaScript 問題 4 async await に最も合う説明を選んでください

問 5選択第1段階定義

JavaScript 問題 5

JavaScript 問題 5 定数変数に最も合う説明を選んでください

問 6選択第1段階定義

JavaScript 問題 6

JavaScript 問題 6 関数の戻り値に最も合う説明を選んでください

問 7選択第1段階定義

JavaScript 問題 7

JavaScript 問題 7 配列の map に最も合う説明を選んでください

問 8選択第1段階定義

JavaScript 問題 8

JavaScript 問題 8 async await に最も合う説明を選んでください

問 9選択第1段階定義

JavaScript 問題 9

JavaScript 問題 9 定数変数に最も合う説明を選んでください

問 10選択第1段階定義

JavaScript 問題 10

JavaScript 問題 10 関数の戻り値に最も合う説明を選んでください

問 11選択第1段階定義

JavaScript 問題 11

JavaScript 問題 11 配列の map に最も合う説明を選んでください

問 12選択第1段階定義

JavaScript 問題 12

JavaScript 問題 12 async await に最も合う説明を選んでください

問 13選択第1段階定義

JavaScript 問題 13

JavaScript 問題 13 定数変数に最も合う説明を選んでください

問 14選択第1段階定義

JavaScript 問題 14

JavaScript 問題 14 関数の戻り値に最も合う説明を選んでください

問 15選択第1段階定義

JavaScript 問題 15

JavaScript 問題 15 配列の map に最も合う説明を選んでください

問 16選択第1段階定義

JavaScript 問題 16

JavaScript 問題 16 async await に最も合う説明を選んでください

問 17選択第1段階定義

JavaScript 問題 17

JavaScript 問題 17 定数変数に最も合う説明を選んでください

問 18選択第1段階定義

JavaScript 問題 18

JavaScript 問題 18 関数の戻り値に最も合う説明を選んでください

選択問題

JavaScript 問題 1

問 1選択新規

問題

JavaScript 問題 1 定数変数に最も合う説明を選んでください

const total = 42;
console.log(total);

参考

app.js のパターン

ブラウザーコンソールまたは Node.jsnode app.js

記憶から書く小さな概念を見たら閉じて自分で再現します

コードを追跡実行前に変数の変化を一行ずつ追います

自分で入力コピーを減らし一つずつエラーを直します

値変数文字列数値真偽値オブジェクト配列

値と変数

const score = 40 + 2;
console.log(score);

まず const を使う
値が変わる時だけ let を使う
console.log で値を確認する

入力出力 return 再利用できる処理

関数

function add(a, b) {
  return a + b;
}
console.log(add(2, 3));

関数名は動詞で始める
各関数で出力せず値を返す
一つの関数は一つの役割にする

fetch Promise await エラー処理

非同期 API

async function load() {
  return await Promise.resolve("ready");
}
load().then(console.log);

ネットワークエラーを確認する
データを読む前に Promise を待つ
API 解析を分ける