Chapter1: イントロダクション
- 基本的にはJavaScriptの歴史
- 初学者の１割はここで落ちる感じ
###攻略法
- 理解しないくらいで読む
- 本気で理解しにかかると、最終Chapterにいけなさそうなのでサラサラ読む
- 基本的にはベテランが喜びそうな内容になっています。
自分メモ
ECMAScript2015とは
- 遊戯王カードの禁止カードとか、準制限カードみたいなルール変更みたいなこと（たぶん）
- 初学者の１割は脱落していきます。（昔の遊戯王カードのルールを知らないので）
- 詳しくはES2015 (ES6)についてのまとめに綺麗にまとめてくださっているので、初学者のみなさんもよく読むようにね
- どうしてもドヤ顔したい場合は、このように回答しておけば良いです。
🤔< ECMAScript２０１５って知っている？
😏< お、渋いね。ES6って普通言うよね。ジャヴァスクのスピードについていくのまじ大変だわー。
Chapter2: 基本的な書き方を身につける
- ここではJavaScriptの基本的な記法などが説明されています
- 結局自分で触って見ない限り、完全な理解を得ることは難しいです
- そのため、初学者の２割はこのチャプターを無限ループしてしまい、この本を終了することになります
###攻略法
- 理解しないくらいで読む
- 本気で理解しにかかると、次のChapterにいけなさそうなのでサラサラ読む
- 他の言語を勉強済みの人には、ほー、JavaScriptだとこう書くのか！と気づきになっていいかもです
自分メモ
数値リテラルについて
- 普段あまり、2進数・８進数・16進数のことを意識することがなかったので、この記法はメモ
| 表記例 | 用途 | |
|---|---|---|
| 10進数 | 42 | 数値 |
| 2進数 | 0b0001 | ビット演算など |
| 8進数 | 0o777 | ファイルのパーミッションなど |
| 16進数 | 0xEEFF | 文字コード、RGB値など |
インクリメント演算子
- 書き方によって、インクリメントされるタイミングが異なるので注意
- PHPの記事になるが、++$varと$var++の違いが参考になるので読みましょう
分割代入
ES６から導入されました！
何が嬉しいのか、 僕にはまだわかりません。
特に「...other」っていつ使うんだろって感じです。
let data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let [x0, x1, x2, x3, x4, x5, x6, x7, x8, x9] = data
console.log(x0); //1が表示される
let [y0, y1, y2, ...other] = data
console.log(y0); //1が表示される
console.log(y1); //2が表示される
console.log(y2); //3が表示される
console.log(other); //[4, 5, 6, 7, 8, 9, 10]が表示される
ちなみにJavaScriptさんは、ちぐはぐな関係でも、いい感じに色々やってくれるようです。
let data = [1];
let [x0, x1, x2, x3, x4, x5, x6, x7, x8, x9] = data
console.log(x0); //1が表示される
console.log(x1); //undefinedが表示される
ただし、宣言してない要素に対しては、エラーになる模様です。
let data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let [y0] = data
console.log(y0); //1が表示される
console.log(y1); //Uncaught ReferenceError: y1 is not defined
ショートカット演算
- 非推奨記法らしい。英語のスラングみたいな感じでしょうか。（Hey,dude. What’s up?みたいな）
- 読みづらいというか、脳内パワーの消費量が多そうです
- 素直にif文を書いた方が良いです
- これ使うくらいなら「三項演算子」のがいいと思います
- 左式だけ評価されて、右式は無視されるケースがあります。下に例を書きます
let x = 1;
x === 2 && console.log('おはよう'); //何も表示されない
x === 1 && console.log('こんばんは'); //「こんばんは」と表示される
let y = 1;
y === 2 || console.log('おはよう'); //「おはよう」と表示される
y === 1 || console.log('こんばんは'); //何も表示されない
delete演算子
- 指定した配列要素やオブジェクトのプロパティを削除してくれる
- 削除に成功すると「true」、失敗すると「false」と教えてくれる
- 別に教えてくれなくてもいいと思ったけど、if文とかの判定で使えそうですね。
配列の要素を削除した場合、該当する要素が削除されるだけ。削除されたインデックス番号は永久欠番
var ary = ['お雑煮', 'おせち', '門松']
console.log(delete ary[1]); //true
console.log(ary) //[ 0:'お雑煮', ２：'門松']と表示される
プロパティを削除した場合、プロパティ自体が削除されるだけで、プロパティが参照するオブジェクトが削除されるわけではない
var obj1 = {x:1, y:2}
var obj2 = {x:obj1, y:2}
console.log(delete obj2.x); //true
console.log(obj2) //{y:2}と表示される
for...of命令
- Coming Soon
まとめ
- 他の言語と近い構文が多いです。
- ただし、ES６で追加になった構文もあるため、使いながら覚えるしかなさそうです。
- 初学者の３割はここを無限ループすることでしょう