【QML 快速入门】QML语法-对象篇(二)

一、Date

Date 对象用于处理日期和时间。你可以这样创建一个 Date 对象：

var today = new Date()

当使用无参构造函数创建 Date 对象时，该对象会自动把当前日期和时间保存为其初始值。实际上 Date 对象还可以用下面的方式来创建：

new Date(value)
new Date(datestring)
new Date(year, month, day, hour, minute, second, millisecond)

示例如下：

var birthdayl = new Date("2009-10-21T22:24:00")
var birthday2 = new Date(2009, 10, 21)
var birthday3 = new Date(2009, 10, 21, 22, 24, 0)

（1）提取相关函数

下列方法可以从 Date 对象中提取信息：

• getDate()，返回一个月中的某一天（1〜31）。

• getDay()，返回一周中的某一天（0〜6）。

• getMonth()，返回月份（0〜11）。

• getFullYear()，返回4位数字年份。

• getHours()，返回小时（0〜23）。

• getMinutes()，返回分钟（0〜59）。

• getSeconds()，返回秒数（0〜59）。

• getMilliseconds()，返回毫秒（0〜999）。

• getTime()，返回1970年1月1日至今的毫秒数。

• toString()，把日期转换为本地字符串。

简单的示例：

var d = new Date()
console.log(d.toString())
console.log(d.getFullYear(), d.getMonth(), d.getDate())
console.log("since 1970.1.1 - ", d.getTime())

/*
输出结果：
qml:周六十月 11 21:15:06 2014 GMT+0800
qml: 2014 - 9 - 11
qml： since 1970.1.1 - 1413033306317
*/

Date 还有一些与 UTC 吋间相关的方法，如 getUTCDate()、getUTCDay()、getUTCMonth() 等。

（2）设置相关函数

下列方法可以设置 Date 对象的相关信息：

• seiDate()，设置月的某一天（1〜31）。
• setMonth()，设置月份（0〜11）。
• setFullYear()，设置 4 位数字年份。
• setHours()，设置小时（0〜23)。
• setMinutes()，设置分钟（0〜59）。
• setSeconds()，设置秒钟（0〜59）。
• setMilliseconds()，设置毫秒（0〜999）。
• setTime()，以1970年1月1日至今的毫秒数设置 Date 对象。

（3）静态方法

Date 还有一些静态方法，不需要创建 Date 对象就可以使用，比如：

• Date.now() 方法，返回从1970年1月1日凌晨至今的毫秒数。

• Date.parse() 方法，解析一个时间字符串，返回那个时间距离1970年1月1日凌晨至今的毫秒数

• Date.UTC()，解析 UTC 时间，返回那个时间距离1970年1月1日凌晨至今的毫秒数，它的参数是整型的年、月、日、时、分、秒、毫秒，至少提供年、月，就像构造函数一样。

看一个使用 Date.now() 计算耗时的小示例：

var start = Date.now();
for(var i = 0; i < 10000000; i++);
var end = Date.now();

var elapsed = end - start;
console.log(elapsed);

Date 还有很多其他的方法，具体请参考：Date QML Type。

二、Objec

Object 类是所有 ECMAScript 类的基类，Object 类的所有属性和方法都会出现在其他类中，理解了 Object 类，就可以更好地理解其他类。

Object 类具有下列属性：

• constructor，指向创建对象的函数，对于 Object 类，它指向 object() 函数。
• prototype，对该对象的对象原型的引用。暂时可以将原型理解为 C++ 中的类声明，不过不同的是，ECMAScript 允许在运行时改变对象原型。

Object 类还有几个方法：

• hasOwnProperty(property)，判断对象是否有某个属性，property 为字符串，比如 root.hasOwnProperty ("width”)。
• isPrototypeOf(object)，判断该对象是否为另一个对象的原型。
• propertylsEnumerable(property)，判断给定的属性是否可以用 for...in 语句进行枚举。
• toString()，返回对象的字符串表示。在 QML 中，很多 Qt 提供的类型，如 Rectangle， toString() 方法返回其对应的 C++ 类型名字或 QML 类型名字。
• valueOf()，返回最适合该对象的原始值。对于许多类，该方法返回的值都与 toString() 一样。

上面列出的每种属性和方法都可能会被 Object 的派生类覆盖。下面是使用上述方法的一个简单的 QML 文档：

import QtQuick 2.2

Rectangle { 
    id: root
	Component.onCompleted:{
		var obj = new Object()
		console.log(obj.toString())
		console.log(obj.constructor)
		console.log(root.hasOwnProperty("width"))
		console.log(Item.isPrototypeOf(root))
		console.log(root.propertylsEnumerable("childrenM))
		console.log(root.toString())
		console.log(root.valueOf())
}        

你可以使用 qmlscene 加载上面的QML文档来查看运行结果。

（1）动态增加属性

在 ECMAScript 中，对象的属性可以动态地增删，非常有趣，与 C++ 这种强类型语言有 很大不同。比如下面的代码：

var person = new Object()
person.name = "zhangsan"
person.year = 20

我们构造了一个对象 person，然后使用操作符设置其 name 属性为 zhangsan，year

属性为 20，而这两个属性原本是没有的，是在对象已经创建之后添加的。

（2）动态增加方法

对象的方法就是一个函数，也可以动态地增加，然后按函数的方式调用。

person.printInfo = function printlnfo(){
	console.log("name -", this.name, "year -", this.year)
}
person.printlnfo()

（3）使用数组下标访问属性和方法

没有做不到的，只有想不到的，对象的属性和方法居然可以使用数组下标来访问。比如这样：

console.log(person["name"]) // -> person.name 
person ["printlnfo"]() // -> person.printlnfo()

如你所见，使用数组下标访问时，索引是代表属性和方法名字的字符串，而不是我们常见的整数。我们可以把对象理解为 Key-Value 对的集合，属性、方法名就是 Key，其指向的，就是 Value。

（4）对象的字面量表示法

前面介绍原始类型时提到了数字字面量、字符串字面量，其实对象也能用字面量表示。 例如：

var person = {
   "name": "zhangsan"
   "year": 20
}

对象的字面量表示法，语法是这样的：使用一对花括号表示一个对象，其属性以 Key:Value 对的形式放在花括号内，多个属性之间使用逗号分隔；如果一个属性本身是对象，还可以使 用字面量表示法来嵌套描述。

三、你不可不知的对象碎碎念

类定义了一个属性和方法的集合，作为构建对象的模板，使用new运算符构造对象的过程被称为实例化，而对象也经常被称为类的实例。下面的代码，根据类Array实例化了一个对象array:

var array = new Array();

如你所见，对象是用 new 运算符后跟要实例化的类的名字来创建的。array 是一个引用 值，相当于 C++ 中的指针，它只是作为一个引用指向实际的物理对象。每次创建对象，存储在变量中的都是该对象的引用，而不是对象本身。

C++ 前辈们一两告诫，new 出来的对象一定要 delete。这是 C++ 的游戏规则，ECMAScript 不是这样的！像 Java 一样，ECMAScript 有垃圾收集器（GC，Garbage Collection)，当没有任何引用指向一个对象时，该对象就可以被垃圾收集器回收、销毁。而垃圾收集器可能在函数执行完毕后运行，也可能在实现 ECMAScript 的引擎觉得必要时运行。

把对象的引用设置为 null，就可以解除对对象的引用。例如：

var array = new Array();
array = null;

如果把对象的所有引用都设置为 null，该对象就被废除了，下次垃圾收集器运行时，就会销毁对象。每用完一个对象，就通过设置引用为 null 来废除它，是个好习惯。

四、宿主对象 Qt

Qt 是 QML 提供的一个全局宿主对象，整合了常用的属性、方法和枚举类型，方便开发者引用。

1. Qt对象的属性

（1）application 属性

Qt.application 是一个对象，可以通过它访问应用的全局状态。

• application.state 表示应用状态，有 Qt.ApplicationActive、Qt.Applicationlnactive、Qt.ApplicationSuspended、Qt.ApplicationHidden，你可以望文生义，或者查阅 Qt 帮助来了解详情。

• application.layoutDirection 代表布局方向，可以取 Qt.LeftToRight、Qt.RightToLeft。

• application.arguments 存储应用启动吋的参数。

• application 还有 application.name、application.version、application.organization、application.

• application 有一个信号，aboutToQuit()，在应用要退出时发射，你可以连接它来做一些清理工作。它与 QCoreApplication 的 aboutToQuit() 是一个东西。

（2）platform 属性

application.platform 是一个对象，platform.os 存储操作系统的名字，可能是：

• "linux” - Linux

• "windows” - Windows

• "osx" - OS X

Qt 还有 inputMethod 属性，详情请参考 Qt 帮助。

2. Qt对象的枚举类型

Qt 对象包含非常多的枚举值，你在 Qt 帮助的索引模式下按关键字 “Qt Namespace” 检索。

• 按键枚举类型：Qt.Key_0、Qt.Key_Emer、 Qt.Key Home 等。

• 应用状态：Qt.ApplicationActive、Qt.Applicationlnactive 等。

• 布局方向：Qt.LeftToRight、Qt.RightToLeft 等。

• 窗口模态：Qt.NonModal、Qt.ApplicationModal、Qt.WindowModal。

• 窗口类型标记，Qt.Window、Qt.Tool Window 对象的 flags 属性就从这些值中取值。

• 鼠标事件中，可以使用Qt.LeftButton、Qt.RightButton....

3. Qt对象的方法

Qt 对象有一长串的方法，咱们分类来看看。

（1）用于创建宿主类型

我们可以使用 Qt 对象提供的方法来创建某些 QML 提供的类型，用于给 Item 等对象的 某些属性赋值，比如我们前面用过的 Qt.rgba()。下面是完整的列表：

• Qt.rect() 创建 rect 实例。
• Qt.point() 创建 point 实例。
• Qt.size() 创建 size 实例。
• Qt.rgba()、Qt.hsla()、Qt.darker()、Qt.lighter()、Qt.tint() 等创建 color 类型的颜色值。
• Qt.font() 创建字体。
• Qt.vector2d() 创建 vector2d。

（2）格式化日期、时间

Date 类的 toLocaleString() 等 toLocaleXXX 系列方法有时也满足不了大家伙千奇百怪的奇葩需求，因此 Qt 对象提供了几个方法用来格式化日期和时间。它们是：

• string Qt.formatDateTime(datetime date, variant format)

• string Qt.formatDate(datetime date, variant format)

• string Qt.formatTime(datetime date, variant format)

说下 format，简单地讲，你可以用类似于 “yyyy-MM-ddhh:mm:ss.zzz” 之类的字符串来描述日期和时间的输出格式。举个简单的例子：

var today = new Date();
console.log(Qt.formatDateTime(today, "yyyy-MM-dd hh:mm:ss.zzz"));

// 输出：2014-08-22 14:51:05.406

（3）动态对象创建

对象动态创建，就会用到 Qt 对象提供的两个方法，它们是：

• object Qt.createComponent(url)
• object Qt.createQmlObject(string qml, object parent, string filepath)

具体怎么用，这里不再赘述。

（4）其他方法

“其他” 一直是个不可思议的词儿，无法分类的东西都可以归到它下面。Qt 对象还提供这些方法：

• Qt.quit()，退出应用，熟悉吧。

• StringQt.md5(string)，计算字符串的 MD5 值，返回的也是字符串。

• stringQt.resolvedUrl(url)，将传入的相对路径转换为全路径。

参考：

《Qt Quick 核心编程》第5章 ECMAScript初探