外部JS文件代码编写规范咨询：两种写法哪种正确？

嘿，这个问题问得很实在——两种写法都合规，但它们的作用域和适用场景完全不同，咱们来掰扯清楚：

第一种写法（函数放在$(document).ready()外部） #

$(document).ready(function () { 
  $('#divTest').click(function () { 
    // Some Instructions Here 
  }); 
});
function js_function_One(){ 
  // Some Instruction 
}
function js_function_Two(){ 
  // Some Instruction 
}

• 这里的js_function_One和js_function_Two属于全局作用域，页面上任何脚本（包括其他外部JS文件）都能直接调用它们。
• 适用场景：如果这些函数需要被非jQuery初始化的代码调用，或者得在DOM加载完成前就能被访问（这种情况比较少），这种写法就很方便。
• 小缺点：容易造成全局作用域污染，要是其他脚本也有同名函数，大概率会出现覆盖冲突的问题。

第二种写法（所有代码放在$(document).ready()内部） #

$(document).ready(function () {
  $('#divTest').click(function () { 
    // Some Instructions Here 
  });
  function js_function_One(){ 
    // Some Instruction 
  }
  function js_function_Two(){ 
    // Some Instruction 
  }
});

• 这两个函数被限制在ready回调的局部作用域里，外部代码根本没法直接调用它们。
• 核心优势：彻底避免了全局作用域污染，代码更安全，不会和其他脚本产生命名冲突，这也是现代JS开发更推荐的模块化写法。
• 小局限：如果这些函数需要被外部代码调用，就没法直接访问了——除非你特意把它们挂载到window对象上，但那样又回到了全局污染的老问题。

该怎么选？ #

• 如果你的js_function_One和js_function_Two只在DOM加载完成后使用，且仅在ready回调内部被调用，优先选第二种写法，这是更规范的最佳实践。
• 如果这些函数需要被其他脚本或者DOM加载前的代码调用，第一种写法没问题，但最好给它们加个独特的命名前缀（比如项目名缩写），尽量减少全局冲突的概率。

内容的提问来源于stack exchange，提问作者SKS