QML 中常用的 JS 函数整理

作者：billy
版权声明：著作权归作者所有，商业转载请联系作者获得授权，非商业转载请注明出处

前言

QML 是对 JavaScript 的扩展，提供了JS主机环境，支持JS语法。但有些地方是和浏览器中的JS库不同的，比如不支持 DOM（Document Object Model），无法访问浏览器或者 nodejs 的接口等。此章节整理了一些经常在 QML 中使用的JS函数，方便开发中使用。

1. 数组

var arr1 = [1,2,3];		// 定义数组 arr = [1,2,3]
var arr2 = new Array;		// 定义数组 arr2 = []

arr2[0] = 4;			// 通过下标添加元素
arr2[1] = 5;
arr2.push(6);			// 往数组最末尾添加新元素
arr2.unshift(7);		// 往数组最前面添加新元素
arr2.unshift(8);

var arr3 = arr1.concat(arr2);	// 合并数组
console.log(arr3);		// [1,2,3,8,7,4,5,6]

console.log(arr3.sort());	// 按ASCII码排序，[1,2,3,4,5,6,7,8]
console.log(arr3.reverse());	// 元素颠倒顺序，[8,7,6,5,4,3,2,1]
console.log(arr3.join("/"));	// 转换成字符串，“8/7/6/5/4/3/2/1”

arr3.pop();			// 数组删除最末尾的元素
arr3.shift();			// 数组删除最前面的元素
console.log(arr3);		// [7,6,5,4,3,2]
console.log(arr3.slice(1,3));	// 截取指定长度的数组，从1到3（不包括3），[6,5]

arr3.splice(1,3);		// 删除指定长度的数组，从1到3（包括3）
console.log(arr3);		// [7,3,2]

2. 字符串

var str = " 1a 2V3 C4D 5E6f7 a8B 9abcDDD ";
console.log(str.length);		// 字符串长度，30
console.log(str.charAt(10));		// 返回字符串中该下标位置的字母，D

console.log(str.toUpperCase()); 	// 全部转换为大写字母， 1A 2V3 C4D 5E6F7 A8B 9ABCDDD 
console.log(str.toLowerCase()); 	// 全部转换为小写字母， 1a 2v3 c4d 5e6f7 a8b 9abcddd 

console.log(str.indexOf("abc"));	// 返回子字符串在字符串中的位置，若没有则为-1，23
console.log(str.indexOf("ac"));		// -1
console.log(str.lastIndexOf("D"));	// 返回子字符串在字符串中最后的位置，28
console.log(str.search("abc"));		// 返回子字符串在字符串中的位置，若没有，则为-1，23
console.log(str.search("ac"));		// -1

console.log(str.slice(2,5));		// 截取从2到5（不包括5），a 2
console.log(str.slice(-10,-3));		// 若为负数则索引顺序倒过来，B 9abcD

console.log(str.substring(2,5));	// 截取从2到5（不包括5），a 2
console.log(str.substr(2,5));		// 截取从2开始的5位，a 2V3

console.log(str.split("a"));		// 按分界符分解成数组，[ 1, 2V3 C4D 5E6f7 ,8B 9,bcDDD ]
console.log(str.trim());		// 去掉字符串首尾空格，1a 2V3 C4D 5E6f7 a8B 9abcDDD

for(var i = 0; i < str.length; i++)
{
    if(str[i] === " ") {
        str = str.replace(" ", "");	// replace一次只能替换1个空格
    }
}
console.log(str);			// 1a2V3C4D5E6f7a8B9abcDDD

3. 日期

var currentTime = Qt.formatDateTime(new Date(), "yyyy-MM-dd dddd hh:mm:ss");
console.log(currentTime);		// 当前时间按格式输出，2020-04-25 星期六 20:43:45

var date = new Date();
console.log(date.getFullYear());	// 年份，2020
console.log(date.getMonth()+1);		// 月份（范围是0-11，所以记得+1），4
console.log(date.getDate());		// 日，25
console.log(date.getHours());		// 小时，20
console.log(date.getMinutes());		// 分钟，43
console.log(date.getSeconds());		// 秒，45
console.log(date.getTime());		// 获得自1970年1月1日0时0分0秒开始的豪秒，1587818625924

4. 数学计算

console.log(Math.PI);				// 圆周率，3.141592653589793
console.log(Math.SQRT1_2);			// 0.5的平房根，0.7071067811865476
console.log(Math.SQRT2);			// 2的平方根，1.4142135623730951
console.log(Math.E);				// 自然常数e，2.718281828459045
console.log(Math.LN2);				// 2的自然对数，0.6931471805599453
console.log(Math.LN10);				// 10的自然对数，2.302585092994046
console.log(Math.LOG2E);			// log以2为底E的对数，1.4426950408889634
console.log(Math.LOG10E);			// log以10为底E的对数，0.4342944819032518

console.log(Math.min(12,2,4,5,1));		// 取最小值，1
console.log(Math.max(12,2,4,5,1));		// 取最大值，12
console.log(Math.round(4.58));			// 四舍五入，5
console.log(Math.round(4.48));			// 4
console.log(Math.ceil(6.2));			// 向上取整，7
console.log(Math.ceil(6.0));			// 6
console.log(Math.ceil(-1.5));			// -1
console.log(Math.floor(3.5));			// 向下取整，3
console.log(Math.floor(3.0));			// 3
console.log(Math.floor(-1.5));			// -2
console.log(Math.random());			// 0-1的随机数，0.03210196912474761
console.log(Math.sqrt(25));			// 数值的平方根，5
console.log(Math.abs(-2));			// 取绝对值，2

console.log(Math.acos(0));			// arccos 反余弦，1.5707963267948966
console.log(Math.asin(0));			// arcsin 反正弦，0
console.log(Math.atan(1)*180/Math.PI);		// arctan 反正切，45
console.log(Math.cos(Math.PI));			// 余弦，-1
console.log(Math.sin(Math.PI));			// 正弦，1.2246467991473532e-16
console.log(Math.tan(Math.PI));			// 正切，-1.2246467991473532e-16
console.log(Math.atan(Math.sqrt(3),1));		// 计算极角，夹在X正半轴与x,y间的角，1.0471975511965976
console.log(Math.pow(3,2));			// X的Y次幂，9
console.log(Math.log(10));			// x的自然对数，2.302585092994046
console.log(Math.exp(2));			// E的X次方，7.38905609893065

5. 二维数组降维

let arr = [ [1], [2], [3] ];
arr = Array.prototype.concat.apply([], arr); 
console.log(arr);				// [1, 2, 3]

6. 深拷贝

let arr1 = [1,2,3];
var arr2 = arr1;
console.log(arr1 === arr2);			// true

arr1[0] = 4;
console.log("arr1: " + arr1)			// arr1: 4,2,3
console.log("arr2: " + arr2)			// arr2: 4,2,3

var arr3 = JSON.parse(JSON.stringify(arr1));	// deep copy
arr1[0] = 8;
console.log("arr1: " + arr1)			// arr1: 8,2,3
console.log("arr3: " + arr3)			// arr3: 4,2,3

7. 获取数组最大最小值

console.log(smallest([0, 1, 2.2, 3.3])); 	// 0
console.log(largest([0, 1, 2.2, 3.3])); 	// 3.3

function smallest(array) {
    return Math.min.apply(Math, array);
}
function largest(array) {
    return Math.max.apply(Math, array);
}

8. 判断小数是否相等

var num1 = 0.1 + 0.2;
var num2 = 0.3;

console.log(num1 === num2);		// false
console.log(epsEqu1(num1, num2));	// true
console.log(epsEqu2(num1, num2));	// true

function epsEqu1(x, y) {
    return Math.abs(x - y) < Math.pow(2, -52);
}

function epsEqu2(x, y) {
    return Math.abs(x - y) < Number.EPSILON;
}

9. 用对象代替 switch 和 if

var str = "aaa";
let ret = 0;

if (str === "aaa") {
    ret = 1;
} else if (str === "bbb") {
    ret = 2;
} else {
    ret = 0;
}
console.log("ret in if: " + ret);		// ret in if: 1

switch (str)
{
case "aaa": ret = 3; break;
case "bbb": ret = 4; break;
default: ret = 0; break;
}
console.log("ret in switch: " + ret);		// ret in switch: 3

let obj = {
    "aaa": 5,
    "bbb": 6
}
console.log("ret in obj: " + obj[str]);		// ret in obj: 5
console.log("ret in obj: " + obj["ccc"]);	// ret in obj: undefined

10. ! 和 !! 的用法

console.log(!null);		// true
console.log(!undefined);	// true
console.log(!'');		// true
console.log(!100);		// false
console.log(!'abc');		// false

var obj;
if ( obj !== null && obj !== undefined && obj !== '' ) {
    console.log("obj的内容不为空")
}

if ( !!obj ) {			// !!obj 就等于上面3个判断同时成立
    console.log("obj的内容不为空")
}

暂时先整理这些，以后用到了再加进来。。。