Notion にまとめていたものを少しずつ移行中。後ほど解説も追加します。
https://www.jschallenger.com/javascript-dom-exercises/recursive-functions

Fundamentals 編

JSchallenger にチャレンジ - Fundamentals / Basics
JSchallenger にチャレンジ - Fundamentals / Arrays
JSchallenger にチャレンジ - Fundamentals / Objects
JSchallenger にチャレンジ - Fundamentals / Dates
JSchallenger にチャレンジ - Fundamentals / Sets

DOM 編

JSchallenger にチャレンジ - DOM / DOM selector methods
JSchallenger にチャレンジ - DOM / Events and user interactions
JSchallenger にチャレンジ - DOM / DOM manipulation
JSchallenger にチャレンジ - DOM / DOM fundamentals
JSchallenger にチャレンジ - DOM / Recursive functions

Stop and restart the moving button

This is a good exercise to learn about recursive functions. The function move in the code below moves the button 1px to the left or the right. It is recursive because it calls itself again and again. This keeps the button moving.

Extend the JavaScript code. Once you click the button, it should stop moving. When you click it again, it should move again. Confirm your code by clicking the button twice.

const button = document.getElementById('button');
let stopped = false;
 
function move ( isReturning ) {
 const width = button.parentNode.clientWidth ;
 const left = parseInt ( button.style.left , 10 ) || 0;
 if (! stopped ) {
    button.style.left = ( isReturning ? left - 1 : left + 1) + 'px';
    setTimeout (() => move (( isReturning && left > 0) || left === width - button.clientWidth ),10);
 };
};
 
move();
 
button.addEventListener('click', () => {
  // type in your code here
  stopped = !stopped;
  move();
});