这篇文章主要介绍了在JavaScript应用中使用RequireJS来实现延迟加载,JavaScript是一款人气JS库,需要的朋友可以参考下
无论简单还是复杂的Web应用，都由一些HTML、JavaScript、CSS文件组成。通常开发者会通过JQuery、Knockout、Underscore等等这样的第三方JavaScript框架来提高开发速度。由于这些JavaScript框架都针对特定的用途开发而且已经得到了“验证”，所以直接使用它们就比自己从头实现所需要的功能显得更为合适。然而，伴随着应用的复杂度不断上升，写出干净、低耦合、可维护的代码变得越来越重要。在这篇文章里，我将解释 RequireJS框架如何帮助应用开发者写出更加模块化的代码，以及它是如何通过延迟加载JavaScript文件来提高应用性能的。
开始的部分我们先不用RequireJS框架，然后在下一个章节用RequireJS来重构它。
下面的这个HTML页面包含了一个id为“message”的
元素。当用户访问这个页面的时候，它将展示订单Id和客户姓名信息。
Common.JS文件包含了两个模块的定义——Order和Customer。函数showData和页面的body结合在一起，它通过调用write函数来把要输出的信息放入页面中。作为示例，我在showData函数里硬编码了Id为1，客户姓名为Prasad。
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 <!DOCTYPE html> <html> <head> <title>JavaScript NonRequireJS</title> <script src="common.js" type="text/javascript"></script> </head> <body> <strong>Display data without RequireJS</strong> <p id="message" /> <script type="text/javascript"> showData(); </script> </body> </html> Common.JS function write(message) { document.getElementById('message').innerHTML += message + '</br>'; } function showData() { var o = new Order(1, "Prasad"); write("Order Id : " + o.id + " Customer Name : " + o.customer.name); } function Customer(name) { this.name = name; return this; } function Order(id, customerName) { this.id = id; this.customer = new Customer(customerName); return this;新闻热点
疑难解答
