Node 读取 + 写入 + 路径问题

学习目标

◆ 能够知道什么是 Node.js
◆ 能够知道 Node.js 可以做什么
◆ 能够说出 Node.js 中的 JavaScript 的组成部分
◆ 能够使用 fs 模块读写操作文件
◆ 能够使用 path 模块处理路径
◆ 能够使用 http 模块写一个基本的 web 服务器

一、Node

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,并不是一门后台语言

JavaScript 基础语法 --> Node.js 内置 API 模块fspathhttp 等) --> 第三方 API 模块(express、mysql 等)

下载: Node

查看已安装的 Node 的版本号:
使用快捷键 (Windows徽标键 + R) 打开运行面板,输入 cmd 后直接回车,即可打开终端,在终端输入命令 node –v 后按下回车键,即可查看已安装的 Node.js 的版本号

Node 环境执行 JavaScript 代码:
1.在项目根目录下打开终端
2.输入 node 要执行的 js 文件的路径

更快捷的打开终端
1.在文件夹地址栏区域,输入 cmd ,既可以打开终端
2.按照鼠标 shift ,同时点击鼠标右键,在此处打开 powershell

终端中的快捷键
Windowspowershellcmd 终端中,我们可以通过如下快捷键,来提高终端的操作效率:

  1. 使用 键,可以快速定位到上一次执行的命令
  2. 使用 tab 键,能够快速补全路径
  3. 使用 esc 键,能够快速清空当前已输入的命令
  4. 输入 cls 命令,可以清空终端

二、fs 文件系统


1. fs 文件系统模块

fs 模块是 Node.js 官方提供的、用来 操作文件 的模块,它提供了一系列的方法和属性,用来满足用户对文件的操作需求

  • fs.readFile() 方法,用来 读取 指定文件中的内容
  • fs.writeFile() 方法,用来向指定的文件中 写入 内容

如果要在 JavaScript 代码中,使用 fs 模块来操作文件,则需要使用如下的方式先导入它

const fs = require('fs')

2. 读取 fs.readFile()

fs.readFile(path, [options], callback)

参数解读:

  1. 参数1:必选参数,字符串,表示文件的路径
  2. 参数2:可选参数,表示以什么编码格式来读取文件
  3. 参数3:必选参数,文件读取完成后,通过回调函数拿到读取的结果
// 1. 导入 fs 模块
const fs = require('fs')

// 2. 调用 fs.readFile() 方法读取文件
//  参数 1: 读取文件的存放路径
//  参数 2: 读取文件时候的编码格式,一般默认是 utf8
//  参数 3: 回调函数,拿到读取失败和成功的结果, err 以及 data
fs.readFile('./Tom.txt', 'utf8', function (err, data) {
  // 3. err
  // 如果读取失败,则 err 的值为 null
  // 如果读取失败,则 err 的值为错误对象, data 的值为 undefined
  console.log(err)

  // 4. data 打印成功的结果
  console.log(data)
})

判断文件是否读取成功

可以判断 err 对象是否为 null,从而知晓文件读取的结果

  1. 结果是 null ,说明文件读取成功
  2. 如果不为 null,说明文件读取失败
const fs = require('fs')

fs.readFile('./Tom.txt', 'utf8', function (err, data) {
  // 判断 err 对象是否为 null
  if (err) {
    return console.log('文件读取失败:', err.message)
  }

  console.log('文件读取成功,内容是:', data)
})

3. 写入 fs.writeFile()

fs.writeFile(file, data, [options], callback)

参数解读:

  1. 参数1:必选参数,需要指定一个文件路径的字符串,表示文件的存放路径
  2. 参数2:必选参数,表示要写入的内容
  3. 参数3:可选参数,表示以什么格式写入文件内容,默认值是 utf8
  4. 参数4:必选参数,文件写入完成后的回调函数
// 1. 导入 fs 文件系统模块
const fs = require('fs')

// 2. 调用 fs.writeFile() 方法,写入文件的内容
//  参数 1:表示文件的存放路径
//  参数 2:表示要写入的内容
//  参数 3:回调函数
fs.writeFile('./Tom.txt', ' Jerry', function (err) {
  // 3. err
  // 3.1 如果文件写入成功,则 err 的值等于 null
  // 3.2 如果文件写入失败,则 err 的值等于一个错误对象 
  console.log(err)
})

判断文件是否写入成功

可以判断 err 对象是否为 null,从而知晓文件写入的结果

const fs = require('fs')

fs.writeFile('./Tom.txt', 'Tom And Jerry', function (err) {
  if (err) {
    return console.log('文件写入失败', err.message)
  }

  console.log('文件写入成功')
})

三、fs 路径问题

fs 模块路径动态拼接的问题

在使用 fs 模块操作文件时,如果提供的操作路径是以 ./../开头的相对路径时,很容易出现路径动态拼接错误的问题

原因: 代码在运行的时候,会以执行 node 命令时所处的目录,动态拼接出被操作文件的完整路径

解决方案: 在使用 fs 模块操作文件时,直接提供完整的路径,不要提供 ./../ 开头的相对路径,从而防止路径动态拼接的问题


使用完整路径替换相对路径

使用完整路径替换相对路径,但这种写法移植性比较差,不利于后期的维护


使用 __dirname 解决路径拼接问题

__dirname属性Node` 给提供的一个全局的属性,表示当前文件所处的目录

fs.readFile(__dirname + '/Tom.txt', 'utf8', function (err, data)

四、path 路径模块

1.path 模块是 Node.js 官方提供的、用来处理路径的模块,它提供了一系列的方法和属性,用来满足用户对路径的处理需求,例如:

  • path.join() 方法,用来将多个路径片段拼接成一个完整的路径字符串
  • path.basename() 方法,用来从路径字符串中,将文件名解析出来

2.如果要在 JavaScript 代码中,使用 path 模块来处理路径,则需要使用如下的方式先导入它

const path = rquire('path')

path 路径拼接

path.join([...paths])
fs.readFile(path.join(__dirname, '/Tom.txt'), 'utf8', function (err, data)

获取路径中的文件名

path.basename(path, [ext])

获取路径中的文件扩展名

path.extname(path)
  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
首先,我们需要在Vue项目中安装一个依赖库:`vue-electron`,这个库可以让Vue项目支持Electron,从而实现本地文件读取写入。 安装命令如下: ``` npm install --save vue-electron ``` 然后,在Vue项目的入口文件`main.js`中,引入`vue-electron`并使用它: ```js import Vue from 'vue' import App from './App.vue' import VueElectron from 'vue-electron' Vue.use(VueElectron) new Vue({ render: h => h(App) }).$mount('#app') ``` 接下来,我们可以在Vue组件中使用Node.js的`fs`模块来实现本地文件读取写入。 假设我们要读取本地的一个名为`test.txt`的文件,代码如下: ```js const fs = require('fs') // 读取文件 fs.readFile('test.txt', 'utf-8', (err, data) => { if (err) { console.log(err) return } console.log(data) }) ``` 如果要写入文件,可以使用`fs.writeFile()`方法: ```js const fs = require('fs') // 写入文件 fs.writeFile('test.txt', 'Hello, world!', (err) => { if (err) { console.log(err) return } console.log('写入成功!') }) ``` 最后,如果需要获取本地文件路径,可以使用`dialog.showOpenDialog()`方法来弹出一个对话框,让用户选择文件。代码如下: ```js const { dialog } = require('electron').remote // 弹出对话框 dialog.showOpenDialog({ properties: ['openFile'] }).then(result => { // 获取选择的文件路径 const filePath = result.filePaths[0] console.log(filePath) }).catch(err => { console.log(err) }) ``` 需要注意的是,上面的代码需要在Vue组件的`<script>`标签中使用,而不能在单独的`.js`文件中使用。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值