Javascript 为什么我的函数调用不起作用？ 函数CustomAlert（）{ this.render=函数（）{ var winW=window.innerWidth； var winH=window.innerHeight； var dialogOverlay=document.getElementById（'dialogOverlay'）； var dialogbox=document.getElementById（'dialogbox'）； dialogOverlay.style.display=“block！important”； dialogOverlay.style.height=winH+“px！重要”； dialogbox.style.left=（winW/2）-（550*.5）+“px！重要”； dialogbox.style.top=“100px！重要”； dialogbox.style.display=“block！important”； } this.ok=函数（）{ } } 函数高分（arg） { CustomAlert（）.render（）； }

为什么它告诉我

CustomAlert

未定义？我还尝试将

CustomAlert（）

分配给一个var，但是控制台告诉我该var现在未定义。

当作为（

CustomAlert（）

）调用时，您的函数不会返回任何内容。但是，您可以在调用函数时使用运算符将其作为（

new CustomAlert（）

）调用。这将导致函数中的

This

引用新创建的对象实例，并自动将该实例用作返回值：

<script type="text/javascript">
    function CustomAlert() {
        this.render = function() {
            var winW = window.innerWidth;
            var winH = window.innerHeight;
            var dialogOverlay = document.getElementById('dialogOverlay');
            var dialogbox = document.getElementById('dialogbox');

            dialogOverlay.style.display = "block !important ";
            dialogOverlay.style.height = winH+"px !important ";
            dialogbox.style.left = (winW/2) - (550 * .5) + "px !important ";
            dialogbox.style.top = "100px !important ";
            dialogbox.style.display = "block !important";
        }

        this.ok = function () {
        }
    }

    function HighScore( arg )
    {
        CustomAlert().render();
    }
</script>

---

另一种（但肯定不是等效的）解决方案是直接从

CustomAlert

返回新对象：

function HighScore( arg )
{
    new CustomAlert().render();
}

现在可以像调用普通函数一样调用它：

function CustomAlert() {
    var obj = {
        render: function () {
            ...
        },
        ok: function () {
            ...
        }
    };

    return obj;
}

为什么它告诉我CustomAlert未定义？我还试图 将CustomAlert（）分配给变量，但控制台告诉我 var现在未定义

因为你应该创建一个这样的对象

function HighScore( arg )
{
    CustomAlert().render();
}

然后调用它的

render

方法

或者在一份声明中：

var customerAlert = new CustomAlert();

这称为构造函数调用模式

实际上，在JavaScript中，可以通过以下方式之一调用函数：

• 方法调用模式
• 函数调用模式
• 构造函数调用模式
• 应用调用模式

方法调用模式

当函数存储为对象的属性时，使用此调用方法。因此，我们将此函数称为方法，就像在其他面向对象语言中一样。当我们调用函数时，它被绑定到该对象。例如：

function HighScore( arg )
{
    new CustomAlert().render();
}

在这种情况下，我们将调用

render

方法，如下所示：

var app = {
    render: function() {
                var winW = window.innerWidth;
                var winH = window.innerHeight;
                var dialogOverlay = document.getElementById('dialogOverlay');
                var dialogbox = document.getElementById('dialogbox');

                dialogOverlay.style.display = "block !important ";
                dialogOverlay.style.height = winH+"px !important ";
                dialogbox.style.left = (winW/2) - (550 * .5) + "px !important ";
                dialogbox.style.top = "100px !important ";
                dialogbox.style.display = "block !important";
        }
        ok : function () {

        }
};

var render = function(){
    var winW = window.innerWidth;
                var winH = window.innerHeight;
                var dialogOverlay = document.getElementById('dialogOverlay');
                var dialogbox = document.getElementById('dialogbox');

                dialogOverlay.style.display = "block !important ";
                dialogOverlay.style.height = winH+"px !important ";
                dialogbox.style.left = (winW/2) - (550 * .5) + "px !important ";
                dialogbox.style.top = "100px !important ";
                dialogbox.style.display = "block !important";
};

函数调用模式

这种情况下，函数不是对象的属性。在这种情况下，函数被绑定到全局对象（通常是web应用程序中的窗口对象）

app.render();

那么我们就这样称呼它：

var app = {
    render: function() {
                var winW = window.innerWidth;
                var winH = window.innerHeight;
                var dialogOverlay = document.getElementById('dialogOverlay');
                var dialogbox = document.getElementById('dialogbox');

                dialogOverlay.style.display = "block !important ";
                dialogOverlay.style.height = winH+"px !important ";
                dialogbox.style.left = (winW/2) - (550 * .5) + "px !important ";
                dialogbox.style.top = "100px !important ";
                dialogbox.style.display = "block !important";
        }
        ok : function () {

        }
};

var render = function(){
    var winW = window.innerWidth;
                var winH = window.innerHeight;
                var dialogOverlay = document.getElementById('dialogOverlay');
                var dialogbox = document.getElementById('dialogbox');

                dialogOverlay.style.display = "block !important ";
                dialogOverlay.style.height = winH+"px !important ";
                dialogbox.style.left = (winW/2) - (550 * .5) + "px !important ";
                dialogbox.style.top = "100px !important ";
                dialogbox.style.display = "block !important";
};

构造函数调用模式

在这种情况下，我们调用带有

new

前缀的函数。在这种情况下，将创建一个新对象。这是创建具有相同属性的对象的好方法。这些函数称为构造函数，按照惯例，它们的名称以大写字母开头

应用调用模式

apply方法使我们有机会分析将用于调用函数的参数数组。此外，它使我们能够选择

this

的值

有关上述内容的更多信息，请参阅