关于javascript:Nodejs-fspath模块

首先我有话说，是谁说的学完ajax就能够去vue了，太天真了我，学会js钻出来个ajax，学完ajax钻出来个node.js这一步步的，当然node不会学到太深刻把外表的认识一下就能够了，这之后可能更新速度要慢一点了，因为这几天会把工夫花在论文上，马上要进入问难了，尽管我当初那是有十分的浓重的趣味想见识一下node的姿势啊。进入正题吧

明天首先介绍一下什么是node.js？

node.js是一个基于Chrome V8引擎的js运行环境，留神是一个运行环境，浏览器是js前端的运行环境，而咱们node就是js后端的运行环境，并且在node.js中无奈调用DOM、BOM以及ajax的一些api。

怎么来学习node.js呢？

就跟咱们js学习一样，先根底语法再webapi。node是先js根底语法，而后再node.js内置api（fs、path、http等）再去第三方的api（express、mysql等）

怎么用node来执行js？

通过终端来实现，win+r关上cmd而后cd进入js文件所在的目录在执行node js文件名.js

更简便办法，间接进入这个目录而后按住shift+右键鼠标找到关上shellpower间接可运行node。当然我切实vscode上能够间接运行终端还多不便的

进入咱们明天第一个学习指标，fs文件系统模块，这是一个操作文件的模块。想要应用它必须先得导入，当然在这些node内置的api都是装置node的时候就有的你只须要导入即可

在这个模块外面有两个办法第一个是读取指定文件内容

fs.readFile（path【，options】，callback）

path：文件的门路 

options： 以什么样的编码来读取文件

callback：读取后的回调函数

const fs = require('fs')
fs.readFile('./file/read.txt', 'utf-8', function(err, dataStr) {
    console.log(err);
    console.log(dataStr);
})


 

 

const fs = require('fs')
fs.readFile('./file/errread.txt', 'utf8', (err, dataStr) => {
    if (!err) {
        return console.log('读取胜利' + dataStr);
    } 
    return console.log('读取失败' + err.message);
})

其中在这外面err=null示意读取胜利且此时dataStr就为外面的内容，否则就读取失败

既然有读取那就有写入，写入文件内容


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

path：写入文件的地址 留神 ：这个地址能够拿来创立文件但不能创立目录

data：写入的数据

const fs = require('fs')
fs.writeFile('./file/write.txt', 'hello fswrite', err => console.log(err))


const fs = require('fs')
fs.writeFile('./fileerr/write1.txt', '写入胜利',err => {
    if(!err) {
     return   console.log('写入胜利' + err);
    }
    return console.log('写入失败' + err.message);
})

在这外面其实是有问题的，因为node是采取的动静拼接地址，也就是如果你的地址是以./或者../结尾的绝对地址的话，那么到时候执行它是以你执行node的地址拼接上你写入的这个地址，你想想是不是会有bug产生，而且这个时候你就算补全执行也是没得用的。

面对这种状况有两张解决办法，一种是对你要操作的地址采纳绝对路径的形式

一种是通过__dirname这个属性能够取得以后文件所在的目录而后再通过我上面讲的内容组合起来就能够完满解决

只不过在这之前先看到一个案例，将一个txt文件横向排列以等号模式建设的一个问题文本转换成纵向排列以键值对建设的文本怎么来操作

小红=99 小白=100 小黄=70 小黑=66 小绿=88

// 将问题案例转到file外面的ok.txt 同时将外面的横向排列转为纵向排列
// 1.读取文件

const fs = require('fs')
fs.readFile('./问题.txt', 'utf-8', (err, dataStr) => {
    if(!err) {
        // console.log(dataStr);
        // 2.解决数据将其转换为数组换成引号再增加换行转义字符
        const arrOld = dataStr.split(' ')
        const arrNew = []
        arrOld.forEach(item => {
            arrNew.push(item.replace('=', ':'))
        })
        // console.log(arrNew);
        const str = arrNew.join('\n')
        console.log(str);
        // 3.写入文件
        return fs.writeFile('./file/ok.txt', str, err => {
            if (err) {
                return console.log('退出文件失败');
            } 
            return console.log('退出文件胜利');
        })
    }
    return console.log('查找文件失败');
})

第二个模块path模块

这个模块是拿来解决门路的模块，同样的也要先导入

第一个办法门路拼接

path.join（path）

能够将多个目录拼接起来

const path = require('path')
const pathStr = path.join('/a', '/b/c', '../', '/d', 'e')
console.log(pathStr);
const fs = require('fs')
fs.readFile(path.join(__dirname, 'file/ok.txt'), 'utf-8', (err, dataStr) => {
    if (err) {
        return console.log('读取失败');
    }
    return console.log('读取胜利\n' + dataStr);
})
path外面还有一个办法是获取门路中的文件名

path.basename（path[,ext]）

ext: 扩展名 如果写了扩展名那么找到这个文件名后输入格局将没有扩展名

const path = require('path')
let fileName = path.basename(path.join(__dirname, '/file/ok.txt'))
console.log(fileName);
let fileName1 = path.basename(path.join(__dirname, '/file/ok.txt'), '.txt')
console.log(fileName1);


 

 与这个性能大略相似的还有一个能够获取文件的扩展名

path.extname(path)

接下来看到一个案例，给定一个index.html，外面能够实现数字时钟的成果，其css html js代码都在外面，要做的是把css、js抽离进去通过外联的形式引入进来

// 1.导入所须要的包

const fs = require('fs')
const path = require('path')
// 1.1创立两个正则把style和script标签找进去
const regStyle = /<style>[\d\D]*<\/style>/
const regScript = /<script>[\s\S]*<\/script>/
// 2.fs读取这个文件
fs.readFile(path.join(__dirname, './index.html'), 'utf-8', (err, dataStr) => {
    if(err) {
        return console.log('读取文件失败');
    }
    // 2.1读取胜利用正则把匹配到的字符串放到对应的文件外面
    let styleStr = regStyle.exec(dataStr)
    // console.log(styleStr[0]);
    styleStr[0] = styleStr[0].replace('<style>','').replace('</style>','')
    fs.writeFile(path.join(__dirname,'/clock/index.css'),styleStr[0], err => {
        if (err) {
            return console.log('写入文件失败' + err.message);
        }
        return console.log('写入文件胜利'); 
                                                                                                                                                                         
    })                                                                                                                                                                                                                                                                                                                                                                                         
    // 2.2script标签放入文件
    let scriptStr = regScript.exec(dataStr)
    // console.log(scriptStr[0]);
    scriptStr[0] = scriptStr[0].replace('<script>', '').replace('</script>', '')
    fs.writeFile(path.join(__dirname , '/clock/index.js'), scriptStr[0], err => {
        if (err) {
            return console.log('写入失败' + err.message);
        }
        return console.log('写入胜利');
    })
    // 2.3批改html代码局部
    let newHtml = dataStr.replace(regStyle, '<link rel="stylesheet" href="./clock/index.css">').replace(regScript, '<script src="./clock/index.js"></script>')
    fs.writeFile(path.join(__dirname, './index.html'), newHtml, err => {
        if (err) {
            return console.log('写入html失败');
        }
        return console.log('写入html胜利');
    })
})

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>index首页</title>
  <style>
    html,
    body {
      margin: 0;
      padding: 0;
      height: 100%;
      background-image: linear-gradient(to bottom right, red, gold);
    }

    .box {
      width: 400px;
      height: 250px;
      background-color: rgba(255, 255, 255, 0.6);
      border-radius: 6px;
      position: absolute;
      left: 50%;
      top: 40%;
      transform: translate(-50%, -50%);
      box-shadow: 1px 1px 10px #fff;
      text-shadow: 0px 1px 30px white;

      display: flex;
      justify-content: space-around;
      align-items: center;
      font-size: 70px;
      user-select: none;
      padding: 0 20px;

      /* 盒子投影 */
      -webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0%, transparent), to(rgba(250, 250, 250, .2)));
    }
  </style>
</head>

<body>
  <div class="box">
    <div id="HH">00</div>
    <div>:</div>
    <div id="mm">00</div>
    <div>:</div>
    <div id="ss">00</div>
  </div>

  <script>
    window.onload = function () {
      // 定时器，每隔 1 秒执行 1 次
      setInterval(() => {
        var dt = new Date()
        var HH = dt.getHours()
        var mm = dt.getMinutes()
        var ss = dt.getSeconds()

        // 为页面上的元素赋值
        document.querySelector('#HH').innerHTML = padZero(HH)
        document.querySelector('#mm').innerHTML = padZero(mm)
        document.querySelector('#ss').innerHTML = padZero(ss)
      }, 1000)
    }

    // 补零函数
    function padZero(n) {
      return n > 9 ? n : '0' + n
    }
  </script>
</body>

</html>

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>index首页</title>
  <link rel="stylesheet" href="./clock/index.css">
</head>

<body>
  <div class="box">
    <div id="HH">00</div>
    <div>:</div>
    <div id="mm">00</div>
    <div>:</div>
    <div id="ss">00</div>
  </div>

  <script src="./clock/index.js"></script>
</body>

</html>

关于javascript:Nodejs-fspath模块

评论

发表回复取消回复

更多文章

苹果iOS打包的ipa应用无法安装？一篇文章带你了解可能的原因及排查方法

图解Golang：从零开始实现简易版过期LRU缓存

深入解析：基于Delta的线性数据结构模型，打造高效富文本编辑器

轻松管理社交媒体：使用Automa插件实现一键拉黑功能

关于javascript:Nodejs-fspath模块

评论

发表回复 取消回复

更多文章

苹果iOS打包的ipa应用无法安装？一篇文章带你了解可能的原因及排查方法

图解Golang：从零开始实现简易版过期LRU缓存

深入解析：基于Delta的线性数据结构模型，打造高效富文本编辑器

轻松管理社交媒体：使用Automa插件实现一键拉黑功能

发表回复取消回复