Yahoo UI中的Crockford Pattern是什么?
2006-09-19 17:37 BAsil 阅读(465) 评论(0) 编辑 收藏 举报
好久没有写博了,有些对不住大家了。不过我的博访问量极少,基本都是我自己浏览的,不过咱还是得抓点紧不是。
最近在用Yahoo UI简称YUI的TreeView控件,结合Xmlhttp访问服务器端,真的是挺方便;而且YUI是遵守BSD协议的,不管是自用还是商用都没有版权的问题。在使用的过程中,不可避免的要阅读一下YUI的源代码,发现其中经常遇到一个叫做Crockford Pattern的名次,里面对javascript类的封装有些特别。我简单分析了一下,又给出了以前我们习惯的写法,两相比较,就比较好理解了。
YUI是这么写的:
我们常用的写法:
实际上,我感觉Crockford方法,就是声明了一个静态类,然后直接调用“静态类名+属性”。这样对比理解应该比较简单了。
再来做一组对比
此时handleSuccess是一个函数变量而handleFailure是一个bool变量,值为false。而handleFailure方法就是Crockford pattern。
另外我在测试的时候发现return 后的返回值必须紧跟return,不能折行,下面的写法是错误的。
最近在用Yahoo UI简称YUI的TreeView控件,结合Xmlhttp访问服务器端,真的是挺方便;而且YUI是遵守BSD协议的,不管是自用还是商用都没有版权的问题。在使用的过程中,不可避免的要阅读一下YUI的源代码,发现其中经常遇到一个叫做Crockford Pattern的名次,里面对javascript类的封装有些特别。我简单分析了一下,又给出了以前我们习惯的写法,两相比较,就比较好理解了。
YUI是这么写的:
var d=function()
{
a=3;
b=5;
this.c=6;
return{ info1:"info1 from b",
info2:"info2 from b",a:a,b:this.b,c:this.c};
}()
alert(d.info1+","+d.info2+","+d.a+","+d.b+","+d.c);
{
a=3;
b=5;
this.c=6;
return{ info1:"info1 from b",
info2:"info2 from b",a:a,b:this.b,c:this.c};
}()
alert(d.info1+","+d.info2+","+d.a+","+d.b+","+d.c);
我们常用的写法:
function s()
{
return{ info1:"info1 from b",
info2:"info2 from b"};
}
b=new s();
alert(b.info1+","+b.info2);
或者{
return{ info1:"info1 from b",
info2:"info2 from b"};
}
b=new s();
alert(b.info1+","+b.info2);
var s=function()
{
return{ info1:"info1 from b",
info2:"info2 from b"};
}
b=new s();
alert(b.info1+","+b.info2);
{
return{ info1:"info1 from b",
info2:"info2 from b"};
}
b=new s();
alert(b.info1+","+b.info2);
实际上,我感觉Crockford方法,就是声明了一个静态类,然后直接调用“静态类名+属性”。这样对比理解应该比较简单了。
再来做一组对比
var handleSuccess = function(o)
{
alert("success");
}
var handleFailure=function(o)
{
return false;
}()
var h=new handleSuccess("");
alert(handleSuccess);
alert(handleFailure);
{
alert("success");
}
var handleFailure=function(o)
{
return false;
}()
var h=new handleSuccess("");
alert(handleSuccess);
alert(handleFailure);
此时handleSuccess是一个函数变量而handleFailure是一个bool变量,值为false。而handleFailure方法就是Crockford pattern。
另外我在测试的时候发现return 后的返回值必须紧跟return,不能折行,下面的写法是错误的。
a=function()
{
return
{ info1:"info1 from a",
info2:"info2 from a"
}
}()
alert(a.info1+","+a.info2);
{
return
{ info1:"info1 from a",
info2:"info2 from a"
}
}()
alert(a.info1+","+a.info2);