如何在JavaScript中通过条件控制指定脚本不执行（无需注释）

嘿，不用注释也能轻松搞定这个需求！我给你分享几个简单又好用的条件控制方法：

1. 布尔开关（适合临时调试/快速启停） #

直接定义一个开关变量，把//start到//end的地图代码包裹在条件判断里，想开启或关闭只需要修改变量值就行：

;(function($){ 
  $.ag.hideScrollbar = function (currentWidth) { ... }; 

  // 开关变量：设为false就不执行地图代码
  const shouldRunMapScripts = false;
  if (shouldRunMapScripts) {
    //start 
    $.ag.initMap = function(mapCanvas){ ... }; 
    $.ag.initMapAutocomplete = function () { ... }; 
    //end 
  }
}(jQuery));

这种方式最直观，临时不想运行的时候改个变量值就行，以后要恢复直接改回true，比删了注释再补回来方便太多。

2. 页面环境动态判断（适合生产场景） #

如果想根据页面场景自动控制（比如只有带地图容器的页面才运行），可以通过检查DOM元素、URL参数或者页面标识来判断：

示例1：检查是否存在地图容器 #

;(function($){ 
  $.ag.hideScrollbar = function (currentWidth) { ... }; 

  // 只有页面存在指定地图容器时，才加载地图代码
  if ($('#map-container').length > 0) {
    //start 
    $.ag.initMap = function(mapCanvas){ ... }; 
    $.ag.initMapAutocomplete = function () { ... }; 
    //end 
  }
}(jQuery));

示例2：根据URL参数判断 #

;(function($){ 
  $.ag.hideScrollbar = function (currentWidth) { ... }; 

  // 只有URL里带`enableMap=1`参数时才执行地图代码
  const urlParams = new URLSearchParams(window.location.search);
  if (urlParams.get('enableMap') === '1') {
    //start 
    $.ag.initMap = function(mapCanvas){ ... }; 
    $.ag.initMapAutocomplete = function () { ... }; 
    //end 
  }
}(jQuery));

这种方式更灵活，不用手动改代码，页面会根据实际场景自动决定是否加载地图脚本。

3. 构建工具标记控制（进阶可选） #

如果你的项目用了Webpack、Rollup这类构建工具，还可以用注释标记配合插件来移除这段代码，比如：

;(function($){ 
  $.ag.hideScrollbar = function (currentWidth) { ... }; 

  /* istanbul ignore next */
  //start 
  $.ag.initMap = function(mapCanvas){ ... }; 
  $.ag.initMapAutocomplete = function () { ... }; 
  //end 
}(jQuery));

配合对应的构建插件可以在打包时自动移除这段代码，但这种需要依赖项目的构建流程，前面两种方案已经足够解决你的需求啦～

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