Home > Mobile >  Is there way to create types like Array in typescript
Is there way to create types like Array in typescript

Time:09-06

Is there a way to create type in typescript with methods that when I call these methods, they have access to the variable's value? Equals what the array, for example, which has the method find.

Example:

const arrayVar: Array = [1,2,3];

array.find(el => el === 1); 

In this case, find has access to the value of the array arrayVar without me having to pass it via a parameter to a function, for example, I wanted to create something in this way, for example:

const myVar: MyCustomType = 5;

myVar.add(2); // Nesse caso, o retorno seria 7. 

I know it can be done with classes and functions, but then I would have to pass the value of "myVar" as a parameter (function add (value1, value2), for example), I wanted a way to access it directly, just like the type Array does in its methods.

CodePudding user response:

To make a subclass of Number with new methods:

class SwagNumber extends Number {
  add(number: number) {
    // Tell the TS compiler that `this` is an unboxed Number
    return (this as unknown as number)   number;
  }
}

Then to use:

const six = new SwagNumber(6);

six will be typed to SwagNumber by the TS compiler.

And to show it works:

six.add(5)
> 11

Let's look at the Constructor used, part of the Class:

> six.constructor
[class SwagNumber extends Number]

This will also leave the original Number prototype unchanged, which will stop any potential issues (double dots are used to use a method on a number, to distinguish the dot from a decimal point!)

> 3..constructor
[Function: Number]

or:

> (3).constructor
[Function: Number]

See Classes on MDN

However there's some danger here

Since SwagNumber is an object, and a regular number isn't an object by default (until you call its methods), comparisons won't work properly:

> six === 6
false

See Why should you not use Number as a constructor?

CodePudding user response:

You could do this by adding your add method to a prototype:

interface Number {
    add: (val:number) => number;
}

Number.prototype.add = function(val:number): number{ 
    
  return (this as number)   val;
}

var myVal: Number = 5
console.log(myVal.add(7))

TS Playground Link

CodePudding user response:

If you want to invoke functions on an object at this point create a dedicated class. Why? Because you have structured zone where you can add/remove/edit and reuse in other part of code.

Sorry, i write in JS but you can change with no effort in TypeScript

Create Class Element

class CustomArray {

    constructor() {
        this.arr = [];
    }

    add(value) {
        this.arr.push(value)
    }

    erase(){
        this.arr = [];
    }

    // so on...

    print(){
        console.log(this.arr)
    }

}

//I use Module, so i will use require.
module.exports = CustomArray;

The above class is simplest example. You can decorate with other functions. In theory as many as you want

FOR USE INSIDE OTHER CONTEXT

const CustomArray = require("./CustomArray");

var arr = new CustomArray();
arr.add(2)
arr.print()

  • Related