what's the correct way to destroy a javascript function?

Question

I'm not too familiar with object orientated Javascript but lets say I have a function which I instantiated.. ?

Is that the correct terminology?

The function contains an XMLHttpRequest with an attached event listener, what would be the correct way to dispose the function?

function foo() {
    var self = this;
    self.message = "received response";
    self.url = 'someUrl';
    self.req = new XMLHttpRequest();
    self.req.open("POST", self.url, true);
    self.req.onload = function () {
        console.log(self.message); // Unable to get property 'message' of 
        // undefined or null reference
    };
    self.req.send();
    self = null;
}

var foo = new foo();

I realize this is not how I should abort an XMLHttpRequest but its just an example, the question is how should I cleanly destroy a function and all that it spawned or created?

Edit

To Clarify, my confusion is with self.req.onload and how it can even exist when self = null? my thought would be that self.req no longer exists and therefore its events too but this is obviously not the case

just let it go out of scope - you could set it to a different value. — Daniel A. White
– Daniel A. White, Commented May 14, 2014 at 15:06
I don't see a reason why foo should be a constructor function. Just make a it a "normal" function and don't use this/self. — Felix Kling
– Felix Kling, Commented May 14, 2014 at 15:08

Bergi · Accepted Answer · 2014-05-14 15:07:47Z

4

Yes, JavaScript functions are objects, and therefore they are instantiated. Function declarations create a function when the scope is entered, function expressions do when they are evaluated.

However, in JavaScript you don't dispose objects. You just let them go out of scope (remove all references to them), and the garbage collector will take care of them. For example, when you foo.req.abort() the request, or the response arrives, and foo.req.onload is no longer accessible, then your listener function will be garbage collected.

answered May 14, 2014 at 15:07

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Felix Kling Over a year ago

I think the OP was referring to the var foo = new foo(); when he said "instantiated".

Bergi Over a year ago

@FelixKling: Oh - hm - but then the question doesn't make much sense? Not sure what the OP wants to do.

andrew Over a year ago

@Bergi what I don't understand, is why console.log(self.message); even happens when self is set to null? How can self.req.onload still exist?

user400654 Over a year ago

@andrew self.req.onload doesn't exist, however the callback that it created does.

Bergi Over a year ago

The foo object, the XMLHttpRequest object and the handler function do exist separately from each other. By setting self=null, you've just destroyed the self variable, making it impossible to access the foo object via self in that scope. If you didn't assign the result of calling new Foo() to foo, setting self=null would have (implicitly) "destroyed" the object (including its message, url, req properties) and made it available for garbage collection. The request object would still exist, it only is no more accessible via self.req then.

Hampus · Accepted Answer · 2014-05-14 15:16:46Z

1

I would write you example like this:

function foo () {
  var message = "received response";
  var url = 'someUrl';
  var req = new XMLHttpRequest();
  req.open("POST", url, true);
  req.onload = function () {
    console.log(message);
  };
  req.send();
}

// No need to instantiate foo, just call it when you want to make your request
// No need for foo to "remember" variables.

foo();

answered May 14, 2014 at 15:16

Hampus

2,8391 gold badge27 silver badges40 bronze badges

Collectives™ on Stack Overflow

what's the correct way to destroy a javascript function?

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related