Javascript 'delete' doesn't work inside iteration loop

Question

I'm a C/C++/Java programmer working with JavaScript.

I'm trying to write a function that will delete all properties of an object 'obj'. I've read the posting on "How to quickly clear a Javascript Object?" and saw that there are two answers: (1) creating a new 'obj' (which I don't want to do because my code is a high-performance program running in a mobile browser, and I want to minimize garbage collection); and (2) iterating over the properties of an object in a loop and deleting the properties. This latter approach doesn't work in Chrome 12.

Consider the following code:

var foo = {};
foo['baz'] = 'bar';
console.log("1. foo.baz = " + foo.baz);

delete foo.baz;
console.log("2. foo.baz = " + foo.baz);

foo['baz'] = 'bar';
console.log("3. foo.baz = " + foo.baz);

for (prop in foo)
{
    if (foo.hasOwnProperty(prop))
    {
        console.log("deleting property " + prop);
        delete foo.prop;
    }
}
console.log("4. foo.baz = " + foo.baz);

This produces the following result in my console on Chrome 12:

1. foo.baz = bar
2. foo.baz = undefined
3. foo.baz = bar
deleting property baz
4. foo.baz = bar

Why doesn't foo.baz get deleted inside the loop?

jAndy · Accepted Answer · 2011-07-21T17:58:23.733

9

You lookup the key in the wrong way. You need to use the bracket notation:

delete foo[ prop ];

However, you don't need to loop over every property within an object. It's just fine to null the object reference itself. The garbage collector will take care of you.

foo = null; // done

Talking of high performance, that is the way you want to do.

edited Jul 21 '11 at 17:58

answered Jul 21 '11 at 17:46

jAndy

231,737
57
305
359

(1) I was under the impression that the property notation foo.prop and foo[prop] were equivalent, for example as mentioned in http://www.jibbering.com/faq/faq_notes/square_brackets.html. (2) Why does "delete foo.baz" work in my example? (3) As I mentioned, I want to minimize garbage collection since I'm working on a mobile browser. – stackoverflowuser2010 Jul 21 '11 at 18:03
`foo.prop` is equivalent to `foo["prop"]`. see the difference? If you want to dynamically pull a property from `foo`, you need to use `foo[prop]`. – digitalbath Jul 21 '11 at 18:15
@stackoverflowuser2010: I'd put some more faith into the GC. If you don't create a ton of objects on each click, you should be fine. Explicitly deleting all properties and then adding new ones may very well take longer than just creating a new one and leaving the old one to the GC! – Jul 21 '11 at 18:17
@digitalbath: Then the code in this posting is incorrect, right? http://stackoverflow.com/questions/684575/how-to-quickly-clear-a-javascript-object – stackoverflowuser2010 Jul 21 '11 at 18:22
1

@stackoverflowuser2010: trying to clear/remove used memory with javascript ist just unnesessary. I don't thing this can possibly be faster than letting the GC do the job. If you got any source for that, let me know. – jAndy Jul 21 '11 at 18:30

score 3 · Answer 2 · answered Jul 21 '11 at 17:44

3

This line delete foo.prop is incorrect. foo has no property named prop in this case. Using brackets delete foo[prop].

answered Jul 21 '11 at 17:44

Joe

80,724
18
127
145

Hmm. I wonder why this was downvoted. I don't see anything wrong with it in particular. – Reid Jul 21 '11 at 23:04
I wondered myself. I think someone was jealous of my quick answer. ;) – Joe Jul 21 '11 at 23:47

score 0 · Answer 3 · answered Jul 21 '11 at 17:45

0

Because foo.prop never was defined to delete. You need to delete it like this:

delete foo[prop];

answered Jul 21 '11 at 17:45

Paul

139,544
27
275
264

score 0 · Answer 4 · answered Jul 21 '11 at 17:45

0

Try this instead:

delete foo[prop];

HTH

answered Jul 21 '11 at 17:45

Jonathan M

17,145
9
58
91

Javascript 'delete' doesn't work inside iteration loop

4 Answers4

Linked