IDisposable interface C# / Typescript

Može li mi netko pojasniti što je Disposable interface u C# kako se, kada i zašto koristi, načelno znam da je za oslobađanje memorije?

Te kako ga koristiti u Typescriptu odnosno u javascriptu?

Otprilike.
Taj dispose pattern obicno koristis npr. kad se zelis unsubsribe-ati sa odredjenog eventa i samim tim preventirati memory leak.

U JS/TS mozes to postici na jednostavan nacin.

const handler = (): (() => void) => {
   const listener = (event: MouseEvent) => {
      // logic
   }
   document.addEventListener('mousedown', listener)
   return () => document.removeEventListener('mousedown', listener)
}

Kao sto vidis handler funkcija takodjer vraca funkciju, koja upravo brise event listener koji je kreiran, i ako ti invoke-as tu funkciju koja je vracena tim ces pocistiti event listenere i samim tim izbjeci memory leak.

Recimo da imas React komponentu

import { handler } from '.../somewhere'

class Example extends React.Component {
   private dispose: () => void

   public componentDidMount() {
       this.dispose = handler()
   }

  public componentWillUnmount() {
      // ocisti event listener, jer nam ne treba nakon sto je komponenta unistena
     this.dispose()
  }   
}

Pronadjoh i ovo, valjda je to kako u C# izgleda

1 Like

Pozdrav, i hvala na odgovoru. Nisam stigao ranije odgovoriti ali sam htio.

Da li to znači da je to funkcija koja prosto gasi event listener? ili ima još neku funkciju za pražnjenje objekata, garbeage collector?

Malo mi je nejasna logika u ovom slučaju kada se recimo osluškuje miš ako klikne negdje, kako ako se ugasi event ima smisla osluškivati klik?

Proučavao sam memoriju javascripta i još ću, da mi to bude jasno.

Konkretna implementacija ove funkcije to radi, medjutim razlog zasto to radi je davanje mogucnosti garbage collectoru, da oslobodi sve objekte koji su koristeni od strane event listenera.

Ovaj primjer je malo nepraktican sto sam dao, medjutim baci pogled na sljedecu stvar.
Kao sto mozes da vidis, event nije eksplicitno obrisan (od strane programera) i samim tim i dalje postoji referenca prema iframeu i svim njegovim objektima.

Mozda je primjer sto sam dao malo konfuzan, ali on je tu bio samo da prikaze na koji nacin se koristi dispose pattern u JS-u.Mozda ti bude jasnije sa primjerom iz React dokumentacije za useEffect hook.

import React, { useState, useEffect } from 'react';

function FriendStatus(props) {
  const [isOnline, setIsOnline] = useState(null);

  useEffect(() => {
    function handleStatusChange(status) {
      setIsOnline(status.isOnline);
    }

    ChatAPI.subscribeToFriendStatus(props.friend.id, handleStatusChange);
    // Specify how to clean up after this effect:
    return function cleanup() {
      ChatAPI.unsubscribeFromFriendStatus(props.friend.id, handleStatusChange);
    };
  });

  if (isOnline === null) {
    return 'Loading...';
  }
  return isOnline ? 'Online' : 'Offline';
}

A negdje u implementaciji useEffect funkcije, unuar Reacta, desit ce se nesto ovako npr.

function useEffect(
  fn: () => (() => void) | void,
  arr?: Array<any>,
) {
  // ...do some magic
  let dispose = fn();
  if (typeof dispose === 'function') {
    dispose();
  }
}