第一,常规封装
要说说这个常规,不禁要提起js一般语法!ps:本部分适合菜鸟,高手可以直接跳到第二!
什么叫封装?
所谓"封装"即调用对象的用户不必了解实现特定功能的详细代码和过程, 只需懂得设置对象属性(即定义时被封装的变量), 调用其方法(即定义时被封装的函数)就可以了!
那么怎么去做一个对象呢?其实在js中对象的概念是非常泛化的!你可以把一个函数称之为对象,也可以把一个网页元素叫成一个对象,甚至把一个字符串叫做对象!怎么称呼使人感到困惑,如果一个一个都搞清,那是根本不可能的,也是没有必要的,能用就行~
当人们停留在对信息显示要求的层面上时,js是一种点缀作用,使用的方面十分少!于是渐渐的从人们的视野里淡化了,或许这就是传说中的web1.0时代吧!如今web2.0把网页设计带入了一个新的阶段,js以其 ajax技术重出江湖!同时配合流行的 php+ mysql简直就是web开发的无敌利器,并且时时给我们带来惊喜!
先来看看怎么写类吧!
//----------------------------------------------------------------
// pasta 是有四个参数的构造器。
function pasta(grain, width, shape, hasEgg)
{
// 是用什么粮食做的?
this.grain = grain;
// 多宽?(数值)
this.width = width;
// 横截面形状?(字符串)
this.shape = shape;
// 是否加蛋黄?(boolean)
this.hasEgg = hasEgg;
}
//----------------------------------------------------------------
从形式上看它是一个函数,其实它却是有血有肉的类!注意它有4个属性:grain,width,shape,hasEgg!在我的理解中,类(也可以称为构造器)就像你的一个小屋子,里面随便你怎么搞:你可以在墙上贴的到处是你的偶像,也可以贴的到处是报纸......那是自由的,也是个性的,或许这是为什么很多人选择用类写程序的原因吧!
很多人说:我见到别人是这么写的!
//----------------------------------------------------------------
// pasta 是有四个参数的构造器。
pasta=function(grain, width, shape, hasEgg)
{
// 是用什么粮食做的?
this.grain = grain;
// 多宽?(数值)
this.width = width;
// 横截面形状?(字符串)
this.shape = shape;
// 是否加蛋黄?(boolean)
this.hasEgg = hasEgg;
}
//----------------------------------------------------------------
其实这样的写法是换汤不换药,第一种是标准写法,第二种是当成一个变量来写!使用第二种写法可要注意了,因为引用类之前必须先声明!
怎样使用类呢?
和其他语言一样,需要初始化一下,当然时下 java和php5都支持静态引用了!呵呵~javascrīpt就别想了!当然也就是多写一步new就行了:
//----------------------------------------------------------------
var testPasta=new pasta('rice','10','round',true);
alert(testPasta.grain);
//----------------------------------------------------------------
以上代码实现了对类pasta初始化成testPasta,同时引用了testPasta的grain属性。其实在javascrīpt的属性和方法是混为一坛,当然要看人怎么去理解了!!
第二,JSON封装
还是简单讲一下概念吧!
JSON(Javascrīpt Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于Javascrīpt Programming Language, Standard ECMA-262 3rd Edition - December 1999的一个子集。JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, Javascrīpt, Perl, Python,php等)。这些特性使JSON成为理想的数据交换语言。
注意:上述定义是狭义的,广义上JSON是所有形如{......}的写法!
说到数据交换,那我们先来看看传统的数据交换xml吧!
上述代码实现了数据文件xml的传递
同时再来看看JSON怎么写:
//----------------------------------------------------------------
{items:[
{
id:1,
author:\"h058\",
url:\"http://www.allyes.com\",
content:\"Welcome to allyes.com\"
},
{
id:2,
author:\"fly\",
url:\"http://www.fly.cn\",
content:\"Welcome to fly.cn\"
}
]};
//----------------------------------------------------------------
比较这两种写法:JSON不仅减少了解析XML解析带来的性能问题和兼容性问题,而且对于js来说非常容易使用,可以方便的通过遍历数组以及访问对象属性来获取数据,其可读性也不错,基本具备了结构化数据的性质。不得不说是一个很好的办法,而且事实上google maps就没有采用XML传递数据,而是采用了JSON方案。
JSON能完全取代XML吗?当然不能,原因就在于XML的优势:通用性。要使服务器端产生语法合格的Javascrīpt代码并不是很容易做到的,这主要发生在比较庞大的系统,服务器端和客户端有不同的开发人员。它们必须协商对象的格式,这很容易造成错误。
撇开数据交换,对象封装时我们也使用JSON:
//----------------------------------------------------------------
* JSON is easy. No really. It’s so easy, it’ll make you sick.
* If you’re familiar with writing classes in PHP, then you’ll most definitely be comfortable with writing Javascrīpt in Object Notation
* JSON is nothing more than name : value pairs assigned within an object.
* JSON is easy to understand because if written well, it’s a self-documenting structure.
* JSON is fast!
* JSON organizes the ugly mess of procedural programming. Imagine having more than one init function.
* You can impress your friends with JSON because it’s pretty looking
* Your co-workers will love you for writing in JSON because it will most likely not conflict with their scrīpts that are being called within the same web documents.
//----------------------------------------------------------------
这些是从国外的一个网站上摘录的!简单 翻译一下:
//----------------------------------------------------------------
* JSON 很简单!甚至简单的让人困惑!
* 如果他在php写作时非常喜欢用类,那么他也会很自然和习惯使用js中的对象!
* JSON 就是在对象中使用名称:值
* JSON 是一种结构化的写法,所以是非常容易理解的。
* JSON 是快速的!
* JSON 有效的把所有繁杂的东西整合起来了
* 因为JSON看起来非常美观,这样的代码会使你的 朋友印象深刻!
* 他的同事也会欣然接受你的代码,因为你的代码命名不会和她们的冲突
//----------------------------------------------------------------
这就像以前我下定决心学习php一样,为了这些优点,我义不容辞,毫不犹豫的接受,更活灵活现的使用!
如果这些还不能吸引你使用JSON,好,我们就来看看优秀代码的封装!
第一分析:Sam Stephenson 的作品:prototype
你可以看到
//----------------------------------------------------------------
var Prototype = {
Version: '1.4.0',
scrīptFragment: '(?:
emptyFunction: function() {},
K: function(x) {return x}
}
//----------------------------------------------------------------
这就是一个JSON简单封装!
第二分析: Thomas Fuchs的scrīpt.aculo.us
//----------------------------------------------------------------
var scrīptaculous = {
Version: '1.6.4',
require: function(libraryName) {
document.write('
},
load: function() {
......//本部分省略
}
}
//----------------------------------------------------------------
从这个类看并没有什么特殊的地方,只是比第一分析的JSON稍微复杂一点
第三分析:yahoo的GUI类库
//----------------------------------------------------------------
if (typeof YAHOO == "undefined") {
YAHOO = {};
}
YAHOO.namespace = function(ns) {
if (!ns || !ns.length) {
return null;
}
var levels = ns.split(".");
var nsobj = YAHOO;
for (var i=(levels[0] == "YAHOO") ? 1 : 0; i
nsobj = nsobj[levels[i]];
}
return nsobj;
}
//----------------------------------------------------------------
这个类就是比较隐形的,看看 YAHOO = {}吧,已经申明了JSON!
菜鸟说:我还以为什么呢?不就是无类型对象的写法吗?呵呵~在一定程度上可以这么理解!说起来很简单,能不能灵活运用就要看个人的编程习惯了!同时,我觉得JSON也是有弱点的,这样的对象是一执行就会被定义了,这在一定程度上占用了一部分内存,所以像JSON这样的静态对象要考虑是否有必要!当然这么点影响对于现在的电脑配置是可以忽略的了!关于js的优化问题是很小却很杂的东西,要求太多的技巧!希望下次有机会和大家一起研究js的优化!
好了,关于对象的封装问题就说到这里!只是稍微点了一下,如果说要完全说清楚是不可能的,也是没必要的,因为现在网上有一大堆的资料正等着你去翻阅呢!希望这篇拙作可以给大家带来一点点收益!