Theo's Typesafe Cult•3y ago

What's the best way to attach functions to a TypeScript interface?

So I currently I have game objects with properties attached. For example, a creature card with properties attached. Now I have code like this:

const isSlow = card.properties.includes(Property.Slow);

const isSlow = card.properties.includes(Property.Slow);

I kinda hate this, especially if I have to write code like this all over the place. Now ideally, I want to just put a predicate to the card so I implement it once and can just call

const isSlow = card.isSlow();

const isSlow = card.isSlow();

Is this possible with interfaces at all? Like an abstract prototype-ish implementation? Some caveats: - I cannot use classes, cause that messes up my Redux state management and jsonifying states in general. - I also considered utility classes like cardFunctions then I guess you could do

import { isSlow } from "./cardFunctions";
const isSlow = isSlow(card);

import { isSlow } from "./cardFunctions";
const isSlow = isSlow(card);

not the biggest fan but if that's the best there is I might go for it

8 Replies

Samathingamajig•3y ago

is Property an enum? wait if you're even considering utility classes why not just make the each function explicitly on the interface and on the class (and if there's only one implementer of the class, you probably dont need the interface) oh wait

I cannot use classes, cause that messes up my Redux state management and jsonifying states in general.

you can use the old fashioned prototype probably

function Card(props) {
  // initialize stuff here
}

Card.prototype.isSlow = function () {
  this.properties.includes(Property.Slow);
}

Card.prototype.isFast = function () {
  this.properties.includes(Property.Fast);
}

function Card(props) {
  // initialize stuff here
}

Card.prototype.isSlow = function () {
  this.properties.includes(Property.Slow);
}

Card.prototype.isFast = function () {
  this.properties.includes(Property.Fast);
}

and each time you create a card use

const card = new Card(props);

const card = new Card(props);

cyremur•3y ago

Yeah property is an enum Can I just make a prototype for an interface? VS Code seems very confused by that. I don't understand what the extra

function Card(props) {
  // initialize stuff here
}

function Card(props) {
  // initialize stuff here
}

is doing

Samathingamajig•3y ago

that's the constructor function interfaces are completely erased a compile time they aren't real they're just for typesafety you can't attach anything to the prototype of something that doesnt exist

cyremur•3y ago

let me read up if I can do class shenanigans in Zustand... I'm getting kinda tired of Redux

Samathingamajig•3y ago

redux is only for businesses in 2016

cyremur•3y ago

I procrastinated this project a lot

Samathingamajig•3y ago

do you even need a state management library, though?

cyremur•3y ago

it has a board with 127 fields and creatures and cards in hand so... probably also Redux/liveblocks gives me multiplayer for free but yeah I went for RTK before I got into webdev youtube and now it feels like debt already

Gaming

Programming

What's the best way to attach functions to a TypeScript interface?