zoukankan      html  css  js  c++  java
  • 前端JS框架系列之requireJS基础学习

    1 背景

      伴随着项目功能的不断扩充,客户体验的不断完善,实现交互逻辑的JS代码变得越来越多。起初,为了管理JS代码,我们把JS从页面中解放出来独立成文件,接着又把相似的交互代码提取到公共的JS页面中。然而这还不够,一个团队在编写JS交互逻辑时,往往会出现"命名冲突"的问题。于是乎,我们想到了闭包,并将每个JS文件都用闭包封装起来,形成一个个独立的作用域,如果有必要,还会返回一个对象接口供外界调用。走到这一步,JS中的命名问题、全局变量问题都可以完美解决,但还存在一个相互依赖的大问题。特别是引入大量JS文件时,经常会因为文件之间的依赖关系而抛错。引入JS框架RequireJS,可以让JS更规范,并解决上述遇到的一系列问题。

    2 认识RequireJS

      RequireJS是一个JavaScript模块加载器,使用RequireJS加载模块化脚本将提高代码的加载速度和质量,RequireJS兼容IE 6+、Firefox 2+、Safari 3.2+、Chrome 3+、Opera 10+。

      RequireJS的目标是鼓励代码的模块化,它使用了不同于传统<script>的脚本加载步骤。可以用它来1.加速和优化代码,但它的主要目的还是为了2.代码的模块化。它鼓励在使用脚本时用module ID代替URL地址。

      RequireJS以一个相对于baseUrl的地址来加载所有代码。页面顶层<script>标签含有一个特殊的属性data-main,RequireJS使用它来启动脚本加载过程。

      baseUrl设置方式:一般1.是与data-main属性相一致的目录,也可2.通过RequireJS config来手动配置,如果没有显示指定data-main或者config,则3.默认baseUrl为包含RequireJS的html文件所在目录

      例如:<script data-main="js/main.js" src="lib/require.js"></script>,通过data-main设置了入口,并会加载js目录下module ID为require的脚本,baseUrl则为js目录。

      RequireJS默认假定所依赖的资源都是js脚本,所以无需在module ID上加.js后缀。可以通过paths config设置一组脚本,可以有助于我们在使用脚本时码更少的字。

      如果想避开"baseUrl+paths"的解析过程,而是直接加载某一目录下的脚本,则module ID需满足以下规则之一:(1)带.js后缀 (2)以/开头 (3)包含URL协议如:'http:'或'https:'

      一般来说,最好还是使用baseUrl和"paths" config去设置module ID,它会带来额外带来灵活性:脚本的重命名和重定位。同时,为了避免凌乱的配置,最好不要使用多级嵌套的目录层次结构来组织代码,而是要将所有的脚本都放到baseUrl中,要么分为项目库/第三方库的扁平结构

  • 相关阅读:
    C语言I博客作业07
    C语言I博客作业06
    C语言I博客作业05
    C语言|博客作业04
    C语言|博客作业02
    第二周作业
    第一周作业
    学期总结
    作业01
    C语言I博客作业09
  • 原文地址:https://www.cnblogs.com/wulei-blog/p/5560846.html
Copyright © 2011-2022 走看看