栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

将整个Javascript文件包装在匿名函数(例如“(function(){…}}()”)中的目的是什么?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

将整个Javascript文件包装在匿名函数(例如“(function(){…}}()”)中的目的是什么?

通常是到名称空间(请参阅下文)并控制成员函数和/或变量的可见性。可以将其视为对象定义。它的技术名称是 立即调用函数表达式
(IIFE)。jQuery插件通常是这样写的。

在Javascript中,您可以嵌套函数。因此,以下是合法的:

function outerFunction() {   function innerFunction() {      // pre   }}

现在您可以调用

outerFunction()
,但是的可见性
innerFunction()
仅限于的范围
outerFunction()
,这意味着它是私有的
outerFunction()
。它基本上遵循与Javascript中的变量相同的原理:

var globalVariable;function someFunction() {   var localVariable;}

相应地:

function globalFunction() {   var localFunction1 = function() {       //I'm anonymous! But localFunction1 is a reference to me!   };   function localFunction2() {      //I'm named!   }}

在上述情况下,您可以

globalFunction()
从任何地方拨打电话,但不能拨打
localFunction1
localFunction2

在编写时

(function() { ...})()
,您正在做的是使第一组括号内的代码成为函数文字(意味着整个“对象”实际上是一个函数)。之后,您将自动调用
()
刚刚定义的函数(最后一个)。因此,正如我前面提到的,此方法的主要优点是您可以拥有私有方法/函数和属性:

(function() {   var private_var;   function private_function() {     //pre   }})();

在第一个示例中,您将按

globalFunction
名称显式调用以运行它。也就是说,您只
globalFunction()
需要运行它即可。但是在上面的示例中,您不仅定义了一个函数,还定义了一个函数。您可以一口气定义和调用它。这意味着当您的Javascript文件被加载时,将立即执行它。当然,您可以这样做:

function globalFunction() {    // pre}globalFunction();

除了一个显着的区别外,该行为基本上是相同的:您避免使用IIFE时污染全局范围(因此,这也意味着您不能多次调用该函数,因为它没有名称,但是由于该功能仅在确实不是问题后才可以执行)。

IIFE的整洁之处在于,您还可以在内部定义事物,并且只向外界公开想要的部件(例如,命名空间的示例,这样您就可以基本上创建自己的库/插件):

var myPlugin = (function() { var private_var; function private_function() { } return {    public_function1: function() {    },    public_function2: function() {    } }})()

现在您可以打电话了

myPlugin.public_function1()
,但是您无法访问
private_function()
!因此非常类似于类定义。为了更好地理解这一点,我建议以下链接以供进一步阅读:

  • 命名Javascript
  • Javascript中的私有成员(由Douglas Crockford撰写)

编辑

我忘了提。在最后

()
,您可以在内部传递任何内容。例如,当您创建jQuery插件时,您传入
jQuery
$
类似这样:

(function(jQ) { ... pre ... })(jQuery)

因此,您在这里要做的是定义一个带有一个参数的函数(称为

jQ
,局部变量,仅对该函数已知)。那么你的自我调用函数,并传递一个参数(也叫
jQuery
,但是这一个是从外面的世界,并以实际的jQuery自身的引用)。这样做并没有紧迫的需求,但是有一些优点:

  • 您可以重新定义全局参数,并为其指定一个在本地范围内有意义的名称。
  • 性能上有一点优势,因为在本地范围内查找内容比在范围链中进入全局范围要快得多。
  • 压缩(缩小)有好处。

早先,我描述了这些函数如何在启动时自动运行,但是如果它们自动运行,谁传入参数?该技术假定您所需的所有参数均已定义为全局变量。因此,如果尚未将jQuery定义为全局变量,则此示例将不起作用。您可能会猜到,jquery.js在其初始化期间所做的一件事是定义了一个’jQuery’全局变量,以及它更为著名的’$’全局变量,该变量允许该代码在包含jQuery之后工作。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/442088.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号