わからないコードを貼り付けるだけで、AIがその仕組みを丁寧に解説する。 ただ答えを教えるのではなく、自分で理解できるようサポートする。
array.reduce((acc, cur) => acc + cur, 0)このコードが何をしているか教えてください
一緒に読み解いていきましょう。
reduceは配列の要素を1つの値にまとめるメソッドです。acc(accumulator)とcur(current)はそれぞれ何を表していると思いますか?
貼り付けたコードの動作を、ステップバイステップで解説する
答えを教えるのではなく、質問を投げかけて理解を促す
学んだことを気づきカードとして記録し、振り返れる
3ステップで、コードの理解を深められる
理解したいコードをそのまま貼り付けるだけ。 どんなプログラミング言語でも対応している。 このコードは何をしている? なぜこう書くの? など、 自由に質問できる。
const debounce = (fn, delay) => {
let timeoutId;
return (...args) => {
clearTimeout(timeoutId);
timeoutId = setTimeout(() => {
fn.apply(this, args);
}, delay);
};
};このdebounce関数の仕組みを教えてください
一緒にdebounceの動きを追ってみましょう。
まず、timeoutIdという変数がありますね。 この変数は関数の外で定義されていますが、なぜだと思いますか?
AIは答えをすぐに教えない。 質問を投げかけ、ヒントを与えながら、 自分で理解にたどり着けるようサポートする。 わかったという瞬間を大切にしている。
対話の中で得た気づきは気づきカードとして保存できる。 後から振り返ることで、知識が定着し、 同じことで悩むことが減っていく。
クロージャで状態を保持する
debounceは内部関数が外部変数を参照することで、呼び出し間で状態を保持している
clearTimeoutでキャンセル
新しい呼び出しが来たら前のタイマーをキャンセルすることで、最後の呼び出しだけが実行される
教材のサンプルコードが理解できない時、AIが丁寧に解説してくれる。 一人で悩む時間を減らせる。
前任者が書いた複雑なコードも、AIと一緒に読み解ける。 ドキュメントがなくても大丈夫。
エラーが出ているコードを貼り付けて、 なぜそのエラーが起きているのかを一緒に考えられる。
レビュー対象のコードを事前に理解しておくことで、 より建設的なフィードバックができる。