自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(19)
  • 收藏
  • 关注

原创 vue面试题-手写diff算法

diff算法是指对新旧虚拟节点进行对比,并返回一个patch对象,用来存储两个节点不同的地方,最后利用patch记录的消息局部更新DOM。

2022-10-13 17:10:44 235

原创 Webpack笔记

Webpack:前端项目工程化的具体解决方案主要功能:它提供了良好的前端模块化开发支持、以及代码压缩混淆、处理浏览器JavaScript的兼容性、性能优化等强大的功能。

2022-10-09 17:18:25 255 1

原创 Vue源码分析-手写Vue(简易版)

Vue源码分析

2022-10-05 10:04:10 382

原创 Vue实现TodoList任务列表案例

一、初始化vite项目:二、梳理项目结构:1)重置index.css中的全局样式;2)重置App.vue组件的代码结构三、封装TodoList组件:1)创建并注册TodoList组件2)渲染列表组件(基于boorstrap)1.在 main.js 入口文件中,导入 bootstrap.css 样式表。2.在 App 组件中通过 list 属性,将数据传递到 TodoList 组件之中,为了接受外界传递过来的列表数据,需要在 TodoList 组件中声明props 属性。3

2022-05-28 11:03:43 2135

原创 Github - 远程仓库的使用

Github - 远程仓库的使用

2022-05-25 17:46:38 257

原创 编写用户登录的接口

目录一、检测表单数据是否合法二、根据用户名查询用户的数据三、判断用户输入的密码是否正确四、登录成功,生成 JWT 的 Token 字符串1.生成 JWT 的 Token 字符串2.配置解析Token的中间件3.在 `app.js` 中的 `错误级别中间件` 里面,捕获并处理 Token 认证失败后的错误一、检测表单数据是否合法把表单验证的中间件放在路由中router/user.js// 登录router.post('/login', expressJoi(

2022-05-15 20:42:00 1027 1

原创 编写注册用户的接口

路由处理函数模块步骤:1.检测表单数据是否合法2.检测用户名是否被占用3.对密码进行加密处理4.向数据库中插入新用户一、检测表单数据是否合法使用第三方数据验证模块安装 `@hapi/joi` 包,为表单中携带的每个数据项,定义验证规则;安装 `@escook/express-joi` 中间件,来实现自动对表单数据进行验证的功能。信息验证规则模块 /schema/user.jsconst joi = require('@hapi/joi')/** * strin

2022-05-12 10:31:50 1010 2

原创 npm与包

什么是包Node.js 中的第三方模块又叫做包。 就像电脑和计算机指的是相同的东西,第三方模块和包指的是同一个概念,只不过叫法不同。包是基于内置模块封装出来的,提供了更高级、更方便的 API,极大的提高了开发效率。 包和内置模块之间的关系,类似于 jQuery 和 浏览器内置 API 之间的关系。包的来源不同于 Node.js 中的内置模块与自定义模块,包是由第三方个人或团队开发出来的,免费供所有人使用。 在项目中安装包的命令上述的装包命令,可以简写成如下格式:.

2022-05-02 21:08:18 202

原创 格式化时间

1.传统方法格式化时间function dataFormat(day) { const date=new Date(day); const y=date.getFullYear(); const m=addZero(date.getMonth()+1); const d=addZero(date.getDate()); const hh=addZero(date.getHours()); const mm=addZero(date.getMinutes(

2022-04-30 08:05:24 83

原创 案例 - 实现 clock 时钟的 web 服务器

实现步骤 ① 导入需要的模块 ② 创建基本的 web 服务器 ③ 将资源的请求 url 地址映射为文件的存放路径 ④ 读取文件内容并响应给客户端const fs=require('fs');const path=require('path');const http=require('http');const server=http.createServer();server.on('request',(req,res)=>{ let fpath=``;

2022-04-29 13:15:00 316

原创 Node实现文件拆分

时钟

2022-04-29 08:25:20 834

原创 AJAX总结

概念AJAX ( Asynchronous JavaScript and XML)(异步的 JavaScript 和 XML)。通俗的理解:在网页中利用XMLHttpRequest对象和服务器进行数据交互的方式。AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。通过 AJAX,JavaScript 无需等待服务器的响应,而是:在等待服务器响应时执行其他脚本 当响应就绪后对响应进行处理发展历程:在 2005 年,Google 通过其 Googl

2022-04-24 19:51:59 188

原创 封装自己的Ajax函数

aja() 函数是我们自定义的 Ajax 函数,它接收一个配置对象作为参数,配置对象中可以配置如下属性:method 请求的类型 url 请求的 URL 地址 data 请求携带的数据 success 请求成功之后的回调函数封装分为三步:1.把外界传递过来的参数转化为查询字符串格式// 处理data函数// 功能:把数据对象转化为查询字符串格式发送到服务器function resolveData(data) { var arr = []; // for…...

2022-04-17 22:43:25 594

原创 toDoList记事清单案例:运用本地存储

功能描述:文本框里面输入内容,按下回车,就可以生成待办事项。 点击待办事项复选框,就可以把当前数据添加到已完成事项里面。 点击已完成事项复选框,就可以把当前数据添加到待办事项里面。 但是本页面内容刷新页面不会丢失。一.toDoList 按下回车把新数据添加到本地存储里面利用事件对象.keyCode判断用户按下回车键(13),当用户输入内容不为空时,进行操作。切记: 页面中的数据,都要从本地存储里面获取,这样刷新页面才不会丢失数据,所以先要把数据保存到本地存储里面。存储的数据格式:var

2022-04-15 16:34:47 942

原创 利用递归遍历数据

如果一个函数在内部可以调用其本身,那么这个函数就是递归函数。递归应用:求阶乘。求斐波那契数列,遍历数据。遍历数据利用forEach去遍历每一个对象,用递归函数遍历里层数据。封装的函数:function getId(mydata, id) { var o={}; //利用forEach去遍历里面的每一个对象,用递归函数遍历里层数据 mydata.forEach(function(obj) { if (obj.id == id) { // co

2022-04-10 09:29:57 404

原创 查询商品案例:利用数组新增方法

ES5新增数组方法迭代(遍历)方法:forEach(),map(),fifter(),some(),every()array.forEach(function(currentValue,index,arr) {})参数:currentValue:数组当前项的值index:数组当前的索引号arr:数组对象本身array.filter(function(currentValue,index,arr) {})主要用于筛选数组,注意它直接返回一个新数组。array.some(fu

2022-04-08 11:19:38 250

原创 外边距合并问题及解决方案

使用 margin 定义块元素的垂直外边距时,可能会出现外边距的合并。 主要有两种情况: 相邻块元素垂直外边距的合并 嵌套块元素垂直外边距的塌陷1. 相邻块元素垂直外边距的合并当上下相邻的两个块元素(兄弟关系)相遇时,如果上面的元素有下外边距 margin-bottom,下面的元素有 上外边距 margin-top ,则他们之间的垂直间距不是 margin-bottom 与 margin-top 之和。而是取两个值中的 较大者这种现象被称为相邻块元素垂直外边距的合并。 .

2022-02-22 11:04:09 1193

原创 外边距可以让块级盒子水平居中

外边距可以让块级盒子水平居中,但是必须满足两个条件: ① 盒子必须指定了宽度(width)。 ② 盒子左右的外边距都设置为 auto 。 常见的写法,以下三种都可以: margin-left: auto; margin-right: auto; margin: auto; margin: 0 auto; 注意:以上方法是让块级元素水平居中,行内元素或者行内块元素水平居中给其父元素添加 text-align:center 即可。...

2022-02-22 10:43:10 324

原创 CSS一个小技巧:单行文字垂直居中

让文字的行高等于盒子的高度就可以让文字在当前盒子内垂直居中。单行文字垂直居中的原理简单理解:行高的上空隙把文字挤到中间了 。如果行高小于盒子高度,文字会偏上。如果行高大于盒子高度,则文字会偏下。...

2022-02-22 10:39:19 333

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除