Remove all `Function.prototype` methods from Typescript

Can a callable object (function) be created without utilizing Function.prototype methods?

let callableObject = () => 'foo'
callableObject.bar = 'baz'

callableObject() // 'foo'
callableObject // {bar: 'baz'}
callableObject.call // error

An attempt was made with the following code but it did not succeed:

type ExcludeFunctionPrototypeMethods<T extends () => any> = {
    [K in Exclude<keyof T, keyof Function>]: T[K]
}

function f<T extends () => any>(t: T): 
ExcludeFunctionPrototypeMethods<T> {
    return {} as any
}

f(() => {})() // the methods are excluded, however,
  calling it results in an error message "Cannot invoke an expression whose type lacks a call signature. Type 'ExcludeFunctionPrototypeMethods<() => void>' 
  has no compatible call signatures."

Therefore, perhaps the question should also ask "how do I add call signatures to the type?"

Answer №1

One possible solution is as follows:

function myFunction () {
  console.log('example');
}

Object.setPrototypeOf(myFunction, null);

// The function still executes
myFunction();

console.log(Object.getPrototypeOf(myFunction))

In this example, Object.setPrototype() is used to explicitly set the prototype of the function object to null.

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

Developing a unique TypeScript singleton pattern tailored for multiple PouchDB instances

I have developed a node application that interfaces with multiple databases. I've designed a class which allows me to create various databases effortlessly, as they share similar CRUD operations. The Class: class DatabaseService { private dbName: ...

Querying Cloud Firestore with User ID

I'm facing an issue with retrieving a subset of data based on the first letter of the name and including the UID of the document. No matter what I try, it just returns empty data. fetchDataByFirstLetter(firstLetter: string) { this.afs.collection(&a ...

What is the process of creating a for loop in FindById and then sending a response with Mongoose?

Is there a way to get all the data in one go after the for loop is completed and store it in the database? The code currently receives user object id values through req.body. If the server receives 3 id values, it should respond with 3 sets of data to th ...

No default export found in Module: TypeScript RestAPI

The word controller is showing a red underline when I use import controller from '../controllers/test.controller'; In my typescript rest api application, the structure looks like this... project structure I am puzzled by the red line under cont ...

Reacting like sticky bottoms and tops

I'm working on a react/tailwind project that involves a component I want to be fixed at both the top and bottom of the screen. In simpler terms, there's an element that I need to always stay visible even when the user scrolls up or down the page ...

Using Angular to access HTML content through the .ts file

Is there a way to retrieve the value of the input field [newUser] when clicking on the button and executing the action [onAddUser()] in the .ts file? <input type="text" ng-model="newUser" style="text-align:center"/> <button (cl ...

Is there a way to utilize req.query, req.params, or req.* beyond its original scope without the need to store it in a database?

Looking to streamline my code and apply the DRY pattern, I've been working on creating a helper function for my express http methods. The structure of each method is similar, but the req.params format varies between them. Here's how I attempted t ...

Modify the title and go back dynamically in the document

I am currently working on a timer app where I want to dynamically change the document title. The app features a countdown timer, and during the countdown, I was able to display the timer in the document title successfully. However, once the countdown is co ...

Uploading CSV files in Angular 4

I am currently working on an Angular4 project where I have implemented a feature that converts data into a CSV file with a header. Now, I am looking to reverse this process and allow users to upload a CSV file instead. To test this functionality, I create ...

The Angular Material Autocomplete component fails to show items upon upgrading the angular/material package to the newest version

Issue with Angular Material Autocomplete component not displaying items after updating angular/material package to the latest version. The autocomplete was functioning correctly with "@angular/material": "^2.0.0-beta.10" but encountered issues when update ...

How can we design a Protobuf structure for a map that contains an array of objects as the value?

I need help with encoding a map in a protobuf format. Here is an example of the map: const newVisMap = new Map<number, IOutput[]>(); The map contains an array of objects that share a common interface, as shown below (with one optional property): int ...

Typescript is struggling to accurately infer extended types in some cases

My goal is to optimize the body of a NextApiRequest for TypeScript. I currently have this code snippet: // This is a type from a library I've imported export interface NextApiRequest { query: Partial<{ [key: string]: string | string[]; ...

Managing DOM elements within a Vue 3 template using Typescript

As I delve into the world of Vue 3 as a beginner, I encountered a challenge when it came to managing the DOM within Vue 3 templates. Let's take a look at the source code. MainContainer.vue <template> <div class="main-container" r ...

What is the best way to reference typescript files without using absolute paths?

As typescript does not seem to have built-in support for absolute path references (according to this GitHub issue), it becomes difficult to organize and maintain my file references. With TypeScript files scattered across various locations in my folder stru ...

How to handle an already initialised array in Angular?

I came across an interesting demo on exporting data to Excel using Angular 12. The demo can be found at the following link: This particular example utilizes an array within the component TypeScript file. import { Component } from '@angular/core' ...

What is the best way to retrieve the chosen item within a Tabmenu component in Primeng?

I have created a simple array of MenuItem objects to populate the Tabmenu component from Primeng. Here is an example: .ts file: items = MenuItem[]; activeItem = MenuItem; //constructor, etc... ngOnInit() { this.items = [ {label: &a ...

Converting JSON to string in Typescript is causing an error where type string cannot be assigned to type '{ .. }'

Here's the code snippet I'm working with: interface ISource extends IdModel { source_type_id: number; network_id: number; company_connection_id: number; feed_id: number; connection_id: number; feed_ids: number[]; name: string; tag ...

I continue to encounter the same error while attempting to deliver data to this form

Encountering an error that says: TypeError: Cannot read properties of null (reading 'persist') useEffect(() => { if (edit) { console.log(item) setValues(item!); } document.body.style.overflow = showModal ? "hidden ...

Issues with applying different styles in a React Component based on prop values are hindering the desired outcome

I am currently working on a Display component that is supposed to show an item. The item should be styled with the css property text-decoration-line, applying line-through when the Available prop is set to false, and no decoration when set to true. Howev ...

Is it possible to update the text within a button when hovering over it in Angular?

I'm looking to update the text displayed inside a button when hovering over it, similar to the examples in these images. I have already implemented the active state, but now I just need to change the text content. <button type="submit" ...