一か月半かけて、 TS 本を写経した話 ツノ：@2nofa11

質問 どうやって開発言語の習得していますか？

「技術書」の読書術では プログラミング学習は以下の 3 つを意識する あくまで「手段」、「目的」を持つ 複数言語を習得する 動くものを作り、自分の手で確かめる

やったこと TypeScript を習得することを目的 「プロを目指す人のための TypeScript 入門」

具体的な写経内容 1. GitHub 上に Repository を作る 2. 書いてあるコードを黙々と写経＆コミット コミットメッセージ：p●● 気になったとことをメモ 3. 書いたコードで気になったところは、 console.log で途中結果を出す

ルール 毎日 1 コミット以上 どんなに自明な内容でコーディングする

写経達成！ 成果 ① 内容 ① 成果 ② 内容 ② 期間 9/28 ～ コミット 245 コミット ページ数 375 ページ ステップ数 1994 行 今年のコミット履歴

学んだこと例１-１ JavaScript の知識を学習（復習）することができた 分割代入（パターン = 式） ⇒ 実装できるレベルまで理解することができた const { foo, bar } = obj; // objのプロパティを変数に const { num, obj: { bar }, } = obj; // objのプロパティがネストしていても分割代入可能 const arr = [1, 2, 3]; const { first, second, third } = arr; // 配列を変数に

学んだこと例１-２ 非同期処理 ⇒Promise 文がスラスラ読めるようになった (前までは Promise チェーンへの理解が浅かった) const p = readFile("foo.txt", "utf-8") .then(() => sleepReject(1000)) .then( (result) => { console.log("OK"); }, (error) => { console.log("E",error); );

学んだこと例２ TypeScript が「型安全である」ということが腑に落ちた！ 写経前 文字列型や数値型があるから、JavaScript より安全...? 写経後 型レベルの算術やリテラル型＆タプル型を駆使すると、 大規模開発でもコードの揺れがなくなる！ TypeScript の解像度を上げることができた

学んだこと例３-１ TypeScript の便利な機能を学ぶことができた 関数型の部分型関係 ⇒ 型安全かつ、自由度の高い設計が可能になる type HasNameAndAge = { name: string; age: number; }; // S type HasName = { name: string; }; // T const fromAge = (): HasNameAndAge => ({ name: "John", age }); // 戻り値：S const f: () => HasName = fromAge; //SはTの部分型のため、戻り値TをSとみなせる

学んだこと例３-２ ジェネリクスと型引数 ⇒ 汎用性の高い関数が作成可能になる const generics = () => { function repeat(element: T, length: number): T[] { const result: T[] = []; for (let i = 0; i < length; i++) { result.push(element); } return result; } console.log(repeat("a", 5)); // 文字列型でも使用可能 console.log(repeat(0, 5)); // 数値型でも使用可能 };

課題 本の写経だけでは、100%理解はできない 現場のリアルなコードとは違う

学習方法自体の振り返り 登山のような達成感がある 正直、効率は悪い （自明でもコーディングする） でも、新たな発見があったりする （!!式 の仕組み等） 1 行 1 行の意味を理解して書いたのに、 忘れている部分も多数出てきている

EOL