JavaScript报错Uncaught TypeError: ll_ctq is not a function求助

嘿，这个问题的根源一眼就能看出来——你遇到的TypeError: ll_ctq is not a function错误，是全局作用域下的命名冲突导致的！

错误原因 #

你在代码开头先声明了一个全局变量：

var ll_ctq = 'll_ctq=';

紧接着又定义了同名的函数：

function ll_ctq() { /* ... */ }

在JavaScript中，函数声明和变量声明都会被提升到作用域顶部，但变量的赋值操作会覆盖掉同名函数的引用。等代码执行完毕，ll_ctq已经变成了字符串'll_ctq='，不再是一个函数，所以点击按钮调用它时就会抛出“不是函数”的错误。

解决方法 #

1. 重命名冲突的变量（最推荐） #

把开头的变量ll_ctq改成其他不冲突的名字，比如ll_ctq_param，然后在拼接URL的地方同步修改引用即可：

修改后的JavaScript代码片段：

var web = 'http://localhost/prjct/'; 
var ll_50_50 = 'll_50_50='; 
var ll_ctq_param = 'll_ctq='; // 重命名变量
var ll_dd = 'll_dd='; 
var and = '&'; 
var play = 'play.php?'; 

function ll_ctq() { 
    var check_ll_ctq = document.getElementById("ll_ctq"), 
        classes = ['red_cross']; 

    if (check_ll_ctq.classList.contains("red_cross")) { 
        // alert("Yes"); 
    } else { 
        // alert("No"); 
        document.getElementById("ll_ctq").classList.add("red_cross"); 
        document.getElementById("A1").setAttribute('class', 'timeout'); 
        document.getElementById("B1").setAttribute('class', 'timeout'); 
        document.getElementById("C1").setAttribute('class', 'timeout'); 
        document.getElementById("D1").setAttribute('class', 'timeout'); 

        var check_ll_50_50 = document.getElementById("ll_50_50"); 
        var check_ll_dd = document.getElementById("ll_dd"); 

        var ll_ctq_status = check_ll_ctq.classList.contains("red_cross") ? "yes" : "no";
        var ll_50_50_status = check_ll_50_50.classList.contains("red_cross") ? "yes" : "no";
        var ll_dd_status = check_ll_dd.classList.contains("red_cross") ? "yes" : "no";

        var location = web + play + ll_50_50 + ll_50_50_status + and + ll_ctq_param + ll_ctq_status + and + ll_dd + ll_dd_status; 
        setTimeout(function() { 
            window.location = location; 
        }, 3000); 
    } 
}

2. 额外代码优化建议 #

你在函数内部多次重复声明了check_ll_ctq、classes等变量，虽然JavaScript允许，但会让代码冗余。上面的修改中已经帮你简化了变量声明，并且用三元表达式替代了冗余的if-else判断，让代码更简洁易读。

内容的提问来源于stack exchange，提问作者PBM