zoukankan      html  css  js  c++  java
  • Understanding RequireJS for Effective JavaScript Module Loading

    Modular programming is used to break large applications into smaller blocks of manageable code. Module based coding eases the effort for maintenance and increases reusability. However, managing dependencies between modules is a major concern developers face throughout the application development process. RequireJS is one of the most popular frameworks around for managing dependencies between modules. This tutorial examines the need for modularized code, and shows how RequireJS can help.

    Loading JavaScript Files

    Large applications often require a number of JavaScript files. Generally, they are loaded one by one using <script> tags. Additionally, each file can potentially be dependent on other files. The most common example would be jQuery plugins, which are all dependent upon the core jQuery library. Therefore, jQuery must be loaded before any of its plugins. Let’s look at a simple example of JavaScript file loading in real applications. Assume we have the following three JavaScript files.

    purchase.js

    function purchaseProduct(){
      console.log("Function : purchaseProduct");
    
      var credits = getCredits();
      if(credits > 0){
        reserveProduct();
        return true;
      }
      return false;
    }

    products.js

    function reserveProduct(){
      console.log("Function : reserveProduct");
    
      return true;
    }

    credits.js

    function getCredits(){
      console.log("Function : getCredits");
    
      var credits = "100";
      return credits;
    }

    In this example, we are trying to purchase a product. First, it checks whether enough credits are available to purchase the product. Then, upon credit validation, it reserves the product. Another script, main.js, initializes the code by calling purchaseProduct(), as shown below.

    var result = purchaseProduct();

    What Can Go Wrong?

    In this example, purchase.js depends upon both credits.js and products.js. Therefore, those files need to be loaded before calling purchaseProduct(). So, what would happen if we included our JavaScript files in the following order?

    <script src="products.js"></script>
    <script src="purchase.js"></script>
    <script src="main.js"></script>
    <script src="credits.js"></script>

    Here, initialization is done before credits.js is loaded. This will result in the error shown below. And this example only requires three JavaScript files. In a much larger project, things can easily get out of control. That’s where RequireJS comes into the picture.

  • 相关阅读:
    对测试集进行测试,只提供了思路,程序是不能用的
    对每块训练集的前99000数据训练,后1000数据集进行测试
    loosalike数据拆分
    我的腾讯looksalike解题思路
    one-hot encoding 对于一个特征包含多个特征id的一种处理方法
    ValueError: Cannot feed value of shape ..
    滴滴面试总结
    Lintcode Digit Counts
    【lintcode】Count of Smaller Number before itself
    lintcode Sliding Window Median
  • 原文地址:https://www.cnblogs.com/chucklu/p/11094616.html
Copyright © 2011-2022 走看看