If I want to define the type of a variable that will be used with setInterval in the following code snippet:
this.autoSaveInterval = setInterval(function(){
if(this.car.id){
this.save();
}
else{
this.create();
}
}.bind(this), 50000);
What type should be assigned to this.autosaveInterval variable?
Arriving tardy to the gathering, however, the optimal selection (particularly due to its opacity where our main concern is passing it to clearInterval() later) could potentially be the automatically discerned type, for example:
ReturnType<typeof setInterval>
The specific type required is determined by the function being employed, with 2 available options. The return type is highlighted in a red bounding box:
https://i.sstatic.net/KOQrY.png
To utilize the option that returns a number, kindly use:
window.setInterval(...)
This data is classified as numeric;
let autoSaveFrequency: number = setInterval(() => {
console.log('123');
}, 5000);
In my opinion, NodeJS.Timeout and window.setInterval are both valuable tools in JavaScript:
const nodeInterval: NodeJS.Timeout = setInterval(() => {
// perform a task
}, 1000);
const windowInterval: number = window.setInterval(() => {
// perform a task
}, 1000);
When dealing with a scenario like this, it is best to consider it as an opaque handle rather than getting caught up in trying to match types between windows and node environments. Simply utilize the following code snippet to efficiently tackle the issue:
let timerHandle: any = null;
function start() {
timerHandle = setInterval(...);
}
export function stop() {
if (timerHandle) clearInterval(timerHandle);
}
One of the key points made in previous responses is that the type of setInterval can be either :number or :NodeJS.Timer.
If you are interested in utilizing setInterval with a combination of React and Typescript, here's some additional insight:
const Clock: React.FC = () => {
const secondsRef = useRef<NodeJS.Timer>();
useEffect(() => {
secondsRef.current = setInterval(() => { // correct type inference without errors
// perform your operations...
}, 1000);
}, []);
return (
<div>
{/* your jsx content... */}
</div>
);
};
export default Clock;
I trust that someone will benefit from my explanation... happy coding :)
After encountering an issue while running the app
id: number;
this.id = setInterval(...)
I discovered a Type 'Timeout' is not assignable to type 'number' and found a helpful solution at that resolved the problem for me.
The setInterval type in Node.js is known as NodeJS.Timer
Learn how to use the typeof operator to determine the data type of a variable:
The typeof operator is an unary operator that comes before a single operand which can be of any type. It returns a string indicating the type of the operand.
var example1 = "Hello";
var autoSaveTimer;
this.autoSaveTimer = setInterval(function(){
if(this.car.id){
this.save();
}
else{
this.create();
}
}.bind(this), 50000);
console.log("Type of 'example1': " + typeof(example1))
console.log("Type of 'autoSaveTimer': " + typeof(autoSaveTimer ))Currently in the process of developing a .NET Core application with Angular and Ignite UI. I was wondering if there is a way to execute a function in the background without requiring the webpage to be open. For instance, would it be feasible to automatica ...
I recently implemented a table using Vuetify in my project. The table is now split into two components - the Table component and the Row component. My challenge is how to handle the same function, this.selected = !this.selected!, when dealing with 2 differ ...
I'm struggling to solve a seemingly simple issue. I have an array that looks like this: Array 1: [ { "id": 1, "date": "2019-03-27", "time": 1, "max_tasks": 3, "reservations": [ 5, 2 ...
<script type="text/javascript"> $(function(){ $("a[rel='tab']").click(function(e){ e.preventDefault(); pageurl = $(this).attr('href'); $.ajax({url:pageurl+'?rel=tab',success: function(data){ $(&apos ...
Is it possible to add a hash to the URL without scrolling the page using JavaScript? I navigate to the page I scroll down I click on a link that adds a hash (for example: http://www.example.com/#test) The page should not scroll back to the top. What is ...
Currently, I am engaged in a Django project that utilizes Vue.js for the frontend. Whenever I refresh the page, I encounter the "[WDS] Disconnected!" error. Despite the website's full functionality and absence of issues, this error appears every time ...
I want to achieve an automatic scroll to the beginning of a loaded page after using ajax to load it. Here is the code snippet I currently have: html <button class="btn btn-info btn-lg" type="button" id="photos"> <i class="fa fa-plus fa-5x">&l ...
Currently, I am in the process of setting up a basic node application where visitors can interact with a letter counter on the site. The idea is that every time someone presses a letter, the counter will increase and all users will be able to see it go up ...
I'm trying to implement the favoriting feature following a tutorial, but I'm encountering issues with making it work. Any assistance would be greatly appreciated. Thank you! UserSchema: var UserSchema = new mongoose.Schema({ username: {type ...
I am looking to add a click event to my custom dropdown, which replaces a SELECT element. The purpose of this click event is to trigger the corresponding OPTION item when an LI element is clicked. It seems like Woocommerce uses some JavaScript or PHP func ...
Currently working on my first website using Next.js and experiencing poor performance scores after running a lighthouse test. The issue seems to be related to unused JavaScript files located in the chunk folder. I've come across suggestions to split t ...
I have an array of objects with the same key name. My goal is to pass each address key inside those objects as a parameter to my API. How can I achieve this? The response I receive looks something like this: { '0': { address: 'abcd' }, ...
I've been working on creating a function that will return the value of a mysql query using promises. Here's what I have so far: query(query: string): string { var response = "No response..."; var sendRequest = (query:string): Prom ...
I created a CardList and attempted to add cards into the list using map, but encountered an error import React from 'react'; import Card from './Card'; const CardsContainer = ({robots}) => { const cardComponents = robots.map((r ...
Hey everyone, I'm trying to adjust the color of a button on my webpage based on the response I receive from this.responseText. I understand the JSON response, but for some reason, I can't seem to incorporate it into my code. If anyone could lend ...
I am facing an issue with passing an image object from an external web service through a node express route. The specific problem I am encountering involves retrieving an image from a URL and attempting to pass it as is, but it seems to be not functioning ...
I'm trying to figure out how to create the table below using ng-repeat. Unfortunately, I don't have permission to modify the json structure so I need to work with it as is. Here's my json: $scope.carCollection = { 'Toyota': [ ...
I'm having an issue with mongo's $addToSet function not properly adding a Store to my stores array (where I have commented out seemed to work), resulting in duplicate IDs. Can anyone help me identify my mistake and suggest a solution? Thank you. ...
I have a backend system where I store a number representing a selected object, which I am trying to display in a select option using Angular. Currently, the select option only displays a list of items that I have predefined in my TypeScript code using enu ...
Currently utilizing the Subject observable provided by rxjs. In my component, I have implemented two methods. Search search(terms: Observable<string>) { return terms.pipe( debounceTime(400), distinctUntilChanged(), switchMap(term => ...