Why is my smiley parsing code calling native javascript functions?

Question

I'm writing a smiley parsing function for my website. What I'm trying to accomplish is to transform certain strings, e.g. `":)"` into an image like this: Or here's the actual html as an example: ``` ":)" ===>

``` My function does what it's meant to do, but it is also parsing native javascript function names! What I mean by this, is if I type a comment containing the strings `"push"` , `"pop"` , or `"some"` (there are probably loads others) my function will parse those strings into invalid images like this: Here is an html string showing this: ```

``` This results in a 404 not found error in the browser console. ``` Failed to load resource: the server responded with a status of 404 (Not Found) ``` Why is this happening? I'm not doing anything too unusual in my code as you can see here: ``` function parse_new_comment(commentElem){ $(commentElem).html(parse_comment($(commentElem).te…

Accepted Answer

Check that the object has the property itself and not that the object's property is undefined. This can be done using `hasOwnProperty`.

```
if(smilies.hasOwnProperty(words[i])){
```

Instead of

```
if(smilies[words[i]] !== undefined){
```

Also, since you are not using `smilies` as an array I agree with Pointy's comment that it should be declared as an object. It is worth mentioning that when you attach keys to an `Array` in JavaScript they are only considered array indexes if they can be seen as unsigned integers.

```
var smilies = {};//short for new Object();
smilies[":)"] = "smile.png";
smilies[":D"] = "smile-big.png";
smilies[":p"] = "tongue.png";
smilies["[sheep]"] = "sheep.png";
smilies["<3"] = "love.png";
smilies["[love]"] = "love.png";
```

You might be interested in using literal syntax as suggested by the answer Explosion Pills suggested. Just to clarify, using `hasOwnProperty` is still required.

Why is my smiley parsing code calling native javascript functions?

Solution

Problem