How to export a prototype method?

Question

I created a prototype method:

Array.prototype.remove = function(elementToRemove: any): void {
    var __idx = this.indexOf(elementToRemove);
    if (__idx >= 0) {
        this.splice(__idx, 1);
    } else {
        throw new Error(`Cannot find element ${elementToRemove}`)
    }
}

and I want to export it and use in another file. But I don't know how to add export to it:

both

export Array.prototype.remove = function(elementToRemove: any)

and

Array.prototype.remove = export function(elementToRemove: any)

doesn't work, I received 'Expression expected' Error. So how can I export it?

ps: I'm not using nodejs, I'm using web frontend in chrome with HTML and CSS.

score 2 · Accepted Answer · answered May 28 '22 at 17:18

2

The fundamental issue is that your code performs a side-effect - it adds something to Array.prototype.

One option is to export a function that, when called, adds the function to the prototype:

export const addRemoveToPrototype = () => {
  Array.prototype.remove = function( // ...

and then consumers can use it by doing

import { addRemoveToPrototype } from './addRemoveToPrototype';
addRemoveToPrototype();

Another option is to simply run that code at the top level of the module:

Array.prototype.remove = function(elementToRemove: any): void {

and then consumers can just import the module, but not do anything with it:

import './addRemoveToPrototype';

That said, I'd really recommend not mutating built-in objects - it makes the code fragile and more easily breakable, especially when other scripts run in the same environment.

answered May 28 '22 at 17:18

CertainPerformance

356,069
52
309
320

But I received 'Property 'remove' does not exist on type 'any[]'.' is that a problem? – Cflowe Visit May 28 '22 at 17:24
You would have to indicate to TypeScript that the property exists on the prototype - see https://stackoverflow.com/a/64522938 `declare global { interface Array ...` - but a much, much better approach would be not to mutate the prototype in the first place, and call a normal function to perform the logic instead. – CertainPerformance May 28 '22 at 17:26
For example, consider if you could instead do: `export const removeFromArray = (array: Array, elementToRemove: unknown) => {` and go from there – CertainPerformance May 28 '22 at 17:28
Problem solved, Thanks! And I think I should avoid to define at prototype – Cflowe Visit May 28 '22 at 17:30

How to export a prototype method?

1 Answers1