模块模式中的 JavaScript 命名空间

Question

我正在阅读有关创建 namespace 和模块化模式的 How Good C# Habits can Encourage Bad JavaScript Habits 文章，但我不明白使用 $ 和 jQuery 来创建命名空间的原因。看这段代码：

(function( skillet, $, undefined ) {
    //Private Property
    var isHot = true;

    //Public Property
    skillet.ingredient = "Bacon Strips";

    //Public Method
    skillet.fry = function() {
        var oliveOil;

        addItem( "\t\n Butter \n\t" );
        addItem( oliveOil );
        console.log( "Frying " + skillet.ingredient );
    };

    //Private Method
    function addItem( item ) {
        if ( item !== undefined ) {
            console.log( "Adding " + $.trim(item) );
        }
    }    
}( window.skillet = window.skillet || {}, jQuery ));

为什么它发送$作为参数然后用jQuery调用它？

Answer 1

当您加载 jQuery 库时，它会将两个全局符号绑定到对主函数的引用：“jQuery”和“$”。但是，其他一些库也希望使用“$”，因此 jQuery 提供了一种解除“$”绑定并将其恢复为加载 jQuery 之前的状态的方法。通过在您的示例中使用该技术，您可以在代码中使用“$”，无论全局“$”是否引用 jQuery。

edit——你引用的那篇文章也有类似的解释：

传递的第二个参数[是] jQuery。这样做的好处是命名参数被引用为 $，这允许我们在匿名函数中将 jQuery 引用为 $，而不必担心它会与其他 JavaScript 库中声明的 $ 冲突。这是您在查看编写良好的 jQuery 代码时很可能会遇到的常见做法。