首页 > 其他分享 >commonjs规范 require 函数解析

commonjs规范 require 函数解析

时间:2022-11-19 14:45:14浏览次数:42  
标签:commonjs Users require whh exports module test 解析

function require(modulePath) {
    //1.根据传入的模块路径 得到模块完整的绝对路径
    const moduleId = getModuleId(modulePath)
    //2.判断缓存
    if (cache[moduleId]) {
        return cache[moduleId]
    }
    //3.真正运行代码模块的辅助函数
    function _require(exports, require, module, __filename, __dirname) {
        //目标模块的代码在这里执行
    }
    //4.准备并运行辅助函数
    const module = {
        exports:{}
    }
    const exports = module.exports
    //得到模块文件的绝对路径
    const __filename = moduleId
    const __dirname = getDirname(__filename)
    _require.call(exports, exports, require, module, __filename, __dirname)
    //5.缓存module.exports
    cache[moduleId] = module.exports
    //6.返回module.exports
    return module.exports
}

getModuleId、getDirname实现细节不必过多关注

模块内代码会放在_require函数内执行,所以可以在代码内直接打印arguments

console.log(argument)

直接执行node test.js 会有以下输出

arguments [Arguments] {
  '0': {},
  '1': [Function: require] {
    resolve: [Function: resolve] { paths: [Function: paths] },
    main: Module {
      id: '.',
      path: '/Users/whh/Documents/webpack5',
      exports: {},
      filename: '/Users/whh/Documents/webpack5/test.js',
      loaded: false,
      children: [],
      paths: [Array]
    },
    extensions: [Object: null prototype] {
      '.js': [Function (anonymous)],
      '.json': [Function (anonymous)],
      '.node': [Function (anonymous)]
    },
    cache: [Object: null prototype] {
      '/Users/whh/Documents/webpack5/test.js': [Module]
    }
  },
  '2': Module {
    id: '.',
    path: '/Users/whh/Documents/webpack5',
    exports: {},
    filename: '/Users/whh/Documents/webpack5/test.js',
    loaded: false,
    children: [],
    paths: [
      '/Users/whh/Documents/webpack5/node_modules',
      '/Users/whh/Documents/node_modules',
      '/Users/whh/node_modules',
      '/Users/node_modules',
      '/node_modules'
    ]
  },
  '3': '/Users/whh/Documents/webpack5/test.js',
  '4': '/Users/whh/Documents/webpack5'
}

_require函数接受exports, require, module, __filename, __dirname参数

所以在commonJS规范下 模块内可直接使用require, module.exports,exports,filename,dirname

_require辅助函数通过.call执行绑定this指向exports

所以在模块加载执行前 this,exports,module.exports是相等的

console.log(this === exports,this === module.exports)

直接执行node test.js上面的代码会打印 true true

最终返回的是module.exports

所以有一下代码test.js

this.a = 1
exports.b = 2
export = {
	c:3
}
module.exports = {
	d:4
}
exports.e = 5
this.f = 6


/**
解析 初始 this = exports = module.exports
执行后:

this,
{a:1,b:2,f:6}

export,
{c:3,e:5}

module.exports,
{d:4}
*/

最终在别的模块内引入

const test = require(./test.js)
console.log(test)

输出

{d:4}

标签:commonjs,Users,require,whh,exports,module,test,解析
From: https://www.cnblogs.com/whh666/p/16906076.html

相关文章

  • 全面解析Android之ANR日志
    不论从事安卓应用开发,还是安卓系统研发,应该都遇到应用无响应(简称ANR)问题,当应用程序一段时间无法及时响应,则会弹出ANR对话框,让用户选择继续等待,还是强制关闭。本文将带你......
  • MySQL 源码解读之-语法解析(四)
    MySQL源码解读之-语法解析(四)在上篇文章中,我们分析了一条sql语句select*frombank;警告bison语法解析器(MYSQLparser函数)生成的AST树的结构,如下图所示:mysql需......
  • python(牛客)试题解析1 - 简单
    导航:一、NC103反转字符串二、NC141判断是否为回文字符串三、NC151最大公约数四、NC65斐波那契数列五、字符按排序后查看第k个最小的字母六、数组内取出下标相同......
  • Java使用SAX解析xml文档
    步骤1.创建解析工厂2.从工厂中获取解析器3.自行编写处理器:继承DefaultHandler,重写相关方法。4.加载自己的处理器5.开始解析6.读取数据例子读取此xml文件内容。创......
  • 箭头函数与普通函数的区别、浏览器解析html的过程
    箭头函数与普通函数1.书写方式不同,箭头函数使用箭头定义,普通函数使用关键字 2.this指向不同:箭头:2.11箭头函数本身没有prototype,所以没有自己的this,2.21它的this只能......
  • vba解析JSON字符串
    vba解析JSON字符串vba解析JSON大概有4种方法1、htmlfile对象解析json(支持32位和64位系统)思路:创建htmlfile对象,使用write方法写入浏览器版本,创建parentwindow对象,在使用e......
  • kubernetes_CoreDNS全解析
    一、前言kubernetesCoreDNS是kube-system命令空间里面的一个Pod,用于域名解析。kubernetes自带三个命名空间(用kubeadm安装的Kubernetes集群):defaultkube-public......
  • 计算机网络原理(TCP/IP协议四):地址解析协议
    ARPARP缓存ARP帧格式ARP缓存超时代理ARP免费ARP和地址冲突检测与ARP相关的攻击关于地址解析协议在之前计算机网络原理(六):链路层与局域网的4.1中就有原理的介绍,......
  • mybatis源码解析1
    一、mybatis的简单使用根据mybatis官网提供的例子,需要这么几个步骤1、获取mybatis配置文件的输入流对象2、创建SqlSessionFactoryBuilder对象3、调用SqlSessionFactor......
  • simpread-(132 条消息) three.js 加载 stl 文件并解析_攻城狮 plus 的博客 - CSDN 博
    threejs加载STL文件效果:加载stl格式的文件需要设置材质material;stl、obj都是静态模型,不可以包含动画,fbx除了包含几何、材质信息,可以存储骨骼动画等数据。代码:......