Javascript：删除运算符

Question

I am looking at the Mozilla Developers website on the concept of the delete operator. In the last sub section of the page referring to “Deleting array elements” two similar scripts are shown, but the only difference in the scripts is how they modified the array.

In the first script, I quite don't understand why “if” statement does not run. My current understanding is that delete operator “removes the element of the array”. If I were to type trees[3] in the console, it would return undefined in the console.

 var trees = ["redwood","bay","cedar","oak","maple"]; delete trees[3]; if (3 in trees) { // this does not get executed } 

The second script seems to "mimic" the delete, but not literally. Undefined is assigned to trees[3]. It doesn't make sense to me how the “if” block runs in this script, but the first example does not. Can anyone help me understand this JavaScript behavior?

 var trees = ["redwood","bay","cedar","oak","maple"]; trees[3] = undefined; if (3 in trees) { // this gets executed } 

Answer 1

In your second example the key 3 still exists. It just holds a value that happens to be undefined. It IS confusing, but that's just the way Javascript is. The in operator just checks if the key exists, not if the value is defined.

If you were to output the whole arrays after each of your "deletions" the first example would display something like this:

["redwood", "bay", "cedar", 4: "maple"]

Whilst the second example would print out something like this:

["redwood", "bay", "cedar", undefined, "maple"]

So as you can see, in your first example the key is completely missing and it continues with the next key which is 4. In the second example the key still exists, but it's value is set to undefined.

Answer 2

There is a huge difference between the two methods you are trying:

Method 1:

You are deleting, destroying, completely removing the key 3 in your array called tree , hence there is no 3 in tree left, and the if check returns false .

Method 2:

You are assigning a new value to the key 3 , which is undefined , there is still 3 in tree , and the if check returns true .

Answer 3

There is a difference between undefined which is set by the user and undefined which the javascript engine returns once something is actually undefined, meaning doesn't exist. javascript can tell the difference between the two.

So in your example, when you do this:

var trees = ["redwood","bay","cedar","oak","maple"];
trees[3] = undefined;
if (3 in trees) {
    console.log("hi");
}

javascript can tell that property 3 exists, but it was set to undefined by the user.

to prove so you have the following:

if (5 in trees) {
    console.log("hi");
}

the property 5 of the array was never created, javascript knows it's undefined by lack of creation and regards it as a property which doesn't exist, and therefore doesn't display the "hi"

Answer 4

if(3 in tree) { //Stuff that won't get executed } is in fact correct, the thing is that in operator in Javascript does not work like in python, it simply checks if an object has a proprety. An array in javascript has a proprety 0, just like a string has a proprety 2 with the value someString[2]. the difference between delete object[prop]; and object[prop] = undefined; can be seen through object.hasOwnProperty(prop); or iterating through values or props of the object.