JavaScript中的函数表达式
我正试图从另一个开发人员那里理解这段代码,但我的JavaScript知识还不够。此函数用于获取站点的标题菜单,并将其转换为移动式菜单 我理解为什么jQuery以JavaScript中的函数表达式,javascript,jquery,function,function-expression,Javascript,Jquery,Function,Function Expression,我正试图从另一个开发人员那里理解这段代码,但我的JavaScript知识还不够。此函数用于获取站点的标题菜单,并将其转换为移动式菜单 我理解为什么jQuery以$的形式传入。我不明白变量CPCU是如何被传递回自身的,或者为什么它被作为CPCU |{}传递回。有人能帮我理解CPCU变量在这种情况下是如何工作的吗 var CPCU = (function (_cpcu, $) { 'use strict'; /** * Mobile Menu */ var mmenu =
$
的形式传入。我不明白变量CPCU
是如何被传递回自身的,或者为什么它被作为CPCU |{}
传递回。有人能帮我理解CPCU
变量在这种情况下是如何工作的吗
var CPCU = (function (_cpcu, $) {
'use strict';
/**
* Mobile Menu
*/
var mmenu = _cpcu.Menu.mobile = _cpcu.Menu.mobile || {};
// Properties.
mmenu.id = '#mobile-menu';
mmenu.el = $('');
mmenu.api = {};
mmenu.button = '#header-content .menu.button';
mmenu.aniClass = 'animate';
mmenu.opts = {
slidingSubmenus: false
};
mmenu.config = {
classNames: {
selected: 'active'
}
};
// Methods.
mmenu.init = function () {
mmenu.el = $(mmenu.id);
// Move the active class to from the A to the LI, must happen before mmenu init.
$('#mobile-menu').find('a.active').parent('li').addClass('active');
// Now we can init the menu. otherwise it doesn't pick up the active LI.
mmenu.api = mmenu.el.mmenu(mmenu.opts, mmenu.config).data('mmenu');
mmenu.button = $(mmenu.button);
mmenu.button.data('lines', $('.line1,.line2,.line3'));
mmenu.button.click(function () {
mmenu.api.open();
});
mmenu.api.bind('open', function () {
mmenu.button.data('lines').addClass(mmenu.aniClass);
});
mmenu.api.bind('close', function () {
mmenu.button.data('lines').removeClass(mmenu.aniClass);
});
};
// Set up doc ready.
$(document).ready(function () {
mmenu.init();
});
return _cpcu;
})(CPCU || {}, jQuery);
参数
CPCU | |{}
用于说明在您发布的代码顶部的var CPCU
声明之前,其他一些代码可能已经初始化了CPCU
。这种模式很常见
因此,如果未定义CPCU
(可能是常见情况,当然我对您的软件了解不多),那么传递给匿名函数的值将是新的空对象({}
)。但是,如果已定义并初始化了CPCU
,则将传递其当前值
因此,假设在某个页面上,在您发布的代码之前,有一个通过
标记导入的不同脚本,它会执行以下操作:
var CPCU = { debug: true };
然后,当您发布的代码运行时,它将看到
CPCU
已经有一个值。这样做通常是为了增加灵活性并考虑到不可预见的可能性。参数CPCU |{}
用于考虑在您发布的代码顶部声明var CPCU
之前,其他一些代码可能已经初始化了CPCU
。这种模式很常见
因此,如果未定义CPCU
(可能是常见情况,当然我对您的软件了解不多),那么传递给匿名函数的值将是新的空对象({}
)。但是,如果已定义并初始化了CPCU
,则将传递其当前值
因此,假设在某个页面上,在您发布的代码之前,有一个通过
标记导入的不同脚本,它会执行以下操作:
var CPCU = { debug: true };
然后,当您发布的代码运行时,它将看到
CPCU
已经有一个值。这样做通常是为了增加灵活性并考虑到不可预见的可能性。它试图通过立即调用函数、传入对象进行扩展并在扩展后再次返回相同的对象来扩展具有更多属性/功能的对象
首先,以CPCU |{}
为例,如果已经定义了CPCU
,它将把它传递到函数中。如果不是,CPCU
将是,因此将传入|
的右侧,这是一个新的空对象。然后将其用作内部的\u cpcu
参数,并分配额外的属性等
使用这种方法,您可以将功能的不同部分划分为不同的区域,可能会将某些变量保留为这些区域的私有变量,或者保存在不同的文件中,以便于维护等
我进一步说“尝试”,因为这段代码实际上有缺陷。如果在运行时,CPCU
确实未定义,并且它传入了{}
,则此行:
var mmenu = _cpcu.Menu.mobile = _cpcu.Menu.mobile || {};
将出错,因为它无法访问未定义的
菜单
属性的mobile
属性。因此,虽然开发人员使用了一种模式来分割代码的不同区域,但这一部分实际上依赖于另一个部分(定义菜单
属性),该部分已经提前运行,这使得整个CPCU |{}
moot.它试图通过立即调用函数、传入要扩展的对象并在扩展后再次返回该对象来扩展具有更多属性/功能的对象
首先,以CPCU |{}
为例,如果已经定义了CPCU
,它将把它传递到函数中。如果不是,CPCU
将是,因此将传入|
的右侧,这是一个新的空对象。然后将其用作内部的\u cpcu
参数,并分配额外的属性等
使用这种方法,您可以将功能的不同部分划分为不同的区域,可能会将某些变量保留为这些区域的私有变量,或者保存在不同的文件中,以便于维护等
我进一步说“尝试”,因为这段代码实际上有缺陷。如果在运行时,CPCU
确实未定义,并且它传入了{}
,则此行:
var mmenu = _cpcu.Menu.mobile = _cpcu.Menu.mobile || {};
将出错,因为它无法访问未定义的
菜单
属性的mobile
属性。因此,虽然开发人员使用了一种模式来分割代码的不同区域,但这一部分实际上依赖于另一个部分(定义菜单
属性),该部分已经提前运行,这使得整个CPCU |{}
moot.看看这个相关的问题:看看这个相关的问题:是的,这是一个很好的观点:使用预初始化“guard”模式编写的代码实际上应该可以工作:)是的,这是一个很好的观点:使用预初始化“guard”模式编写的代码模式实际上应该可以工作:)那么这个函数是否必须在其他地方调用此代码才能运行?如果是这样,你知道函数调用是什么样子吗?@AnneLee我不明白这个问题。您发布的代码是自包含的,不需要“调用”。然而,正如James Thorpe在另一个答案中指出的那样,必须预先初始化CPCU
对象,否则这里发布的代码在运行时会抛出异常。我不知道其他代码会是什么样子,除了它会涉及符号CPCU
。哦,我