Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/388.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Google Analytics或Intercom等代码段使用哪种设计模式?_Javascript_Google Analytics_Intercom - Fatal编程技术网

Javascript Google Analytics或Intercom等代码段使用哪种设计模式?

Javascript Google Analytics或Intercom等代码段使用哪种设计模式?,javascript,google-analytics,intercom,Javascript,Google Analytics,Intercom,我想为Google Analytics and Intercom创建一个笑脸片段: 对讲机示例 或谷歌分析: Adding analytics.js to Your Site The analytics.js library is a JavaScript library for measuring how users interact with your website. This document explains how to add analytics.js to your site.

我想为Google Analytics and Intercom创建一个笑脸片段:

对讲机示例

谷歌分析:


Adding analytics.js to Your Site
The analytics.js library is a JavaScript library for measuring how users interact with your website. This document explains how to add analytics.js to your site.

The JavaScript measurement snippet
Adding the following code (known as the "JavaScript measurement snippet") to your site's templates is the easiest way to get started using analytics.js.

The code should be added near the top of the <head> tag and before any other script or CSS tags, and the string 'GA_MEASUREMENT_ID' should be replaced with the property ID (also called the "measurement ID") of the Google Analytics property you wish to work with.

Tip: If you do not know your property ID, you can use the Account Explorer to find it.
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->


将analytics.js添加到您的站点
analytics.js库是一个JavaScript库,用于测量用户与网站的交互方式。本文档介绍如何将analytics.js添加到您的站点。
JavaScript度量代码段
将以下代码(称为“JavaScript度量代码段”)添加到站点模板是开始使用analytics.js的最简单方法。
代码应该添加在标记顶部附近,任何其他脚本或CSS标记之前,字符串“GA_MEASUREMENT_ID”应该替换为您希望使用的Google Analytics属性的属性ID(也称为“MEASUREMENT ID”)。
提示:如果您不知道您的属性ID,可以使用帐户资源管理器查找它。
(函数(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]| |函数(){
(i[r].q=i[r].q | |[]).push(参数)},i[r].l=1*新日期();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(窗口、文档、“脚本”和https://www.google-analytics.com/analytics.js","ga",;
ga(“创建”、“UA-XXXXX-Y”、“自动”);
ga(‘发送’、‘页面浏览’);

Intercom和Google使用了哪些设计模式来创建这些代码片段?他们的内部工作如何?你能给我一个基本的结构,让我可以用我想要的功能来填充它吗?

谷歌分析的生活(adn Intercom)基本上是他们编写脚本加载器的最短方式,可以适用于所有浏览器

如果我们完整地编写速记,结构将更易于阅读:

window.GoogleAnalyticsObject = 'ga';
window.ga = window.ga || function() {
    window.ga.q = window.ga.q || [];
    window.ga.q.push( arguments );
},
window.ga.l = 1 * new Date();
var a = document.createElement( 'script' );
var m = document.getElementsByTagName( 'script' );
a.async = true;
a.src = 'https://www.google-analytics.com/analytics.js';
m.parenNode.insertBefore( a, m );

window.ga('create', 'UA-XXXXX-Y', 'auto');
window.ga('send', 'pageview');
对讲机示例基本上也是这样做的

因此,该脚本首先保证窗口对象上存在专有名称。如果google analytics对象已经存在,它将被使用,否则它将成为将数据保存在数组中的函数。这可以防止多次添加脚本,因此如果其他插件也尝试加载相同的脚本,它们将共享其GA实例

然后脚本创建一个新的脚本标记,并将其配置为实际google analytics脚本的url。一旦新创建的脚本标签添加到页面中,它将加载实际的
analytics.js
脚本

虽然我还没有看到
analytics.js
的详细信息,但我很确定它将解包或合并我们创建的window.ga对象,并用实际的分析脚本替换它

总而言之,这是一种奇特的编写
的方法,它可以在旧浏览器上工作,并确保在单个页面上加载多个脚本时,不会有多个脚本实例相互冲突

analytics.js脚本和intercom小部件脚本的实际内部工作不包括在这些加载程序脚本中,因此我不打算详细说明这些脚本是如何工作的,这应该是一个不同的问题,显示实际analytics.js脚本的代码行

编辑:


Adding analytics.js to Your Site
The analytics.js library is a JavaScript library for measuring how users interact with your website. This document explains how to add analytics.js to your site.

The JavaScript measurement snippet
Adding the following code (known as the "JavaScript measurement snippet") to your site's templates is the easiest way to get started using analytics.js.

The code should be added near the top of the <head> tag and before any other script or CSS tags, and the string 'GA_MEASUREMENT_ID' should be replaced with the property ID (also called the "measurement ID") of the Google Analytics property you wish to work with.

Tip: If you do not know your property ID, you can use the Account Explorer to find it.
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

window.ga=window.ga | | function(){

此行确保
window.ga
是一个函数。 为了简单起见,我们认为这是一个不存在代码>GA/COD>的页面。 因此,当我们调用
ga('create','UA-XXXXX-Y','auto');
ga('send','pageview');
时,我们运行以下语句:

    window.ga.q = window.ga.q || [];
    window.ga.q.push( arguments );
window.ga.q=window.ga.q | |[];
确保window.ga.q是一个数组。 然后
window.ga.q.push(参数);
将参数推送到它

因此,在加载分析脚本之前调用
ga('create','UA-XXXXX-Y','auto');
ga('send','pageview');
,结果如下:

window.ga.q = [
  [ 'create', 'UA-XXXXX-Y', 'auto' ],
  [ 'send', 'pageview' ]
];
记住,
window.ga
是一个函数,但函数也是javascript中的一种对象。因此,我们可以将属性
q
添加到函数中,就像
window.ga
是一个对象一样,函数仍然可以工作

加载分析脚本后,它将查看
window.ga.q
数组并运行所有这些命令


问题是,看看analytics.js脚本。它也是以同样的风格编写的,因此需要花费数小时来重写它,并替换所有的速记,所以我会尝试寻找类似于该脚本的注释的非精简源,如果它在某处可用。

谷歌分析的生命(adn Intercom)基本上,这只是他们编写脚本加载程序的最短方法,该程序适用于所有浏览器

如果我们完整地编写速记,结构将更易于阅读:

window.GoogleAnalyticsObject = 'ga';
window.ga = window.ga || function() {
    window.ga.q = window.ga.q || [];
    window.ga.q.push( arguments );
},
window.ga.l = 1 * new Date();
var a = document.createElement( 'script' );
var m = document.getElementsByTagName( 'script' );
a.async = true;
a.src = 'https://www.google-analytics.com/analytics.js';
m.parenNode.insertBefore( a, m );

window.ga('create', 'UA-XXXXX-Y', 'auto');
window.ga('send', 'pageview');
对讲机示例基本上也是这样做的

因此,此脚本首先保证窗口对象上存在专有名称。如果google analytics对象已经存在,则将使用它,否则它将成为将数据保存在数组中的函数。这将防止多次添加脚本,因此如果其他插件也尝试加载同一脚本,则它们将共享该脚本r GA实例

然后脚本创建一个新的脚本标记并将其配置为实际google analytics脚本的url。一旦新创建的脚本标记添加到页面中,它将加载实际的
analytics.js
脚本

虽然我还没有看到
analytics.js
的详细信息,但我很确定它将解包或合并我们创建的window.ga对象,并用实际的分析脚本替换它

总而言之,这是一种奇特的编写
的方法,它可以在旧浏览器上工作,并确保在单个页面上加载多个脚本时,不会有多个脚本实例相互冲突

analytics.js脚本和intercom小部件脚本的实际内部工作不是i