JavaScript初心者に暗記してほしい構文 11選

先日「JavaScriptの本を写経しているけど正直身になっているか不安」という相談を受けました。
これ自体はプログラミング初心者なので仕方がないのですが、パラパラとページを捲りながら「じゃあとりあえず変数fooに文字列の”あいうえお”を入れようか」と言ったら手が止まってしまいました。過去にも別の人に「bazっていう関数を作って」と言ったらbuz{function[]}みたいなのが出てきて、「おぉ..」となりました。

なので英語の単語ドリルのように構文（書き方の形）だけを暗記することが、初心者にとって近道ではないかと思いました。

今回はJavaScriptのES5で書いていきます。
教えていてミスや質問が多かった部分などのコメントも書いたので、合わせて読んで貰えればと思います。

暗記ドリル

文字列の「あああ」、数字「12」、ブーリアンの「false」を適当な変数に入れて！

var str = 'あああ'; // 文字列はシングルコーテーションまたはダブルコーテーションで囲う。
var num = 12;
var bool = false;

適当につけた変数名「str」はstringの略です。stringは文字列という意味です。
変数名「num」はnumberの略です。numberは数字という意味です。
変数名「bool」はbooleanの略です。booleanはプログラミングでtrueかfalseという意味です。

空の配列と空のオブジェクトを適当な変数に入れて！

var arr = [];
var obj = {};

変数名「arr」はarrayの略です。arrayは配列です。
変数名「obj」はobjectの略です。objectはオブジェクトっていうものです。（今はそう覚えて！）

適当な変数に「5」を入れて、コンソールに出して！

var hoge = 5;
console.log(hoge);

hogeは日本のIT業界でよく一時的な変数の名前としてよく使われる単語です。意味のない単語なのでWebサイトを公開する時に残っていると偉い人に怒られます。

適当な名前の空の関数（ファンクション）作って！

// パターン1
function aaa() {}
// パターン2
var aaa = function() {}

パターン1とパターン2は厳密には違いがあるけど、一旦この２つの書き方がある事を覚えてください。

「あ〜お」の配列を作って、「う」をコンソールに出して！

var strs = ['あ', 'い', 'う', 'え', 'お'];
console.log(strs[2]);

配列の先頭は0から始まるので、strs[0]が「あ」、strs[1]が「い」、strs[2]が「う」になります。

Bookってオブジェクト作って、「title」ってプロパティに適当な名前を入れて！

var Book = {
  title: 'ワンピース'
}

titleの後ろは「:」です。「=」ではありません。

Carってオブジェクトに「run」ってメソッド作って！

var Car = {
  run: function() {}
}

Userってオブジェクトに「name」「tel」を作って適当な文字を入れて！

var User = {
  name: 'やまだ',
  tel: '090-xxxx-xxxx'
}

次のプロパティやメソッドを書くときは「,」を使います。 name: 'やまだ', ← これです。最後は入りません。

Userオブジェクトからnameをコンソールに出して！

var User = {
  name: 'やまだ',
  tel: '090-xxxx-xxxx'
}
// パターン1
console.log(User.name)
// パターン2
console.log(User['name'])

パターン１でも2でも、どちらでも構いません。

「id=‘btn’」のDOM取得して、適当な変数に入れてコンソールに出して！

// パターン1
var b = document.getElementById('btn');
console.log(b);
// パターン2
var b = document.querySelector('#btn');
console.log(b);

パターン1でも2でもどっちでも良いですが、DOMを取得と聞いたらパッとどちらも思いつくようにしましょう。

「id=‘btn’」にクリックイベントをつけて！

var b = document.getElementById('btn');
b.addEventListener('click', function() {});

まとめ

繰り返し書いて覚えている時はつまらないかもしれないけど、とりあえずここに書いてもらったものを暗記してもらえれば自分は説明しやすいです。
他にも覚えるべき構文などはたくさんありますし、「for」や「if」がないという人もいるかもしれませんが、そこの説明は楽なんですよね。そこまでたどり着く前に暗記しておいてもらえると、本当に助かると思ったものをピックアップしました。

これは知り合いを教えるためのテキストとして使用する目的で書きました。