一般的な JavaScript メモリ エラーと解決策

React をインポートし、{useRef} を 'react' から取得します。 
 
const タイマー = ({ cicles, onFinish }) => { 
    定数 currentCicles = useRef(0); 
 
    間隔を設定する(() => { 
        (currentCicles.current >= cicles) の場合 { 
            終了時に(); 
            戻る; 
        } 
        currentCicles.current++; 
    }, 500); 
 
    戻る （ 
        <div>読み込み中...</div> 
    ); 
} 
 
デフォルトのタイマーをエクスポートします。 

React をインポートし、{useState} を 'react' から取得します。 
'../styles/Home.module.css' からスタイルをインポートします 
'../components/Timer' から Timer をインポートします。 
 
デフォルト関数 Home() をエクスポートします。 
    const [showTimer、setShowTimer] = useState(); 
    const onFinish = () => setShowTimer(false); 
 
    戻る （ 
      <div className={styles.container}> 
          {表示タイマー? ( 
              <タイマーサイクル={10} onFinish={onFinish} /> 
          ): ( 
              <ボタンのクリック時={() => setShowTimer(true)}> 
                リトライ 
              </ボタン> 
          )} 
      </div> 
    ） 
} 

使用効果(() => { 
    定数intervalId = setInterval(() => { 
        (currentCicles.current >= cicles) の場合 { 
            終了時に(); 
            戻る; 
        } 
        currentCicles.current++; 
    }, 500); 
 
    戻り値 () => clearInterval(intervalId); 
}, []) 

'react' から useEffect をインポートします。 
 
エクスポートconst useTimeout = (refreshCycle = 100, コールバック) => { 
    使用効果(() => { 
        リフレッシュサイクル <= 0 の場合 
            setTimeout(コールバック、0); 
            戻る; 
        } 
 
        定数intervalId = setInterval(() => { 
            折り返し電話（）; 
        }, リフレッシュサイクル); 
 
        戻り値 () => clearInterval(intervalId); 
    }, [リフレッシュサイクル、設定間隔、クリア間隔]); 
}; 
 
デフォルトの useTimeout をエクスポートします。 

const handleTimeout = () => ...; 
 
タイムアウトを使用します(100、ハンドルタイムアウト); 

関数 homeShortcuts({ key}) { 
    if (キー === 'E') { 
        console.log('ウィジェットを編集') 
    } 
} 
 
// ユーザーがホームページにログインすると、document.addEventListener('keyup', homeShortcuts); が実行されます。  
 
 
// ユーザーが何か操作をしてから設定へ移動します function settingsShortcuts({ key}) { 
    if (キー === 'E') { 
        console.log('設定を編集') 
    } 
} 
 
// ユーザーがホームページにログインすると、document.addEventListener('keyup', settingsShortcuts); が実行されます。  

document.removeEventListener('keyup', homeShortcuts); 

関数 homeShortcuts({ key}) { 
    if (キー === 'E') { 
        console.log('ウィジェットを編集') 
    } 
} 
 
// ユーザーがホームに戻り、 
document.addEventListener('keyup', homeShortcuts);  
 
 
// ユーザーが何か操作して設定に移動します 
 
関数設定ショートカット({キー}) { 
    if (キー === 'E') { 
        console.log('設定を編集') 
    } 
} 
 
// ユーザーがホームに戻り、 
document.removeEventListener('keyup', homeShortcuts);  
document.addEventListener('keyup', 設定ショートカット); 

const ref = ... 
const 可視 = (可視) => { 
  console.log(`${visible} です`); 
} 
 
使用効果(() => { 
    （！参照）の場合{ 
        戻る; 
    } 
 
    オブザーバー.current = 新しい IntersectionObserver( 
        (エントリ) => { 
            エントリ[0]が交差している場合 
                表示される(true); 
            } それ以外 { 
                可視(false); 
            } 
        }, 
        { ルートマージン: `-${header.height}px` }, 
    ); 
 
    オブザーバー.current.observe(ref); 
}, [参照]); 

const ref = ... 
const 可視 = (可視) => { 
  console.log(`${visible} です`); 
} 
 
使用効果(() => { 
    （！参照）の場合{ 
        戻る; 
    } 
 
    オブザーバー.current = 新しい IntersectionObserver( 
        (エントリ) => { 
            エントリ[0]が交差している場合 
                表示される(true); 
            } それ以外 { 
                可視(false); 
            } 
        }, 
        { ルートマージン: `-${header.height}px` }, 
    ); 
 
    オブザーバー.current.observe(ref); 
 
    戻り値 () => observer.current?.disconnect(); 
}, [参照]); 

関数 addElement(要素) { 
    if (!this.stack) { 
        this.stack = { 
            要素: [] 
        } 
    } 
 
    this.stack.elements.push(要素); 
} 

var a = 'example 1'; // var が作成された場所にスコープが設定されます b = 'example 2'; // Window オブジェクトに追加されます

「厳密な使用」 

キャッチされない参照エラー: b が定義されていません 

定数要素 = []; 
const リスト = document.getElementById('リスト'); 
 
関数addElement() { 
    // クリーンノード 
    リスト.innerHTML = ''; 
 
    divElement を document.createElement('div') に設定します。 
    const element = document.createTextNode(`要素 ${elements.length} を追加`); 
    divElement.appendChild(要素); 
 
 
    リストに子要素を追加します。 
    divElement をプッシュします。 
} 
 
document.getElementById('addElement').onclick = addElement;