美文网首页
小程序:脚本的执行顺序问题

小程序:脚本的执行顺序问题

作者: 天幕下悠悠 | 来源:发表于2019-01-15 18:00 被阅读0次

    脚本的执行顺序

    浏览器中,脚本严格按照加载的顺序执行,如代码2-29所示。

    代码清单2-29 浏览器中的脚本

    <html>
    <head>
      <!-- a.js
      console.log('a.js')
       -->
      <script src ="a.js"></script>
      <script>
        console.log('inline script')
      </script>
    
      <!-- b.js
      console.log('b.js')
       -->
      <script src ="b.js"></script>
    </head>
    </html>
    

    以上代码的输出是:

    a.js
    
    inline script
    
    b.js
    

    而在小程序中的脚本执行顺序有所不同。小程序的执行的入口文件是 app.js 。并且会根据其中 require 的模块顺序决定文件的运行顺序,代码2-30是一个 app.js 示例。

    代码清单2-30 app.js

    /* a.js
    console.log('a.js')
    */
    var a = require('./a.js')
    console.log('app.js')
    
    /* b.js
    console.log('b.js')
    */
    var b = require('./b.js')
    

    以上代码的输出顺序是:

    a.js
    
    app.js
    
    b.js
    

    当 app.js 执行结束后,小程序会按照开发者在 app.json 中定义的 pages 的顺序,逐一执行。如代码2-31所示。

    代码清单2-31 app.json 文件

    {
      "pages": [
        "pages/index/index",
        "pages/log/log",
        "pages/result/result"
      ],
      "window": {}
    }
    

    代码清单2-32 app.js文件

    // app.js
    console.log('app.js')
    

    代码清单2-33 pages/index/index.js 文件

    // pages/index/index
    console.log('pages/index/index')
    

    代码清单2-34 page/log/log.js 文件

    // pages/log/log
    console.log('pages/log/log')
    

    代码清单2-35 page/result/result.js 文件

    // pages/result/result
    console.log('pages/result/result')
    

    以上文件执行后输出的结果如下:

    app.js
    
    pages/index/index
    
    pages/log/log
    
    pages/result/result
    

    相关文章

      网友评论

          本文标题:小程序:脚本的执行顺序问题

          本文链接:https://www.haomeiwen.com/subject/ttaydqtx.html