【Node.js】ECMAScript标准 以及 npm安装

目录

[一、 ECMAScript标准 - 默认导出和导入](#一、 ECMAScript标准 - 默认导出和导入)

[二、ECMAScript标准 - 命名导出和导入](#二、ECMAScript标准 - 命名导出和导入)

三、包的概念

[五、 npm - 安装所有依赖](#五、 npm - 安装所有依赖)

[六、 npm - 全局软件包](#六、 npm - 全局软件包)

Node.js总结

[总结不易~ 本章节对我有很大的收获, 希望对你也是!!!](#总结不易~ 本章节对我有很大的收获, 希望对你也是!!!)


本节素材已上传至Gitee:ajax_study: 这是ajax、Node.j学习的仓库 - Gitee.comhttps://gitee.com/liu-yihao-hhh/ajax_study/tree/master/nodejs2

一、 ECMAScript标准 - 默认导出和导入

默认标准使用:

  1. 导出: export default {}
  2. 导入:import 变量名 from '模块化或路径'

注意:Node.js 默认支持CommonJS标准语法

如需要使用ECMAScript 标准语法 , 在运行模块所在文件夹内创建package.json文件, 并设置{"type", "module"}

在utils.js中进行默认导出

javascript 复制代码
/**
 * 目标:基于 ECMAScript 标准语法,封装属性和方法并"默认"导出
 */
const baseURL = 'http://hmajax.itheima.net'
const getArraySum = arr => arr.reduce((sum, item) => sum += item, 0)

// 默认导出
export default {
  url: baseURL,
  arraySum: getArraySum
}

在index.js文件中进行默认导入

javascript 复制代码
/**
 * 目标:基于 ECMAScript 标准语法,"默认"导入,工具属性和方法使用
 */
// 默认导入
import obj from './utils.js'
console.log(obj)
const result = obj.arraySum([10, 20, 30])
console.log(result)

二、ECMAScript标准 - 命名导出和导入

需求: 封装并导出基地址和求数组和的函数

命名标准使用:

  1. 导出: export 修饰定义语句
  2. 导入: import { 同名变量 } from '模块名或路径'

utils.js 文件

javascript 复制代码
/**
 * 目标:基于 ECMAScript 标准语法,封装属性和方法并"命名"导出
 */
export const baseURL = 'http://hmajax.itheima.net'
export const getArraySum = arr => arr.reduce((sum, item) => sum += item, 0)

index.js文件

可以看出当前标准的导入和导出跟我们在vue里面的效果一模一样!还是很好理解的

javascript 复制代码
/**
 * 目标:基于 ECMAScript 标准语法,"命名"导入,工具属性和方法使用
 */
// 命名导入
import {baseURL, getArraySum} from './utils.js'
console.log(obj)
console.log(baseURL)
console.log(getArraySum)
const result = getArraySum([10, 21, 33])
console.log(result)

三、包的概念

包: 将模块、代码、其他资料聚合成一个文件夹

包分类:

  • 项目包: 主要编写项目和业务逻辑
  • 软件包: 封装工具和方法进行使用

在package.json文件中:对项目进行一个描述

javascript 复制代码
{
  "name": "cz_utils", // 软件包名称
  "version": "1.0.0", // 软件包当前版本
  "description": "一个数组和字符串常用工具方法的包", // 软件包简短秒速
  "main": "index.js", // 软件包入口点
  "author": "itheima", // 软件包作者
  "license": "MIT" // 软件包许可证
}

将utils文件包进行打包引入到server.js文件内进行使用

完成打包的效果

server.js文件

javascript 复制代码
/**
 * 目标:导入 utils 软件包,使用里面封装的工具函数
 */
const obj = require('./utils')
console.log(obj)
const result = obj.getArraySum([10, 20, 30])
console.log(result)

四、npm - 软件包管理器

定义: npm是Node.js标准的软件包管理器, 起初是作为下载和管理Node.js 包依赖的方式,现在也成为前端Javascript中的使用工具

使用:

  1. 初始化清单文件: npm init -y
  2. 下载软件包: npm i 软件包名称
  3. 使用软件包

需求: 使用dayjs 软件包 来格式化日期时间

  1. 初始化项目清单文件 生成package.json文件

下载软件包

server.js文件

javascript 复制代码
/**
 * 目标:使用 npm 下载 dayjs 软件包来格式化日期时间
 *  1. (可选)初始化项目清单文件,命令:npm init -y
 *  2. 下载软件包到当前项目,命令:npm i 软件包名称
 *  3. 使用软件包
 */
// 3. 使用软件包
const dayjs = require('dayjs')
const nowDateStr = dayjs().format('YYYY-MM-DD')
console.log(nowDateStr)

可以快速调用,进行日期时间转换

五、 npm - 安装所有依赖

当我们引入别人写的项目,不存在node_modules软件包的时候 是不能在运行的,所以我们为了能够顺利运行,package.json文件中有记录着所有的软件包,只需要node -i 就可以完成所有的安装依赖

六、 npm - 全局软件包

软件包区别:

  • 本地软件包:当前项目内使用,封装属性和方法,存在于 node_modules
  • 全局软件包:本机所有项目使用,封装命令和工具,存在于系统设置的位置

nodemon 作用:替代 node 命令,检测代码更改,自动重启程序

使用:

  1. 安装:npm i nodemon -g(-g 代表安装到全局环境中)
  2. 运行:nodemon 待执行的目标 js 文件:nodemon server.js

需求:启动准备好的项目,修改代码保存后,观察自动重启应用程序

Node.js总结

Node.js 模块化:

概念:每个文件当做一个模块,独立作用域,按需加载

使用:采用特定的标准语法导出和导入进行使用

CommonJS 标准一般应用在 Node.js 项目环境中

ECMAScript 标准一般应用在前端工程化项目中 。

Node.js 包:

概念:把模块文件,代码文件,其他资料聚合成一个文件夹

项目包:编写项目需求和业务逻辑的文件夹

软件包:封装工具和方法进行使用的文件夹(一般使用 npm 管理)

  • √ 本地软件包:作用在当前项目,一般封装的属性 / 方法,供项目调用编写业务需求
  • √ 全局软件包:作用在所有项目,一般封装的命令 / 工具,支撑项目运行

常用命令:

功能 命令
执行 js 文件 node xxx
初始化 package.json npm init -y
下载本地软件包 npm i 软件包名
下载全局软件包 npm i 软件包名 -g
删除软件包 npm uni 软件包名

总结不易~ 本章节对我有很大的收获, 希望对你也是!!!

相关推荐
luckys.one几秒前
第9篇:Freqtrade量化交易之config.json 基础入门与初始化
javascript·数据库·python·mysql·算法·json·区块链
魔云连洲2 分钟前
深入解析:Vue与React的异步批处理更新机制
前端·vue.js·react.js
TomCode先生31 分钟前
c#动态树形表达式详解
开发语言·c#
mCell32 分钟前
JavaScript 的多线程能力:Worker
前端·javascript·浏览器
高-老师1 小时前
基于R语言的物种气候生态位动态量化与分布特征模拟
开发语言·r语言·物种气候
大翻哥哥1 小时前
Python 2025:量化金融与智能交易的新纪元
开发语言·python·金融
weixin_437830942 小时前
使用冰狐智能辅助实现图形列表自动点击:OCR与HID技术详解
开发语言·javascript·ocr
超级无敌攻城狮2 小时前
3 分钟学会!波浪文字动画超详细教程,从 0 到 1 实现「思考中 / 加载中」高级效果
前端
鹿鹿学长3 小时前
2025年全国大学生数学建模竞赛(C题) 建模解析|婴儿染色体数学建模|小鹿学长带队指引全代码文章与思路
c语言·开发语言·数学建模
zhousenshan3 小时前
Python爬虫常用框架
开发语言·爬虫·python