(function() {})();

(function() {})(); 是 JavaScript 中的立即执行函数表达式（IIFE，Immediately Invoked Function Expression）。

结构拆解

(function() {   // ① 函数定义
    // 代码...
})();           // ② 立即调用

部分	说明
function() {}	定义一个匿名函数
( ... )	将函数包裹成表达式，告诉 JS 引擎"这是一个值"
()	立即执行这个函数

为什么需要外层括号？

// ❌ 不加括号会报错
function() {}();  // SyntaxError: function statement requires a name

// ✅ 加括号变成表达式
(function() {})();  // 正常执行

JS 引擎看到 function 开头会解析为函数声明，声明必须有名字。用括号包裹后，它变成了函数表达式，可以被立即调用。

其他写法

// 写法一：括号包裹函数
(function() {})();

// 写法二：括号包裹调用
(function() {}());

// 写法三：使用运算符（不推荐）
!function() {}();
+function() {}();

在您的代码中

(function() {
    "use strict";
    // 所有变量和函数都定义在这个作用域内
    const container = document.getElementById('dataContainer');
    // ...
})();

作用：创建一个独立的作用域，避免变量污染全局。

对比：有 IIFE vs 没有 IIFE

// ❌ 没有 IIFE
var count = 10;           // 污染全局 window.count
function helper() {}      // 污染全局 window.helper

// ✅ 有 IIFE
(function() {
    var count = 10;       // 只在这个函数内有效
    function helper() {}  // 只在这个函数内有效
})();
console.log(count);       // ReferenceError: count is not defined

现代替代方案

在 ES6 中，可以用块级作用域 + let/const 替代 IIFE：

// 使用 IIFE（旧方式）
(function() {
    var privateVar = 1;
})();

// 使用块级作用域（ES6+）
{
    let privateVar = 1;   // 只在块内有效
}

总结

要点	说明
作用	创建独立作用域，避免变量污染
为什么	防止内部变量泄露到全局
何时用	浏览器环境、避免全局冲突
现代替代	ES6 模块（import/export）或 { let x; }

IIFE 确保了 container、fetchBtn 等变量不会污染全局 window 对象，是良好的编码习惯。