Mootools 1.2教程(18)——Class 类(第一部分)(3)
作者:Fdream 来源:Fdream博客 发布时间:2008-12-19 12:45:00
标签:Mootools,类,教程,javascript
实现选项功能
当创建类的时候,给类中的一些变量设置一些默认值会非常有用,如果用户没有提供初始输入的话。你可以手动地在初始化方法中设置这些变量,检查每一个输入来看用户是不是提供了相应的值,然后替换相应的默认值。或者,你也可以使用MooTools中Class.extras提供的Options类来实现。
给你的类增加一个选项功能非常简单,就像给类添加一个其他的键值对一样:
参考代码:
var Myclass = new Class({
Implements: Options
首先不要太着急实现选项的细节问题,我们会在后面的教程中更深入的学习。现在,我们已经拥有一个有选项功能的类了,我们还需要做的就是定义一些默认的选项。和其他的所有东西一样,只需要添加一些需要初始化的键值对就可以了。与定义单个值不一样的是,你需要像下面这样定义一组键值对集合:
参考代码:
var Myclass = new Class({
Implements: Options,
options: {
option_one : "First Option",
option_two : "Second Option"
}
现在我们就有了这些默认的集合,我们还需要提供一个方式来供用户在初始化这个类的时候覆盖这些默认值。你所要做的工作就是在你的初始化函数中增加一行新的代码,而Options类会完成其余的工作:
参考代码:
var Myclass = new Class({
Implements: Options,
options: {
option_one : "First Default Option",
option_two : "Second Default Option"
}
initialize: function(options){
this.setOptions(options);
}
})
一旦这个完成以后,你就可以通过传递一组键值对来覆盖任何默认选项:
参考代码:
// 覆盖所有的默认选项
var class_instance = new Myclass({
options_one : "Override First Option",
options_two : "Override Second Option"
});
// 覆盖其中的一个默认选项
var class_instance = new Myclass({
options_two : "Override Second Option"
})
注意一下初始化函数中的setOptions方法。这是Options类中提供的一个方法,可以让你在实例化一个类的时候设置选项。
参考代码:
var class_instance = new Myclass();
// 设置第一个选项
一旦设置了选项,你就可以通过变量options来访问它们。
参考代码:
var class_instance = new Myclass();
// 取得第一个选项的值
var class_option = class_instance.options.options_one;
// 变量class_option现在的值就为"First Default Option"了
如果你想在类的内部访问这个选项,请使用this语句:
参考代码:
var Myclass = new Class({
Implements: Options,
options: {
option_one : "First Default Option",
option_two : "Second Default Option"
}
test : function(){
// 注意我们使用this关键字来
// 引用这个类
alert(this.option_two);
}
});
var class_instance = new Myclass();
// 将弹出一个对话框,显示"Second Default Option"
class_instance.test();
把这些东西组合成一个类,看起来就是这样的:
参考代码:
var Class_four = new Class({
Implements: Options,
options: {
option_one : "Default Value For First Option",
option_two : "Default Value For Second Option",
},
initialize: function(options){
this.setOptions(options);
},
show_options : function(){
alert(this.options.option_one + "\n" + this.options.option_two);
},
});
var run_demo_4 = function ){
var demo_4 = new Class_four({
option_one : "New Value"
});
demo_4.show_options();
}
var run_demo_5 = function(){
var demo_5 = new Class_four();
demo_5.show_options();
demo_5.setOptions({option_two : "New Value"});
demo_5.show_options();
}
// 创建一个类class_four的实例
// 并指定一个名叫new_option的新选项
var run_demo_6 = function(){
var demo_6 = new Class_four({new_option : "This is a new option"});
demo_6.show_options();
}
0
投稿
猜你喜欢
- 为什么页面出现乱码?为什么数据库里出现乱码?为什么这些乱码的出现几率飘忽不定了?诸如此类的乱码问题困扰了很多WEB开发人员。假如不将这背后的
- 在Dreamweaver 4.0中,我们就已接触了模板与库的概念,知道它们是批量生成风格类似的网页的好工具。如今在Dreamweaver M
- 在一个update和insert操作频繁的表中,少量数据测试的时候运行良好,在实际运营中,因数据量比较大(21万条记录),会出现死锁现象,用
- 简介Simon Willison来自英国,是一名经验丰富的开发人员。曾工作于Yahoo,是Web开发框架Django的创始人之一,也是Ope
- 代码如下: function astro(birth) astro="" if birth=""
- 这篇论坛文章(赛迪网技术社区)主要介绍了如何建立适当的索引实现查询优化的相关问题,具体内容请大家参考下文:索引(index)是除表之外另一重
- 一、IE透明度问题在IE的高度超过某一阀值时,会产生透明度不时失效的问题,这现象比较奇怪,(会有的时候全黑,有的时候全白)你有可能无法复现。
- 做前端也有几年时间了,不敢说能把他看地多透,但是多多少少还是有些自己的东西。下面以 Tudou.com 的首页为例,总结总结。就制作而言,我
- 在给客户做个程序时,突然遇到个问题,就是产品页用户提交视频播放文件时,如何根据提交的网址内的视频格式进行正确的播放呢....郁闷了一会,想好
- ExtJS可以用来开发RIA也即富客户端的AJAX应用,是一个用javascript写 的,主要用于创建前端用户界面,是一个与后台技术无关的
- 尽管人们期望在屏幕上有些改变,但是CSS和HTML对页面中的交互能做的实在太少了,而那些还需要用代码来实现。比如一个链接要么是这个颜色,要么
- 在实用美术中,常有"远看色彩近看花,先看颜色后看花,七分颜色三分花"的说法。这也就说明,在任何设计中,色彩对视觉的刺激起
- IE(internet explorer)公司:微软(MicroSoft)布局引擎:Trident(也做MSHTML)注:解析渲染
- 请问如何在ASP中使用ADO调用Oracle的存储过程?我们可以在下面的代码里使用微软Oracle 的OLE DB Provider ,包括
- 我们有理由相信采用新的内核版本(2.2.16-3 smp)也应该有性能的提升: OS2: Newer minor version kerne
- 大家在用asp开发程序的时候,有时候会碰到以下的错误提示:Active Server Pages 错误 'ASP 0141'
- 与前面一样我们会用fso来对文件或文件夹进行创建与删除操作了,其实fso有强大的功能但非常危险的哦,下面我们不来看看删除实例吧,在这些例子,
- 我一直都不喜欢在访问数据库时采用拼接SQL的方法,原因有以下几点: 1. 不安全:有被SQL注入的风险。 2. 可能会影响性能:每条SQL语
- SQL Server有几个版本都在使用中——4.2, 6.0, 6.5, 7.0, 2000,以及2
- 在ASP输出页面只是调出数据库里内容展现给用户看没有使用SESSION等动态属性,是可以CACHE的,以加快访问速度具体操作方法如下:在as