×
Namespaces

Variants
Actions

使用Prototype JavaScript库: 在WRT应用中创建对象

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata

代码示例
兼容于
文章
dougcn 在 22 Apr 2008 创建
最后由 hamishwillee 在 09 May 2012 编辑

Contents

简介

总所周知,Prototype是一个著名的跨浏览器JavaScript库, 它支持几乎所有当前流行的浏览器,比如: FireFox, Safari, IE, Opera, 等等。 Prototype最新版(1.6.0),甚至更早版本,也支持AppleWebKit。AppleWebKit是一个有Apple公司开源的Web引擎。(它也是Safari的核心引擎。)

Nokia Web浏览器建立在S60WebKit上,S60WebKit是开源的WebKit项目在S60平台上的移植。Nokia WRT(Web-RunTime)也基于此。

在这个主题,我们将看到如何使用prototype.js库定义类及子类。

安装prototype.js

如何安装prototype.js库,请到这里

对象创建

类和子类可以用新语法与旧语法来定义,我们将使用两种定义以便比较。我们也将学习如何添加实例方法与类方法。

定义类(使用新语法)

定义一个类,比如,Animal类,我们可以调用Class.create方法并将一些属性传入这个方法,如下:

// properties are directly passed to `create` method
var Animal = Class.create({
initialize: function(name) {
this.name = name;
},
eat: function(food) {
return this.name + ' is eating ' + food;
}
});

从Animal类派生一个子类Cat,我们再次调用Class.create函数,并将Animal类作为第一个参数,以及一个新类的方法集合作为第二个参数。注: Class.create可以接受任意数量的参数。

// when subclassing, specify the class you want to inherit from
var Cat = Class.create(Animal, {
// redefine the eat method
eat: function($super, food) {
return $super(food) + ' or sth.!';
}
});

在Cat类中,eat方法覆盖了父类中的同样的方法。

“新语法”测试用例的源代码如下:

function testNewSyntax()
{
var cat1 = new Cat('Mimi');
alert(cat1.eat('fish'));
// ->; "Mini is eating fish or sth!"
}

定义类(使用旧语法)

定义类——Aninal0类。(在全局名字空间中,我们必须使用一个不同的类。)

/** obsolete syntax **/
var Animal0 = Class.create();
Animal0.prototype = {
initialize: function(name) {
this.name = name;
},
eat: function(food) {
return this.name + ' is eating ' + food;
}
};

定义子类——Cat0类。 (再次,我们使用一个不同的名称。)

var Cat0 = Class.create();
// inherit from Person class:
Cat0.prototype = Object.extend(new Animal0(), {
// redefine the eat method
eat: function(food) {
return this.name + ' is eating ' + food + ' or sth.!';
}
});

“旧语法”测试用例的源代码如下:

function testOldSyntax()
{
var cat1 = new Cat0('Mimi');
alert(cat1.eat('fish'));
// -> "Mini is eating fish and sth.!"
}

为现存class临时添加新方法

给Animal类添加一个新方法,这样,派生类的实例也能调用那个方法。

function testAddMethods()
{
var cat1 = new Cat('Mimi');
 
// every animal should be able to drink. But here we just let it "eat water"
Animal.addMethods({
drink: function() {
return this.eat('water');
}
});
 
alert(cat1.drink()); // -> "Mimi is eating water or sth.!"
}

定义新类时使用mixin模块

首先,定义一个mixin模块——Tunnable。

// define a module
var Tunable = {
down: function(hp) {
this.volume -= hp;
if (this.volume < 0) this.mute();
},
mute: function() {
this.isMute = true;
}
};

其次,创建一个基于这个mixin的类。

var Tuner = Class.create(Tunable, {
initialize: function() {
this.volume = 100;
this.isMute = false;
}
});

接着测试这个类。下面是测试用例的源代码:

function testMixin()
{
var tuner = new Tuner;
tuner.down(30);
alert(tuner.volume); //-> 70
}

添加类方法

这里我们定义一个名叫“allEatSth”的类方法。这样,你就能直接调用Cat.allEatSth()函数了。

function testClassMethods()
{
Cat.allEatSth = function(n) {
var items = [];
n.times(function(i) {
items.push(new Cat('Teddy').eat( i + 1));
});
return items;
}
 
alert(Cat.allEatSth(3));
// -> ["Teddy is eating 1 or sth.!", "Teddy is eating 2 or sth.!", "Teddy is eating 3 or sth.!"]
}

另外,还有一些其他的途径定义新方法。请浏览下面参考内容获得更多信息。

下载样例应用

下载本主题样例Widget: File:PrototypeObject.zip. 安装时,将后缀.zip更改为.wgz。

对于最新版本,请浏览: http://code.google.com/p/prototypewrt/downloads/list

相关主题

参考

  • Prototype主页 [1]
  • 样例WRT应用下载[2]
This page was last modified on 9 May 2012, at 08:05.
54 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×