Error: Trying to use 'setTimeout' before it has been initialized is not allowed

I'm currently working on a JavaScript exercise in my code. I encountered an issue where I am trying to assign a reference to the setTimeout function to ogTimeout on the second line since I plan to redefine setTimeout later.

However, when I run the code, I receive the error "ReferenceError: Cannot access 'setTimeout' before initialization". While I understand that this error typically indicates that setTimeout needs to be initialized, it is already an existing function in this case, leaving me confused about what could be causing the problem.

Any assistance would be greatly appreciated. Thank you!

const timeouts = [];
const ogTimeout = setTimeout; 

let setTimeout = function(method, timeInMs) {
    const timeoutRef = ogTimeout(method, timeInMs);
    timeouts.push(timeoutRef);
}

const clearAllTimeouts = function() {
    while (timeouts.length) {
        const timeoutRef = timeouts.pop();
        clearTimeout(timeoutRef);
    }
}

setTimeout(() => console.log("Callback after 5 seconds."), 5000);

I've attempted to research the ReferenceError and its related details without success.

Answer №1

The statement indicates that setTimeout should be initialized, although it is already an existing function

No, the issue lies with the let setTimeout declaration made by you, which has not been initialized when const ogTimeout = setTimeout is executed. This results in an error due to accessing it during the temporal dead zone.

I will redefine a new value for setTimeout.

To overwrite the global setTimeout, do not declare your own variable. Remove the let and keep it simple:

setTimeout = function(method, timeInMs) {
    const timeoutRef = ogTimeout(method, timeInMs);
    timeouts.push(timeoutRef);
};

If you prefer clarity, you can also assign to the property of the global window object:

window.setTimeout = function(method, timeInMs) {
    const timeoutRef = ogTimeout(method, timeInMs);
    timeouts.push(timeoutRef);
};

Additionally, make sure to include return timeoutRef in your function to prevent any code from breaking.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How to update an object property in React using checkboxes

I am currently navigating the world of react and have encountered a challenging issue. I am in the process of developing an ordering application where users can customize their orders by selecting different ingredients. My approach involves using checkboxe ...

I am having an issue with my registration form in node.js where it does not redirect after submitting

I am currently working on implementing a registration form using node/express for my website. The routes are all set up and the database connection is established. However, I am encountering some issues when users try to submit the registration form on th ...

Preview of Live Iframe Display

Currently, I am in the process of developing a node.js website that enables users to create and customize their own page using a dashboard interface. One specific feature I would like to incorporate is a live preview capability, similar to what Shopify o ...

Is it possible to save jQuery plugin initialization settings for future use?

Is it possible to save a default set of settings for a lightbox jQuery plugin, including options and callback functions, in a variable or array that can be referenced later in different contexts with varying configurations? For example, could I initially ...

Having difficulty kicking off a fresh React project on Windows

I've encountered an issue while setting up my React application on Windows OS. After running npm start, the application fails to load on localhost:3000, showing the error message Cannot GET /. Below is the project structure: - webpack.config.js - p ...

Tips for saving information in an array with Vue.js?

I am working on a task where I need to fetch data from an API and store only the values that are marked as "true" in a variable. The API response is listed below: API Output Data { "BNG-JAY-137-003": false, "BNG-JAY-137-004": true, ...

Endless loop JSON vulnerability

I recently came across a discussion on Stack Overflow about Google's practice of prepending while(1); to their JSON responses. Can anyone provide guidance on what type of PHP script would be suitable for this situation? I attempted the following: $ ...

Pause until the array is populated before displaying the components

Currently, I am using firebase storage to fetch a list of directories. Once this fetching process is complete, I want to return a list of Project components that will be rendered with the retrieved directory names. How can I wait for the fetching to finish ...

Using Crawler4j, Jsoup, and JavaScript to retrieve modified attribute values

Currently, I am utilizing Crawler4j and Jsoup for web crawling and it's performing well with HTML text. However, some vital contents have default values hardcoded in CSS and then dynamically adjusted through JavaScript. For instance, there's a e ...

Determine whether the specified date falls on a public holiday within the selected

I'm currently working with Angular 12 and I need to determine whether today is a regular workday or a day off for employees, including weekends and public holidays. I attempted to use the date-holidays package by importing it like this: import Holida ...

Deactivate a chosen anchor button when clicked within a loop of elements

In my laravel project, I have a foreachloop that is rendering multiple buttons. I want to disable or remove only the button that is clicked, so I tried the following code: @foreach() <a onclick="remvebtn()" class="btn">My ...

How to retrieve the user-agent using getStaticProps in NextJS

Looking to retrieve the user-agent within getStaticProps for logging purposes In our project, we are implementing access and error logs. As part of this, we want to include the user-agent in the logs as well. To achieve this, we have decided to use getSta ...

What is the method for opening the command prompt while initializing a node.js server?

I've successfully set up a node.js server and now I'm looking to send a command to the prompt upon startup. This is something I couldn't manage while the server was already running. Should I be implementing this from within the server.js fi ...

Tips on how to utilize JavaScript to display data on a page without the need for refreshing, updating every 2-5

Could you please assist me? I am working on a CRUD application and have created a function called loaddata();. My issue is that when another user adds data, it should be displayed in my table without the need to refresh. Is there a way to achieve this? fun ...

What are the steps for implementing a equirectangular image in WebXR with three.js?

Currently, I am developing a web application with Three.js that requires the use of equirectangular images for panoramic tours. My goal is to incorporate a feature that allows users to switch between normal mode and VR mode similar to React360 and AFrame. ...

Running JavaScript code when the route changes in Angular 6

Currently, I am in the process of upgrading a website that was originally developed using vanilla JS and JQuery to a new UI built with Angular and typescript. Our site also utilizes piwik for monitoring client activity, and the piwik module was created i ...

Tips for displaying a JSON array on a web browser using a React component

My goal is to display a list of JSON data obtained from an API on the browser. I have successfully fetched the data from the REST API in the backend and now need to render it on the browser. Here is what I have learned and attempted: import React from &ap ...

Locating the Searchbox on Google Maps with the angular-google-maps library

I am currently working on positioning the Google Maps searchbox variable in a way that allows it to stay fixed under markers as they are listed. I am utilizing the Angular Google Maps library for this purpose, which provides a directive known as <ui-g ...

Delivering a Captivating JavaScript Pop-Up upon Page Loading

I have a simple pop up window (with no content) that triggers with the 'onclick' event. How can I modify the code below to make the popup appear automatically when the page loads? <head> <title>Popup Display</title> < ...

Implementing a line break within a JavaScript function specifically designed for formatting images

As I am not a javascript developer, the code I have been given for debugging is somewhat challenging. The issue at hand involves an iOS module where a .js CSS file has been set up and images are loading improperly, resulting in the need for horizontal scro ...