Question

我正在考虑模块结构，闭包和立即调用（IIFE）原则，使用HTML，CSS和Javascript创建预算应用程序。我将模块结构划分为UIController，Appcontroller，BudgetController。

我在UI控制器中有一个getinput方法，它返回一个带有前端输入值的对象，我从app controller调用这个getinput。但是我在getinput方法下遇到错误。是否有任何syantax错误或者我是做错了。

的script.js

var budgetController=(function(){
    //some code
})();

/*--------------------------------------------------------------*/

// UI Controller
var UIController=(function(){
    return
    {
        getInput:function(){
            return {
                type: document.querySelector('.add__type').value,
                description: document.querySelector('.add__description').value,
                value: document.querySelector('.add__value').value
            };
        }
    };
})();

/*--------------------------------------------------------------*/

// App controller
var controller=(function(budgetctrl,UIctrl)
{
    var ctrlAddItem=function()
    {
        var result=UIctrl.getInput();
        console.log(result);
        // get the input data

        // add the budget item to budget controller

        // add the item to ui controller

        // calculate the budget

        // display the result 
    }

    // Button click event

    document.querySelector('.add__btn').addEventListener('click',ctrlAddItem);

    //event key event

    document.addEventListener('keypress',function(event)
    {
        if(event.keyCode===13 || event.which ===13)
        {
            ctrlAddItem();
        }
    });
})(budgetController, UIController)

Answer 1

问题在于：

return
{

如果您将{移至与return相同的行，则语法错误将消失：

return {

由于自动分号插入而发生错误。 JavaScript会在return之后为您添加分号，因此代码实际上是：

return;
{

这绝对不是你想要的。

当您编写JavaScript代码并且必须在某处放置{时，请始终将其与之前的语句放在同一行，而不是单独放在一行。我认为这个特定问题只发生在return语句中，而不是像if这样的其他语句，但最好保持一致。

例如，您不会在这些行上收到错误：

var controller=(function(budgetctrl,UIctrl)
{
    var ctrlAddItem=function()
    {

但是因为你必须遵循return的“同一行支撑”样式，所以在任何地方都更加一致（并且添加更多的空格以提高可读性）：

var controller = (function( budgetctrl, UIctrl ) {
    var ctrlAddItem = function() {

获取解析错误，Javascript代码中的意外标记

1 个答案: