TypeScript/Javascript - Error: The specified function is not callable

After recently delving into TypeScript, I found myself encountering an error in my code for a wheel mini-game on my app. The specific error being displayed in the console is:

this.easeOut is not a function

The relevant portion of the code causing the issue is as follows:

spin() {
  const spinAngleStart = Math.random() * 10 + 10;
  this.spinTime = 0;
  this.spinTimeTotal = Math.random() * 3 + 4 * 1000;
  this.rotateWheel(spinAngleStart);
}

rotateWheel(spinAngleStart: number){
  this.spinTime += 30;
  if(this.spinTime >=  this.spinTimeTotal) {
    this.stopRotateWheel();
    return;
  }
  *const spinAngle = spinAngleStart - this.easeOut(this.spinTime, 0, spinAngleStart, this.spinTimeTotal);*
  this.startAngle += (spinAngle * Math.PI / 180);
  this.drawRouletteWheel();
  console.log(this.spinTimeTotal);
  console.log(this.spinTime);
  this.spinTimeout = setTimeout(this.rotateWheel, 30);
 } 

easeOut(t, b, c, d) {
   const ts = (t /= d) * t;
   const tc = ts * t;
   console.log(ts);
   console.log(tc);
   return (b+c * (tc + -3*ts + 3*t));
  }

Despite easeOut() residing within the same scope as rotateWheel(), the specified error points to the line highlighted with asterisks.

The error specifically targets the line marked with asterisks

Answer №1

To achieve the desired outcome, you can use either

setTimeout(() => this.rotateWheel(), 30)
or
setTimeout(this.rotateWheel.bind(this), 30);
. Failing to do so may result in this being bound to the window object (or global object in node) when rotateWheel is called.

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

c# JavaScriptConverter - understanding the deserialization of custom properties

I'm facing an issue where I have a JSON serialized class that I am trying to deserialize into an object. For example: public class ContentItemViewModel { public string CssClass { get; set; } public MyCustomClass PropertyB { get; set; } } Th ...

Troubleshooting: Jquery show effects not functioning as expected

Currently, I am facing an issue where I am attempting to display a fixed div using the show function of jQuery. Although the show function itself is working properly, when I try to include an effect from jQuery UI, it does not seem to work as expected. Bot ...

Using JavaScript to Capture a Webpage Element as an Image

Although this question has been asked in the past, I am hoping for updated information since all the answers are from a few years ago. While searching, I came across https://github.com/apollolm/phantasm, which seems to be exactly what I need. However, it ...

Utilize AJAX to update the database through a bootstrap modal interface

My current project involves creating a webpage to display database records with edit buttons that trigger bootstrap modals for user input and status changes. The goal is to use AJAX to update the database with any modifications made. However, I'm enco ...

Is there a way to highlight today's working hours with a different color using Vue.js?

Here is the script I have created to display the working hours: const workHour = "Monday :9:00AM to 5:00PM,Thursday :9:00AM to 5:00PM,Wednesday :9:00AM to 5:00PM,Tuesday : 9:00AM to 5:00PM,Friday :9:00AM to 5:00PM,Saturday :9:00AM to 5:00PM,Sunday :9:00AM ...

Using Ajax to return a Post type in c# mvc 4 instead of a value

Hey there, I seem to be encountering an issue that I could use some help with. $.ajax({ type: "POST", url: "/controller/CreateList", contentType: "application/json; charset=utf-8", traditional: true, ...

Avoid activating ng-blur when ng-keydown is triggered in AngularJS

Currently, I am working on a project involving angularJS and I am facing an issue with the execution of ng-blur conflicting with ng-keydown. The problem arises because ng-keydown causes the element to lose focus at a certain point. The HTML code in questi ...

Troubleshooting issue in Angular with loading data before rendering the view

Have you ever come across an issue where you navigate to a component and the table appears empty with no data? I noticed that the component/table is displayed, and the data seems to be in the state (session storage) and loaded. I can only see them if I re ...

Display/Hide Location Pins on the Map

Looking for some assistance, please. I'm currently working on a script to toggle the visibility of locations on a map. The main code I've been using can be found here, and my own code is displayed below: !DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

The process of importing does not produce the anticipated System.register

I'm a beginner with Angular2, currently learning and practicing by doing exercises. I am enrolled in a Udemy course and comparing my exercise progress with the instructions provided. Here is a snippet from my app.component.ts file: import {Component ...

Is it possible for me to save external CDN JavaScript files to my local system?

Normally, I would include scripts from other providers in my application like this: <script src="https://apis.google.com/js/api.js"></script> However, I am considering whether it is feasible to simply open the URL , and then copy and paste th ...

Why does the error message "$(…).functionName() is not a function" occur and what steps can be taken to prevent it from

I have encountered a console error message: $(...).functionName() is not a function Here is my function call: $("button").functionName(); This is the actual function: $.fn.functionName = function() { //Do Something }(jQuery); What ca ...

Can a JavaScript class have a property that returns an array?

To those more experienced in node red development, this may be obvious, but I'll ask anyway. Within my node red flow, I have a function node containing a javascript class that only exposes static members. Here's an example: class MeasurementsLis ...

Tips for testing an API that relies on an external library such as "<script src="http://stripe[...]"

Currently, I am working on unit testing an API call to verify it has been executed with the correct properties. The API call is reliant on Stripe's external library that is connected to the window through index.html src="http://stripe[...]". However, ...

Modify the text inside a div based on the navigation of another div

Hey there, experts! I must confess that I am an absolute beginner when it comes to JavaScript, JQuery, AJAX, and all the technical jargon. Despite my best efforts, I'm struggling to grasp the information I've found so far. What I really need is ...

The active tabs or placeholders do not update properly when I click on them

Is there anyone who can help figure out why the tabs are not functioning as expected? The goal is for the tabs to change the input field placeholder and perform a search based on the active tab. If you're able to assist, please review my complete cod ...

My extension seems to be missing the content script I uploaded

I am currently developing an extension for Google Chrome. My goal is to create a content script that can retrieve meta tags from the tab when the popup is clicked. In my manifest, I have included the following permissions: "content_scripts": [{ "js" ...

What is the reason behind having several node modules directories within every project?

I'm just starting out with JS development and I have a question about the size of node modules. It seems that when many projects accumulate, we end up having to delete the node_modules folder because it takes up so much space. So, why isn't there ...

Utilizing the dynamic pairing of Three.js and CSS3 to bring life to animated 3D objects

I am currently working on a project that involves creating 3D Lego elements and assembling them into a figure using animation. I have successfully modeled the elements in Blender and exported them as .obj/mlt files without any issues. However, when it come ...

Unable to make a jQuery Ajax HTTP Request within a Chrome extension

I'm facing an issue with sending a jQuery Ajax HTTP Request within google chrome extensions. I have already imported the jQuery library and used the following code: $.ajax({ method: "PUT", url: "https://spreadsheets.google ...