使用new Image()上报数据的一些问题

日常前台开发少不了数据上报，一般都是通过js发起一个请求到服务器程序，比如CGI、PHP、jsP程序等，由于只是上报，只要把数据上报了就行，并不关心服务器的状态和返回值，我们一般是使用new Image()对象，然后设置这个对象src属性。

function report(){
     var img=new Image();
     img.src="http://www.example.com/getReport.php";
}

我们一般是把上面的代码封装到一个函数里，每次使用的时候调用这个函数就可以了，看起来挺好的，用起来也挺方便，但是问题来了：在某次JS动态拉某服务器资源的时候，我们在服务器做了统计，同时也用JS做了上报，但是统计的结果是，JS统计的总比服务端统计的少30%，天天如此，这个数据差值总是30%。当时查了几天都没有结果，后来猜测可能是这里的临时变量问题导致，把这个变量移植到window对象下作为全局变量，问题解决。

var img;
function report(){
    img=new Image();
    img.src="http://www.example.com/getRepor.php";
}

究竟是什么原因导致这个问题呢？

分析是这样的，在函数report ()里，局部变量img设置属性src以后，浏览器并不是立即就发起请求，或者请求准备发起但是还没有真正发起（回忆下网络请求的几个状态值），而函数report执行完毕，浏览器开始做垃圾回收工作，包括局部变量，上报请求还没有开始img就被回收了，那么这次的上报就被取消了，上报失败。而把img放到window对象下作为全局变量，则避免了这个问题，所以即使report()函数的所有资源被回收，也不会影响到其上报