google.loader 代码欣赏

本文分析了一段来自Google的JavaScript代码,该代码用于加载各种Google API和服务。通过详细解读,不仅回顾了JavaScript的基础概念,还揭示了GoogleLoader的工作原理及其对未来Web操作系统的潜在影响。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

缘起

五一期间和老冒聊天,其中就提起来保持技术的敏感性是聊起技术型CEO的优势,也是一直需要不断努力充电的。很受启发,所以就顺手拿起一段Google的Javascript,欣赏一番。

这段JavaScript的URI(沿用Tim Berneris Lee喜欢用的URI而不是URL)很酷:

http://www.google.com/jsapi

在我写这篇文章的时候,也可以用这个URL也可以访问到: http://www.google.com/uds相同的内容。

单单挑这一段代码有几个原因:

  1. 这是分析最近的Google的所有代码的起点。在最近的Google AJAX Feed API文档里面提到,“Google正在向一个新的编程模式转移”,说的就是这一行代码。比如AJAX Feed API的开始调用就用如下语法:
    <script type="text/javascript" src="http://www.google.com/jsapi?key=YOUR_KEY_HERE"></script>
    <script type="text/javascript">
    google.load("feeds", "1");
    </script>
    其中调用的就是这段神秘的JavaScript。
  2. 这段在浏览器里看起来不过27行,按照最标准的折行以后也不过100行的代码,第一遍看起来,真是彻底不知道它在干些什么,甚至怀疑它是不是用JavaScript写的。如果能很透彻的看懂这个代码,也就说明JavaScript的基本概念掌握的还可以。研究的时候,的确重温了n年前学习JavaScript的一些概念。
  3. 第三个原因,就是通过研究这个代码,可以隐约的感觉到一个新的基于Web的操作系统的到来。这个Google Loader,和早年的DOS加载模块是如此的神似,却有几乎没有任何形似的地方。通过这个代码,让我们可以窥到一些未来的样子。
  4. 最后一个原因就是,在我写准备写点东西的时候,把这段代码中最有标志性的google_exportSymbol函数拿到Google里面搜索,居然只有一篇文章提到,而且还仅仅是贴了代码。难道这么重要的一个文件,全世界的开发者没有兴趣分析一下吗?
好了,现在开始看代码。

代码全文

经过简单的代码格式化(仅仅加上回车),这段代码看起来是这样的。努力想想,他究竟是干什么的呢?

if (!google) {
   var google = {};
}
if (!google.loader) {
   google.loader = {};
   google.loader.ServiceBase = "http://www.google.com/uds";
   google.loader.ApiKey = "internal";
   google.loader.KeyVerified = true;
   google.loader.LoadFailure = false;
   google.loader.AdditionalParams = "";
   (function() {
      Function.prototype.__google_inherits=function(c){
         var a=function(){};
         a.prototype=c.prototype;
         this.prototype=new a;
         this.prototype.__google_super=function(b,d,e,f){
            var n=Array.prototype.h.apply(arguments,[1,arguments.length]);
            return b.apply(this,n)
         }
      };
      var h=null;
      var l=false;
      function i(c){this.a=c}
      i.prototype.c=function(c,a){
         var b="";
         if(a!=undefined){
            if(a["locale"]!=undefined){
               b+="&hl="+encodeURIComponent(a["locale"])
            }
            if(a["nocss"]!=undefined){
               b+="&output="+encodeURIComponent("nocss="+a["nocss"])
            }
            if(a["other_params"]!=undefined){
               b+="&"+a["other_params"]
            }
         }
         if(h!=null&&!l){
            b+="&key="+encodeURIComponent(h);
            l=true
         }
         return google.loader.ServiceBase+"/?file="+this.a+"&v="+c+google.loader.AdditionalParams+b
      };
      function k(c,a,b,d,e,f){
         this.a=c;
         this.g=a;
         this.f=b;
         this.d=d;
         this.e=e;
         this.b=f
      }
      k.__google_inherits(i);
      k.prototype.c=function(c,a){
         var b="";
         if(this.d!=undefined){
            b+="&"+this.d+"="+encodeURIComponent(h?h:google.loader.ApiKey)
         }
         if(this.e!=undefined){
            b+="&"+this.e+"="+encodeURIComponent(c)
         }
         if(a!=undefined&&this.b!=undefined){
            for(var d in a){
               if(this.b[":"+d]!=undefined){
                  b+="&"+this.b[":"+d]+"="+encodeURIComponent(a[d])
               }
               else
                  if(d=="other_params"){
                     b+="&"+a[d]
                  }
               }
            }
            google[this.a]={};
            if(!this.f&&b!=""){
               b[0]="?"
            }
            return this.g+b
         };
         function o(c,a,b){
            var d=j[":"+c];
            if(!d){
               var e=new Error("Module: '"+c+"' not found!");
               e.toString=function(){
                  return this.message
               };
            throw e;
         }
         else{
            m("script",d.c(a,b))
         }
      }
      function q(c){
         var a=window;
         if(a.addEventListener){
            a.addEventListener("load",c,false)
         }
         else if(a.attachEvent){
            a.attachEvent("onload",c)
         }
         else{
            a["onload"]=c
         }
      }
      function p(c){
         var a=window.location.href;
         var b;
         var d=a.length;
         for(var e in c){
            var f=a.indexOf(e);
            if(f!=-1&&f                b=e;
               d=f
            }
         }
         h=b?c[b]:null
      }   
      function m(c,a){
         if(c=="script"){
            document.write('<script src="'+a+'" type="text/javascript"><\/script>')
         }else if(c=="css"){
            document.write('<link href="'+a+'" type="text/css" rel="stylesheet"></link>')
         }
      }
      function g(c,a){
         var b=c.split(/\./);
         var d=window;
         for(var e=0;e             d=d[b[e]]
         }
         d[b[b.length-1]]=a
      }
      var j={};
      j[":search"]=new i("search");
      j[":feeds"]=new i("feeds");
      j[":maps"]=new k("maps","http://maps.google.com/maps?file=googleapi",true,"key","v",{":locale":"hl"});
      g("google.load",o);
      g("google.setOnLoadCallback",q);
      g("google.loader.writeLoadTag",m);
      g("google.loader.setApiKeyLookupMap",p);
      g("google_exportSymbol",g);
   })()
}

真的要分析完全这里面的有趣的东西,还真是要点时间。不如分步骤,一个话题一篇文章,这样看起来容易一些。估计一天晚上也写不完,正好大家和我一起来看这段代码。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值