QML編程雜談

1.約定俗成的規則 

1.id
2.對象屬性
3.屬性聲明
4.信號聲明
5.JavaScript函數
6.子對象
7.狀態
8.狀態切換

2.斷言的使用方法

//斷言功能。就是判斷其內的條件是否成立，就跟C++的斷言一樣的用法
function test_assert() {
       var x = 12
       console.assert(x == 12, "This will pass");
       console.assert(x > 12, "This will fail");
     }



輸出如下：
This will fail
test_assert (qrc:/main.qml:15)
onCompleted (qrc:/main.qml:18)

 

3.計算函數執行時間

    function calcRunTime() {
        console.time("wholeFunction");


        console.time("firstPart");
        // first part
        for (var i=0 ; i<1000*1000 ; i++)
            ;

        console.timeEnd("firstPart");
        // second part
        for (var i=0 ; i<100 *1000; i++)
            ;
        console.timeEnd("wholeFunction");
    }

運行如下：
firstPart: 27ms
wholeFunction: 30ms

4.計算函數執行次數 

 

    function calcExeTimes() {
        console.count("fun called")
    }

    Component.onCompleted: {
        //test_assert();
        //calcRunTime();

        for (var i=0 ; i<10 ; i++)
            calcExeTimes();
    }

運行結果：
fun called: 1
fun called: 2
fun called: 3
fun called: 4
fun called: 5
fun called: 6
fun called: 7
fun called: 8
fun called: 9
fun called: 10

5.字符編解碼

    function  characterCode() {
        var uri = "http://www.baidu.com/"
        var encodeUri = encodeURI(uri)
        var encodeUriCompoent = encodeURIComponent(uri)
        console.log(encodeUri)
        console.info(encodeUriCompoent)

        var decodeUri = decodeURI(encodeUri)
        var decodeUriCompoent = decodeURIComponent(encodeUriCompoent)
        console.info(decodeUri)
        console.info(decodeUriCompoent)
    }
運行結果：
qml: http://www.baidu.com/
qml: http%3A%2F%2Fwww.baidu.com%2F
qml: http://www.baidu.com/
qml: http://www.baidu.com/

6.解析JSON

    property var jsonList:{
            "name":"BeJson",
        "url":"http://www.bejson.com",
        "page":88,
        "isNonProfit":true,
        "address":{"street":"科技園路.","city":"江蘇蘇州","country":"中國"},
        "links":[{"name":"Google","url":"http://www.google.com"},
                 {"name":"Baidu","url":"http://www.baidu.com"},
                 {"name":"SoSo","url":"http://www.SoSo.com"}
                ]
           }


        function parseJson(json) {
            console.log(json["name"])
            console.log(json["url"])
            console.log(json["page"])
            console.log(json["isNonProfit"])
            console.log(json.address["street"])
            console.log(json.address["city"])
            console.log(json.address["country"])
            console.log(json.links[0].name)
            console.log(json.links[0].url)
            console.log(json.links[1].name)
            console.log(json.links[1].url)
            console.log(json.links[2].name)
            console.log(json.links[2].url)
        }

運行結果：
qml: BeJson
qml: http://www.bejson.com
qml: 88
qml: true
qml: 科技園路.
qml: 江蘇蘇州
qml: 中國
qml: Google
qml: http://www.google.com
qml: Baidu
qml: http://www.baidu.com
qml: SoSo
qml: http://www.SoSo.com

 7.創建json

        function createJson() {
            var myObj = { "name":"Bill Gates",  "age":62, "city":"Seattle" };
            myObj.sex = "man";
            var myJSON = JSON.stringify(myObj);
            return myJSON;
        }
運行結果：
qml: -0-- {"name":"Bill Gates","age":62,"city":"Seattle","sex":"man"}