百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术分类 > 正文

Node实战006:自定义模块的创建和使用详解

ztj100 2025-03-24 01:40 7 浏览 0 评论

Node的应用是由模块组成的,每个文件的定义都是一个模块(module变量代表当前模块)并有自己的作用域。Node遵循commonjs的模块规范,用来隔离每个模块的作用域,使每一个模块在自身的命名空间中执行。所以每个模块里面定义的变量、函数、类都是私有的,对于其他模块是不可见。想要使用模块中的功能就必须通过module.exports导出对外的变量或函数,这样其他模块在通过require()引入该模块时才能读取到其相应的变量或函数。

Node模块

在Node中模块分为两种,一种是Node提供的核心模块,另一种则是用户模块(由用户开发的模块)。 核心模块编译在Node源代码中,当Node进程启动时核心模块就被直接加载进内存中。当引入核心模块时就不需要再进行定位、编译,所以它的加载速度是最快的(优先级最高)。用户模块则是在运行时动态加载,需要临时解析路径、文件定位在编译执行,所以速度相比核心模块稍微慢一些。由于模块化开发非常的方便、部件可以提高代码的复用性、也大大提升开发效率,所以很多人都喜欢将常用的功能封装成模块(NPM 中已经超过百万个可以使用模块包)。

CommonJS介绍

CommonJS实现了Javascript的模块化规范,规范了模块的特性和各模块之间的相互依赖性,使得代码可以更好的编写和维护,同时提高了代码的复用性。定义每个文件都是一个模块(module变量代表当前模块)并有自己的作用域,而每个文件里面定义的变量、函数、类都是私有的,对于其他模块是不可见。CommonJS通过 exports 或 module.exports 来导出需要暴露的接口,模块通过 require 方法来同步加载所要依赖的模块。 CommonJS 是模块化的标准,主要应用于nodejs、vue、react等框架语言。

require引入

require是用于加载模块文件函数,require函数可以读取并执行一个JavaScript文件,然后返回该模块的exports对象。module.exports变量(用于导出模块),require函数(用于导入模块)是CommonJS定义了两个主要概念,module.exports属性表示当前模块对外输出的接口,当其他文件通过require函数加载该模块时实际上就是读取module.exports中的变量。require是模块的引入规则,通过exports或者module.exports抛出一个模块,通过require方法传入模块标识符后node会根据规则引入该模块,这样我们就可以使用模块中定义的方法和属性。

module对象

commonjs规范每一个文件就是一个模块,而每一个模块中都有一个module对象(这个对象就指向当前模块)。module对象有一个exports属性,该属性可以用来对外暴露模块中的变量或者、方法等。当通过require引入该模块的时候,其实就是读取module对象中的exports属性。我们通过require加载某个模块时,其实加载的就是该模块的module.exports属性。

exports对象

moduleexports 都是node中提供的两个对象,既然module对象中已经存在exports属性为啥还有一个exports对象呢?当每个模块被执行时会自动创建一个module对象,同时module对象会创建一个叫exports的属性并初始化的值是 {}。exports是module.exports的一个引用,同样指向了这个空对象的内存地址(即exports = module.exports = {})。引用类型无法直接操作保存在内存中的对象,只能通过保存在变量中的地址引用对其进行操作。当给module.exports赋值时会指向一块新的内存,而exports对象是通过形参的方式直接赋值给形参的引用并不能改变作用域外的值。也就是说exports指向的还是原来的内存地址,当两者指向不同内存之后exports就会失效。直接给exports赋值则会改变当前模块内部的形参exports的对象应用,但不会影响module.exports导出。exports可以辅助module.exports操作内存中的数据,当然require() 最后返回的还是module.exports属性而不是exports对象。

exports导出模块

Node定义模板很简单,变量及功能的定义和平时使用都一样,只要在定义之后通过 exports 或 module.exports 将你希望被用户使用的内容暴露出来即可。如果你希望通过exports导出,可以在你希望暴露的变量和方法前添加exports来声明(也可以在定义变量或方法之后再通过exports来指定导出的变量和方法)。通过exports导出返回的直接是模块中的变量、方法,调用时直接通过require引入就可以直接调用其变量、方法。在文章【Vue实战060:require与import的区别和使用】中也有提到如何定义模块,用exports进行导出时系统会系统会收集exports属性并附加到module.exports上。

module.exports导出模块

模块总是返回module.exports,而不是exports。 当模块中没有指定module.exports的时候,使用exports会将属性附加到module.exports。如果模块中指定了module.exports属性,再使用exports导出就会失效。如果你希望通过module.exports导出,该方法可以返回模块对象本身(相当于是一个类)。该对象可以包含模块中共享的变量、方法,也可以通过给module.exports属性赋值的方式来指定暴露的内容。如果你希望模块是对象类型就使用module.exports导出,如果希望模块是实例就直接用exports导出。

Node如何加载模块

Node遵循CommonJS规范采用require来引入模块文件(支持js、json、node拓展名,不写后缀会依次尝试),如果参数字符串以“/”开头则表示加载的是绝对路径的模块文件,如果参数字符串以“./”开头则表示加载的是相对路径的模块文件,如果不写路径则认为是build-in模块或者各级node_modules内的第三方模块,模块同步加载并按照JavaScript运行时查找的顺序进行处理。

总结:

Node在定义模块的时候会在模板最外层套一个函数function (exports,require,module,_filename,_dimame){},当引用该模块时就会自动执行该函数。这样就该模块中变量名和函数名就作为局域内容了,不会因与其他模块中的变量名和函数名相同而出现冲突问题。以上内容是小编给大家分享的【Node实战006:自定义模块的创建和使用详解】。希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。

相关推荐

使用 Pinia ORM 管理 Vue 中的状态

转载说明:原创不易,未经授权,谢绝任何形式的转载状态管理是构建任何Web应用程序的重要组成部分。虽然Vue提供了管理简单状态的技术,但随着应用程序复杂性的增加,处理状态可能变得更具挑战性。这就是为什么...

Vue3开发企业级音乐Web App 明星讲师带你学习大厂高质量代码

Vue3开发企业级音乐WebApp明星讲师带你学习大厂高质量代码下栽课》jzit.top/392/...

一篇文章说清 webpack、vite、vue-cli、create-vue 的区别

webpack、vite、vue-cli、create-vue这些都是什么?看着有点晕,不要怕,我们一起来分辨一下。...

超赞 vue2/3 可视化打印设计VuePluginPrint

今天来给大家推荐一款非常不错的Vue可拖拽打印设计器Hiprint。引入使用//main.js中引入安装import{hiPrintPlugin}from'vue-plugin-...

搭建Trae+Vue3的AI开发环境(vue3 ts开发)

从2024年2025年,不断的有各种AI工具会在自媒体中火起来,号称各种效率王炸,而在AI是否会替代打工人的话题中,程序员又首当其冲。...

如何在现有的Vue项目中嵌入 Blazor项目?

...

Vue中mixin怎么理解?(vue的mixins有什么用)

作者:qdmryt转发链接:https://mp.weixin.qq.com/s/JHF3oIGSTnRegpvE6GSZhg前言...

Vue脚手架安装,初始化项目,打包并用Tomcat和Nginx部署

1.创建Vue脚手架#1.在本地文件目录创建my-first-vue文件夹,安装vue-cli脚手架:npminstall-gvue-cli安装过程如下图所示:创建my-first-vue...

新手如何搭建个人网站(小白如何搭建个人网站)

ElementUl是饿了么前端团队推出的桌面端UI框架,具有是简洁、直观、强悍和低学习成本等优势,非常适合初学者使用。因此,本次项目使用ElementUI框架来完成个人博客的主体开发,欢迎大家讨论...

零基础入门vue开发(vue快速入门与实战开发)

上面一节我们已经成功的安装了nodejs,并且配置了npm的全局环境变量,那么这一节我们就来正式的安装vue-cli,然后在webstorm开发者工具里运行我们的vue项目。这一节有两种创建vue项目...

.net core集成vue(.net core集成vue3)

react、angular、vue你更熟悉哪个?下边这个是vue的。要求需要你的计算机安装有o.netcore2.0以上版本onode、webpack、vue-cli、vue(npm...

使用 Vue 脚手架,为什么要学 webpack?(一)

先问大家一个很简单的问题:vueinitwebpackprjectName与vuecreateprojectName有什么区别呢?它们是Vue-cli2和Vue-cli3创建...

vue 构建和部署(vue项目部署服务器)

普通的搭建方式(安装指令)安装Node.js检查node是否已安装,终端输入node-v会使用命令行(安装)npminstallvue-cli-首先安装vue-clivueinitwe...

Vue.js 环境配置(vue的环境搭建)

说明:node.js和vue.js的关系:Node.js是一个基于ChromeV8引擎的JavaScript运行时环境;类比:Java的jvm(虚拟机)...

vue项目完整搭建步骤(vuecli项目搭建)

简介为了让一些不太清楚搭建前端项目的小白,更快上手。今天我将一步一步带领你们进行前端项目的搭建。前端开发中需要用到框架,那vue作为三大框架主流之一,在工作中很常用。所以就以vue为例。...

取消回复欢迎 发表评论: