问题描述
我的同事一直在他的代码中广泛使用IIFE（文件）.ready。 现在，我读过这篇文章：
这让我想到我们是否应该在IIFE中使用$（document）.ready，或者在我的同事正在做的时候反过来也是如此。
所以基本上，他的代码设置如下：
jQuery(function() {
(function($) {
//...
// Code here
//...
})(jQuery);
});
他一般做得好吗？
1楼
Chris Foster
6
已采纳
2015-07-26 06:57:38
有些人可能认为这是风格/意见的问题，但如果你考虑在这种情况下IIFE的典型目标，我相信答案是肯定的，使用你的替代方式是可以接受的，但是存在潜在的缺点 。
不得不说：
立即调用的函数表达式可用于避免块内的变量提升，防止污染全局环境，同时允许公共访问方法，同时保留函数中定义的变量的隐私。
这两种方法都不会污染全局命名空间，因为它们不会声明任何变量。
因此，使用任何一种方法都应该没问题。
虽然注意它是部分冗余的，因为ready事件的函数处理程序已经创建了一个新的作用域，并且还注意到最常见的做法是看到IIFE函数将所有代码封装在一个文件中。
您的同事使用方式的一个缺点：如果您确实想要执行一些不依赖于DOM准备的javascript逻辑，那么如果您将代码放在IIFE之外，那么您将无法享受IIFE的好处。 所以像这样的东西是不安全的：
// Non-DOM-ready-required code here (NOT scope-safe)
jQuery(function() {
(function($) {
//...
// DOM-ready-required code here
//...
})(jQuery);
});
使用通用样式为您提供完整的IIFE优势：
(function($) {
// Non-DOM-ready-required code here (scope-safe)
$(function() {
//...
// DOM-ready-required code here
//...
});
})(jQuery);
2楼
I-Lin Kuo
1
2015-07-26 08:43:52
在我看来，你的同事无缘无故地跳过额外的箍。
我将忽略外部$(document).ready因为它没有真正的后果。
/*jQuery(*/function() {
(function($) {
//...
// Code here
//...
})(jQuery);
}/*);*/
使用IIFE作为jQuery回调的整个主体，不会在范围隔离中带来额外的好处。 它和代码一样
/*jQuery(*/function() {
//...
// Code here
//...
});
IIFE唯一做的就是允许你将jQuery引用为$ 。
现在，如果回调中有更多实质性代码，那么使用内部IIFE可能会有一些好处。 在以下示例中，回调包含两个IIFE，
jQuery(function() {
// IIFE
(function($) {
//...
// Code here
//...
})(jQuery);
// IIFE 2
(function($) {
//...
// Code here
//...
})(jQuery);
});
并且IIFE的使用允许两个代码块之间的范围隔离。
回到主要问题：
这让我想到我们是否应该在IIFE中使用
$(document).ready，或者在我的同事正在做的时候反过来也是如此。
现在，说实话，我不明白为什么要将这些中的任何一个视为最佳实践，即使在查看 。 回答的人从未解释为什么它应该是最佳实践。
看着
(function($) {
$(document).ready(function() {
// other code here
});
})(jQuery);
与
//(function($) {
$(document).ready(function() {
// other code here
});
//})(jQuery);
确实没有任何明显的优势。
就像在我之前的例子中一样，IIFE的使用没有提供范围隔离优势，除了允许你通过$引用jQuery之外别无其他。
但是，在实际链接的问题中，代码如下所示：
(function($) {
// other code here 1
$(document).ready(function() {
// other code here 2
});
})(jQuery);
在这种情况下，IIFE 确实有助于保持other code here 1使用的变量other code here 1不会泄漏到全局范围。
但这与$(document).ready()没有任何关系。
将代码重构为
(function($) {
// other code here 1
})(jQuery);
jQuery(document).ready(function() {
// other code here 2
});
做同样的事情。
这个答案的道德之处在于，使用IIFE来包装松散的代码，这些代码还没有在函数内部给你带来好处，而包装已经在函数内部的代码并没有给你任何东西（除非你计算更改引用）。