js函数名和函数体内变量名重复引发的问题

废话不说先看下面实例代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>less语言变量和混合</title>
        <link rel="stylesheet/less" href="style.less" />
        <script src="https://cdn.bootcss.com/less.js/3.0.4/less.min.js"></script>
    </head>
    <body>
        <p>
            <img src="" alt="" id="one"/>
            <p>NO.1:十月梦想</p>
        </p>
        <p>
            <img src="" alt="" id="two"/>
            <p>NO.2:pony马</p>
        </p>
        <p>
            <img src="" alt="" id="three"/>
            <p>NO.3:88888</p>
        </p>
        <h2    >列表文字详情</h2>
        <h1>less变量和混合</h1>
        <script type="text/javascript">
            var qlogo=function(num){
                    qlogo='http://q2.qlogo.cn/headimg_dl?bs='+num+'&dst_uin='+num+'&dst_uin='+num+'&;dst_uin='+num+'&spec=100&url_enc=0&referer=bu_interface&term_type=PC'
                    return qlogo;
                }
                var one=document.getElementById('one');
                var two=document.getElementById('two');
                var three=document.getElementById('three');
                one.src=qlogo(123456);
                three.src=qlogo(6688330);
                two.setAttribute('src',qlogo(10001));
                three.src=qlogo(88888);
        </script>
    </body>
</html>

在上述代码执行过程中,发现这个qlogo函数只能执行一次,多次执行则提示qlogo不是一个函数

经过一番之后,查找问题,下面详见问题发生原因解析!

  第一次正常执行没有问题,且看第二次问题分析,第二次qlogo被执行的调用了参数

three.src=qlogo(6688330)

此时函数体应该是这个样子

可以console.log(qlogo)  //打印结果http://q2.qlogo.cn/headimg_dl?bs=123456&dst_uin=123456&dst_uin=123456&;dst_uin=123456&spec=100&url_enc=0&referer=bu_interface&term_type=PC

所以下次qlogo进行传参是无效的,qlogo,此时qlogo的函数已经是一个具体的url地址


切记在函数名和函数体内的变量一定要区别开,不要遇到不知所措的坑,博主踩坑完毕!


本博客所有文章如无特别注明均为原创。作者:十月梦想复制或转载请以超链接形式注明转自 十月梦想博客
原文地址《js函数名和函数体内变量名重复引发的问题
分享到:更多

相关推荐

发表评论

路人甲 表情
Ctrl+Enter快速提交

网友评论(1)

大佬,你好?
1739212537 1年前 (2018-05-31) 回复