day04-node-Express的实例&增删改小项目

文件操作路径.png

image.png

image.png
express:

安装:

npm install --save express
  • 基本路由:
    路由器:
    请求方法
    请求路径
    请求处理函数
    。get:

    app.get('/', function (req, res) {
        res.send('hello world')
    })
    

    。post:

    app.post('/', function (req, res) {
       res.send('hello world')
     })
    
  • 静态服务:


    image.png
    // 必须是 /a/puiblic目录中的资源具体路径
     app.use('/abc/d/', express.static('./public/'))
    // 当以 /public/ 开头的时候,去 ./public/ 目录中找找对应的资源
    // 这种方式更容易辨识,推荐这种方式
    app.use('/public/', express.static('./public/'))
     // 当省略第一个参数的时候,则可以通过 省略 /public 的方式来访问
     // 这种方式的好处就是可以省略 /public/
     app.use(express.static('./public/'))
    

在Express中配置使用art-template模板引擎:

安装:

npm install --save art-template
npm install --save express-art-template

配置:

 app.engine('html', require('express-art-template'))

Express 为 Response 相应对象提供了一个方法:render render 方法默认是不可以使用,但是如果配置了模板引擎就可以使用了 res.render('html模板名', {模板数据}) 第一个参数不能写路径,默认会去项目中的 views 目录查找该模板文件 也就是说 Express 有一个约定:开发人员把所有的视图文件都放到 views 目录中

使用:

 app.get('/', function (req, res) {
   //express会默认去找view里的index
  res.render('index.html', {
   title: '你好'
  })
 })

如果想要修改默认的 views 目录,则可以 app.set('views', render函数的默认路径)

image.png


关于增删改的小项目:

模块的作用:
app:

  • app.js 入门模块
  • 职责:
  • 创建服务
  • 做一些服务相关配置
  • 模板引擎
    
  • body-parser 解析表单 post 请求体
    
  • 提供静态资源服务
    
  • 挂载路由
  • 监听端口启动服务


    image.png

image.png
  • router.js 路由模块

  • 职责:

  • 处理路由

  • 根据不同的请求方法+请求路径设置具体的请求处理函数

  • 模块职责要单一,不要乱写

  • 我们划分模块的目的就是为了增强项目代码的可维护性

  • 提升开发效率
    原生提取路由模块的方式:

    module.exports = function (app) {
     app.get('/students', function (req, res) {
     // readFile 的第二个参数是可选的,传入 utf8 就是告诉它把读取到的 
    文件直接按照 utf8 编码转成我们能认识的字符
     // 除了这样来转换之外,也可以通过 data.toString() 的方式
     fs.readFile('./db.json', 'utf8', function (err, data) {
      if (err) {
     return res.status(500).send('Server error.')
      }
    
        // 从文件中读取到的数据一定是字符串
       // 所以这里一定要手动转成对象
       var students = JSON.parse(data).students
    
        res.render('index.html', {
     fruits: [
       '苹果',
       '香蕉',
       '橘子'
     ],
     students: students
      })
    })
    })
    
     }
    

express的提起方式:

1. 创建一个路由容器:

var router = express.Router()

2. 把路由都挂载到 router 路由容器中:

image.png

3. 把 router 导出:

 module.exports = router

数据操作文件模块(students)

  • 职责:操作文件中的数据,只处理数据,不关心业务
  • 这里才是我们学习 Node 的精华部分:奥义之所在
  • 封装异步 API

设计操作数据的API文件模块:

(结构)

var dbPath = './db.json'

/**
 * 获取学生列表
 * @param  {Function} callback 回调函数
 */
exports.find = function (callback) {
  fs.readFile(dbPath, 'utf8', function (err, data) {
    if (err) {
      return callback(err)
    }
    callback(null, JSON.parse(data).students)
  })
}

/**
 * 根据 id 获取学生信息对象
 * @param  {Number}   id       学生 id
 * @param  {Function} callback 回调函数
 */
exports.findById = function (id, callback) {
  fs.readFile(dbPath, 'utf8', function (err, data) {
    if (err) {
      return callback(err)
    }
    var students = JSON.parse(data).students
    var ret = students.find(function (item) {
      return item.id === parseInt(id)
    })
    callback(null, ret)
  })
}

/**
 * 添加保存学生
 * @param  {Object}   student  学生对象
 * @param  {Function} callback 回调函数
 */
exports.save = function (student, callback) {
  fs.readFile(dbPath, 'utf8', function (err, data) {
    if (err) {
      return callback(err)
    }
    var students = JSON.parse(data).students

    // 添加 id ,唯一不重复
    student.id = students[students.length - 1].id + 1

    // 把用户传递的对象保存到数组中
    students.push(student)

    // 把对象数据转换为字符串
    var fileData = JSON.stringify({
      students: students
    })

    // 把字符串保存到文件中
    fs.writeFile(dbPath, fileData, function (err) {
      if (err) {
        // 错误就是把错误对象传递给它
        return callback(err)
      }
      // 成功就没错,所以错误对象是 null
      callback(null)
    })
  })
}

/**
 * 更新学生
 */
exports.updateById = function (student, callback) {
  fs.readFile(dbPath, 'utf8', function (err, data) {
    if (err) {
      return callback(err)
    }
    var students = JSON.parse(data).students

    // 注意:这里记得把 id 统一转换为数字类型
    student.id = parseInt(student.id)

    // 你要修改谁,就需要把谁找出来
    // EcmaScript 6 中的一个数组方法:find
    // 需要接收一个函数作为参数
    // 当某个遍历项符合 item.id === student.id 条件的时候,find 会终止遍历,同时返回遍历项
    var stu = students.find(function (item) {
      return item.id === student.id
    })

    // 这种方式你就写死了,有 100 个难道就写 100 次吗?
    // stu.name = student.name
    // stu.age = student.age

    // 遍历拷贝对象
    for (var key in student) {
      stu[key] = student[key]
    }

    // 把对象数据转换为字符串
    var fileData = JSON.stringify({
      students: students
    })

    // 把字符串保存到文件中
    fs.writeFile(dbPath, fileData, function (err) {
      if (err) {
        // 错误就是把错误对象传递给它
        return callback(err)
      }
      // 成功就没错,所以错误对象是 null
      callback(null)
    })
  })
}

/**
 * 删除学生
 */
exports.deleteById = function (id, callback) {
  fs.readFile(dbPath, 'utf8', function (err, data) {
    if (err) {
      return callback(err)
    }
    var students = JSON.parse(data).students

    // findIndex 方法专门用来根据条件查找元素的下标
    var deleteId = students.findIndex(function (item) {
      return item.id === parseInt(id)
    })

    // 根据下标从数组中删除对应的学生对象
    students.splice(deleteId, 1)

    // 把对象数据转换为字符串
    var fileData = JSON.stringify({
      students: students
    })

    // 把字符串保存到文件中
    fs.writeFile(dbPath, fileData, function (err) {
      if (err) {
        // 错误就是把错误对象传递给它
        return callback(err)
      }
      // 成功就没错,所以错误对象是 null
      callback(null)
    })
  })
}

穿插一个回调函数的知识点:


回调函数.png

你可能感兴趣的:(day04-node-Express的实例&增删改小项目)