javascript - 学习网页开发，关于head区域一段脚本的疑惑
问题描述
自学前端不就，查看公司的主页，在head区域有如下代码：
<head>
......
......
<script>
//疑惑1
var _hmt = _hmt || [];
//疑惑2
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?788111edda8b56f4a6c2bdd403891d20"; //这个链接是百度的一些插件功能
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</head>疑惑1：短路运算法用在这里，后续是做什么用的？一般都这么做吗？
疑惑2：代码的意思是在script前面动态加<script src='https://hm.baidu.com/hm.js?78...'>语句。可是为什么要这么做呢？我测试了下，直接在head里加上这段代码实现的功能也一样啊。如果是多页面，我每个页面加这段代码字符数也比function里面的字符数少啊。。实在搞不懂？？
请达人解惑，感谢！
实现过一个类似的统计库，简单分享下个人对这个机制的理解。
<script>
// 这里如果已引入 _hmt 变量，则保留已有值
// 仅在未初始化成功的情况下将其初始化
// 避免后端模板拼接而成的页面中多处引入百度统计时，重复初始化变量的问题
var _hmt = _hmt || [];
// 疑惑2
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?788111edda8b56f4a6c2bdd403891d20";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>你的疑问在于，为什么不直接添加 hm.src 中的链接到 script 标签脚本中，而是先初始化 _hmt 变量后才添加该脚本。这应当是和统计库的功能实现有关的。简要介绍：
_hmt实质是是一个消息队列的缓存。插入该数组的内容均是各类点击、滑动、触摸等用户事件。推入这个消息队列中的事件会被统计库上报到百度统计。这个缓存是支持在第一方业务代码中通过 JS API 来写入的。例如使用百度统计的开发者，可以在自己的 JS 代码中编写形如
_hmt.push(xxx)的逻辑，推送自定义的事件到消息队列中。由于第三方脚本同样能写入该消息队列，这就要求该队列的数组变量不仅必须全局，还必须尽早初始化。而统计库的上报等业务逻辑则可以延迟到页面主要内容加载完成后再执行。
为了实现 3 中的要求，统计脚本的引入方式才设计为【首先初始化一个数组，然后动态加载统计脚本】。这样加载队列数组时直接在页面中内联初始化非常高效，后面的统计脚本延迟加载，减小对页面加载速度的影响。
这篇关于javascript - 学习网页开发，关于head区域一段脚本的疑惑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
