JavaScript Primerjsprimer.net
~こちらの書籍を読んだ感想~
良かったところ
- 暗黙の型変換ってそこまでやるのかというようなこれまで知らなかったことや、アロー関数と通常のfunctionでの定義の場合のthisの指すオブジェクトの違いなどの細かい点をいくつも学べたこと。
学んだこと
メモに残したものだけでも以下のような点を初めて知ったり、再認識したりできました。
const key = "Key1"
const value = "Value1"
const obj = { [key]: value }
- 取り出す際はブラケット記法なら動的にそのキーを変数やシンボルのまま書ける(
obj[Symbol]
の様に)が、ドット記法では静的な、キーが評価された値の方を使用する必要がある。
- Rest Parameters /
...args
のように...を使うことで残余引数を受け取れる
- 関数の引数の取り扱いに柔軟性があるjsではオーバーロードは存在しない(引数が少ない場合はundefined,多く場合は単に無視されるため)
- コールバック関数を引数として受け取る関数を高階関数と呼ぶ
式の最後には
;
が必要だが、ブロックで終わる文には必要ない
// learn関数を宣言する関数宣言文(;がいらない)
function learn() {
}
// 関数式をread変数へ代入(式で終わるため厳密には;が必要)
const read = function() {
};
- delete演算子の存在(
delete obj.key1;
)
-Object.hasOwnの使い方
const obj = {};
// objが"プロパティ名"を持っているかを確認する
Object.hasOwn(obj, "プロパティ名"); // true or false
- pushは元の配列に変更を及ぼし(破壊的変更)、concatは新しい配列として返す(元の配列に影響しない、非破壊的変更)
array.concat()
/ array.slice()
/ [...array]
はどれもarrayのコピーを作成できる。
filter関数のコールバックはbooleanを返す必要がある
const numbers = [0, 1, 2, 3, 4, 5];
const truthyValues = numbers.filter(number => number);
// truthyValues は [1, 2, 3, 4, 5] となる(JavaScriptでは0以外の数はすべてTruthy、0がFalstyのため)
難しかったこと
学んだことにも記載したthisが何を指すのかがコンテキストによって変わるということが難しかったです。
開発の際はデバッグをして確認しながら間違わないように使っていきたいと思います。