コードリーディングを学ぶ1

April 30, 2021

next.js

Overview

今回の目標。どんなものか、実際に体験してみる。当たり前だけど、目的意識を持ったほうが良い。でないと、どのコードを追うべきか、迷ってしまうらしい。まずはトライ。

Result

packagesディレクトリがある場合は、monorepoなリポジトリな管理をしている。

packages/next/clientで、基本的な処理を行っている、という推測をしているので、ひとまずそれを見てみる。

Note

JavaScript

slice.callとは。関数宣言とアロー関数式では、内部のargumentsの参照が変わるようだ。 Array.prototype.slice() JavaScript: 通常の関数とアロー関数の違いは「書き方だけ」ではない。異なる性質が10個ほどある。

for文の引数には複数指定できたのか。

for(let i =0, j = hoge; i < max; i++, j =!j){...}

React

typescript

d.tsファイルとは。

declareキーワードを使用して他の場所に存在するコードを記述しようとしていることをTypeScriptに伝えることができます。ファイルの拡張子が.d.tsの場合、各ルートレベルの定義にはdeclareというキーワードを前に付ける必要があります。 TypeScriptによって生成されるコードがないことを開発者に対して明確にするのに役立ちます。開発者は、宣言された項目が実行時に存在することを確認する必要があります。型定義ファイル - TypeScript Deep Dive 日本語版

asとは。 Type Assertion（型アサーション）

typescriptにおけるtypeofとは。型ガード

isとは。つまり関数に、引数 is 型 で定義すると、その関数を呼び出しているスコープ（ブロック）では、その型情報を参照出来るようになる。結果として、エラーにならない、ということかな。逆に、 What does the is keyword do in typescript? Advanced Types TypeScript の"is"と"in"を理解する

関数の戻り値にも型を定義できる。関数の型

export function hoge(){
 return {
  fuga: string;
 }
}

void型を返す場合、return文がない、もしくはundefinedを返す関数を定義しているのと同等だった。

const hoge: () => void
const hoge: (): void => {}

JSXのIntrinsicElementsのオブジェクトに対して、プロパティにHTML要素名を指定して、値に型を定義すると、JSXの属性を指定することができる。 JSX React

オブジェクトの!演算子とは。 nullやundefinedにならないことを定義するアサーションらしい。 Non-null assertion operator

other

monorepoとは。 babel | Why is Babel a monorepo?

PROSとCONSは、肯定と否定というか、そういう関係だ。アメリカ人が使う「Pros and Cons」の意味と使い方

単一のリポジトリで複数のモジュールやパッケージ（今回の場合は npm パッケージ）を管理する手法を Monorepo と呼んでいます。 LernaとYarn WorkspacesでMonorepo管理

Telemetry（遠隔測定法）とは。

遠隔測定法（えんかくそくていほう）は、観測対象から離れた地点から様々な観測を行い、そのデータを取得する技術である。遠隔測定法 - Wikipedia Next.jsは、一般的な使用法に関する完全に匿名のテレメトリデータを収集します。 Next.js - Telemetry

コンパイルエラーとランタイムエラー（実行時エラー）。コンパイルエラーは、文法的な間違いで起きるエラー。シンタックスエラー。（構文エラー）ランタイムエラーは、プログラムの実行中に起きるエラー。

Blog.