zoukankan      html  css  js  c++  java
  • AMD规范和CommonJS规范

    AMD规范这个词好久之前一直有看到,可是一直没有去了解是什么,今天突然想起CommonJS,于是一起做一下了解

    1、由来:

    node应用由模块组成,采用的就是commonjs模块规范。每个文件就是一个模块,有自己独立的作用于、变量、方法等。commonjs规范规定,每个模块内部,module变量代表当前模块。这个变量是一个对象,他的exports属性(module.exports)是对外的接口。加载某个模块,其实是加载该模块的module.exports属性。require方法用于加载模块。

    2、commonjs模块的特点:

    ①:所有代码都运行在模块作用域,不会污染全局作用域

    ②:模块可以多次加载,但是只会在第一次加载时运行一次,然后运行结果就缓存起来,以后再加载,直接读取缓存结果。想要让模块再次运行,必须清除缓存

          模块的缓存存在require.cache中,可以操作该属性进行删除

    delete require.cache[moduleName];

          也可以删除所有模块的缓存

    Object.keys(require.cache).forEach(key=>{
        delete require.cache[key];
    })

    ③:模块加载的顺序,按照其在代码中出现的顺序

    3、module对象:

    ①:module.exports属性标识当前模块对外输出的接口,其他文件加载该模块,实际上就是读取module.exports变量

    ②:node为每一个模块提供了一个exports变量,指向module.exports。这相当于每个模块中都有这样一句命令:

    var exports = module.exports;

          这样,在对外输出时,可以在这个变量上添加方法。例如:

    exports.add=function(r){
        return Math.PI*r*r;
    }

          注意:不能把exports直接指向一个值。

          一个模块的对外接口,就是一个单一的值,不能使用exports输出,必须使用module.exports输出。

    module.exports=function(x){
        console.log(x);
    }

    4、对比AMD规范和commonjs规范:

    相同点:都是为了模块化

    不同点:AMD规范是非同步加载模块,允许指定回调函数。

                commonjs规范加载模块是同步的。

    5、require命令:

    require命令用于加载模块文件,相当于读入并执行一个js文件,然后返回该模块的exports对象,没有发现指定模块,则会报错

    6、模块的加载机制:

    commonjs的加载机制,输入的是被输出值的拷贝。也就是说,一旦输出一个值,模块内部的变化就影响不到这个值了

    //  lib.js
    var counter = 3;
    function incCounter(){
        counter++;
    }
    module.exports={
        counter: counter,
        incCounter: incCounter,
    };
    
    //  main.js
    var counter = require('./lib').counter;
    var incCounter = require('./lib').incCounter;
    console.log(counter);  //3
    incCounter();
    console.log(counter);  //3
    //上面代码说明,counter输出以后,lib.js模块内部的变化就影响不到counter了

    具体内容可以参考:http://www.ruanyifeng.com/blog/2015/05/commonjs-in-browser.html

    或者:https://javascript.ruanyifeng.com/nodejs/module.html#toc2

    ps:年后除了工作之外,就在学习uni-app,没来得及总结,之后再找个时间总结一下自己学习uni-app的一些想法。

  • 相关阅读:
    C# 解析json
    Java环境配置
    Wpf学习(五) 数据绑定Binding【小达原创】
    WPF学习(四) 样式 【小达原创】
    jQuery-- 格式化时间
    leetcode -- Nim Game
    Git 学习笔记--拉取远程分支到本地
    Git 学习笔记--删除错误提交的commit
    iOS开发-- 开发中遇到的问题汇总
    Javascript--数组转换成字符串
  • 原文地址:https://www.cnblogs.com/chao202426/p/14550423.html
Copyright © 2011-2022 走看看