为什么我的笑脸解析代码调用本机javascript函数?

Joe*_*phy 3 html javascript jquery native function

我正在为我的网站写一个笑脸解析功能.我想要完成的是将某些字符串转换":)"为如下图像:在此输入图像描述

或者这里是实际的html作为例子:

":)" ===> <img src="images/smilies/smile.png" />
Run Code Online (Sandbox Code Playgroud)

我的函数执行它的意图,但它也解析本机javascript函数名称!我的意思这一点,是如果我键入包含字符串的注释"push","pop""some"(有可能是加载其他人)我的函数将解析这些字符串为无效的图片是这样的:

在此输入图像描述

这是一个显示以下内容的html字符串:

<img src="images/smilies/function some() { [native code] }" alt="">
Run Code Online (Sandbox Code Playgroud)

这会导致浏览器控制台中出现404未找到错误.

Failed to load resource: the server responded with a status of 404 (Not Found) 
Run Code Online (Sandbox Code Playgroud)

为什么会这样?我在代码中没有做任何不寻常的事情,你可以在这里看到:

        function parse_new_comment(commentElem){
            $(commentElem).html(parse_comment($(commentElem).text()));
        }


        function parse_comment(comment){
            var formatted_comment = "";

            var smilies = new Array();
            smilies[":)"] = "smile.png";
            smilies[":D"] = "smile-big.png";
            smilies[":p"] = "tongue.png";
            smilies["[sheep]"] = "sheep.png";
            smilies["<3"] = "love.png";
            smilies["[love]"] = "love.png";

            var words = comment.split(" ");

            for (var i = 0; i < words.length; i++) {
                if(smilies[words[i]] !== undefined){
                    formatted_comment += ' <img src="images/smilies/'+smilies[words[i]]+'" alt="" />';
                }else{
                    formatted_comment += ' ' + words[i];
                }
            }
            return formatted_comment;
        }
Run Code Online (Sandbox Code Playgroud)

我有一种感觉,这行代码导致问题if(smilies[words[i]] !== undefined){,因为push并且pop是数组函数,我不太确定...如果有人可以提出任何关于我的函数失败的想法,我将不胜感激.

哦,我忘了提,我的页面使用ajax来做所有事情,所以通过调用这样的函数解析新的注释:

parse_new_comment($("#comment_343"));
Run Code Online (Sandbox Code Playgroud)

谢谢.

Ben*_*aum 7

检查对象是否具有属性本身,而不是对象的属性未定义.这可以使用hasOwnProperty.

if(smilies.hasOwnProperty(words[i])){
Run Code Online (Sandbox Code Playgroud)

代替

if(smilies[words[i]] !== undefined){
Run Code Online (Sandbox Code Playgroud)

此外,由于您没有使用smilies数组,我同意Pointy的评论,它应该被声明为一个对象.值得一提的是,当您将键附加到ArrayJavaScript中时,如果它们可以被视为无符号整数,它们仅被视为数组索引.

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";
Run Code Online (Sandbox Code Playgroud)

您可能对使用Explosion Pills建议的答案所建议的文字语法感兴趣.只是为了澄清,hasOwnProperty仍然需要使用.

  • 这个答案仍然很有价值,因为即使对象他的代码也会试图找到一个"toString"笑脸形象:-) (3认同)
  • @JanDvorak仍然无法完全解决问题.将包括`toString`和其他对象原型方法 (3认同)
  • @Rikonator我想修复OP的代码,可以使用正则表达式来解决这个问题,然而,对于那些不熟悉正则表达式的人来说,它可能会让人感到困惑.至于速度,我真的不确定.创建一个perf可能相对简单 (2认同)