自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

莫莫博客

初级程序猿

  • 博客(64)
  • 收藏
  • 关注

原创 Node学习-第六章-express中间件与RESful API接口规范(下)

MD5是一种不可逆的加密算法,‌意味着一旦数据被MD5加密,‌就无法直接解密还原成原始数据。‌在Express框架中,‌如果用户密码是通过MD5加密后存储在数据库中的,‌那么在后续的调取过程中,‌不需要进行解密操作。‌这是因为MD5加密的特性决定了它只能用于单向验证,‌即通过输入明文密码与数据库中存储的加密密码进行比对,‌来验证用户输入的密码是否正确。你可以把它放在 Cookie 里面自动发送,但是这样不能跨域,所以更好的做法是放在 HTTP 请求的头信息Authorization字段里面。

2024-07-16 11:03:13 631

原创 Node学习-第六章-express中间件与RESful API接口规范(上)

Morgan是Express框架的一部分,但它也可以独立于任何特定框架使用,为一个HTTP请求日志中间件,它提供了灵活的日志格式,使得你可以轻松定制你的日志输出。只需几行代码,你就可以开启全面的日志监控,无论是简单的信息还是详细的错误报告。主要是是项目模块化。通过本章的学习可以实现项目代码目录清晰,已经构建相对健全的框架结构。405 Method Not Allowed:用户已经通过身份验证,但是所用的 HTTP 方法不在他的权限之内。200状态码表示操作成功,但是不同的方法可以返回更精确的状态码。

2024-07-15 17:00:23 1348

原创 Node学习-第五章-数据可持续化

mongodb 呢,它是一个基于文档存储的分布式非关系性数据库系统。“基于文档”指的是:所有存放的的数据都是以文件存到我们的磁盘里面的。其中数据库系统底层是通过C语言开发,对文件的存储性能还是十分不错的。关系性数据库与非关系型的区别。

2024-07-04 15:11:07 635 1

原创 MongoDB 常用指令

【代码】MongoDB 常用指令。

2024-07-01 16:37:03 100

原创 Node学习-第四章-Express框架的入门

Express框架是一个高度包容的,快速而又极简的node.js外部框架。并且在实际的项目中使用的很多nodejs框架都是更据express二次封装的。

2024-06-27 17:36:08 375

原创 Node学习-第三章-web服务器开发

这篇文章主要讲述,Node.js的原生的web 服务器开发。目的是掌握node基础的web服务器开发中所用到的api, 以及代码模块化思想,为以后的框架使用作为基础。

2024-06-18 15:29:25 747

原创 Node学习-第二章-创建脚手架工具

脚手架是个工具,通过输入命令创建项目初始化代码文件。脚手架工具的特点:1.指令执行 2.可交互 3.初始化项目构架。

2024-06-03 16:56:14 604

原创 Node学习-第一章

我们都知道javascript, 是运行在浏览器环境中的语言。通过v8引擎的,对javaScript 进行解析,实现代码的运行。node其实就是一个平台或者环境可以运行javascript 并且调用操作系统的资源。

2024-05-30 18:54:58 504 2

原创 浏览器同源策略

同源策略是浏览器的一种安全机制,用来限制来自不同源的文档之间的相互操作。同源策略的三要素包括协议、域名(或IP地址)和端口号,只有当这三个要素全部相同时,两个URL才属于同一个源。

2024-05-24 15:19:05 415

原创 npm入门介绍

npm(Node Package Manager)是 Node.js 的包管理工具,用于安装、管理和共享 JavaScript 代码包。它是全球最大的软件注册表,拥有数百万个开源包,为开发者提供了丰富的资源和工具。

2024-05-24 10:06:04 442

原创 css filter 属性介绍

请注意, filter 属性可能不会在所有浏览器中都被完全支持,特别是旧版本的浏览器。因此,在使用之前,请确保检查目标浏览器的兼容性。等的可视化效果,如模糊、亮度、对比度、饱和度等。它接受一系列不同的函数值,这些函数值可以组合起来创建复杂的视觉效果。CSS的filter属性提供了对元素。

2024-05-23 15:49:45 406

原创 浏览器本地存储

LocalStorage 是HTML5新引入的特性。一种web的存储机制,用户可以将信息存储在浏览器本地。

2024-05-23 15:42:59 293 1

原创 前端程序员对浏览器的理解

浏览器的主要功能是:将通过网络访问到服务器,并且把响应的内容渲染呈现给用户。这里的内容是多种多样的,文本、图片、脚本、视频、声音等。并且对一般的html文件的依照W3C组织制定的标准进行解析和渲染。W3C 组织是负责制定html css 标准的组织。

2024-05-16 14:30:04 855

原创 前端人员如何理解进程和线程

进程和线程本质都是cpu工作过程的时间片。进程可以理解为cpu在运行指令即加载保存上下文所要用的时间。也可以理解为一个应用程序运行的实例。线程是进程中更小的单位,描述一段指令所需要的时间。进程是资源分配的最小单位,线程是CPU的最小调度单元。当运行一个程序的时候,计算机系统会把内存释放一部分,用来存储运行程序的代码,数据和一个住线程任务。这样的一种情况就是一个进程。

2024-05-13 14:14:31 447

原创 前端工程师需要考虑的信息安全问题

作为一个经验老道的程序员,需要预知会遇到什么样的安全危险和制定相关的解决方案。

2024-05-11 16:51:07 560

原创 面试前端随笔20240510

最近公司招聘前端开发人员有幸参与帮听,总结了三个有关vue的面试问题和答案,现在分享一下。

2024-05-10 14:18:06 824

原创 前端WebSocket

WebSocket是HTML5提供的一种浏览器与服务器进行全双工通讯的网络技术。是一种在Web浏览器和服务器之间建立持久连接的通信协议。它允许服务器主动向浏览器发送数据,而不需要浏览器发起请求。相比起传统的HTTP请求-响应模式,WebSocket能够实现更高效的双向通信。WebSocket协议通过在HTTP协议上建立握手,然后使用TCP连接来实现双向通信。握手阶段使用标准的HTTP协议,因此WebSocket协议可以通过HTTP和HTTPS端口进行通信,而不需要额外的端口。

2024-05-08 16:57:30 1231 1

原创 前端TCP三次握手和四次挥手

服务器收到客户端的ACK包后,关闭连接。

2024-05-08 14:58:08 333

原创 前端计算机网络之网络模型

对于前端开发者而言,理解网络模型的概念是非常重要的。网络模型是描述数据如何在网络中传输和处理的框架和规则,它有助于前端开发者更好地理解和优化应用程序与服务器之间的通信过程。

2024-04-28 14:52:39 1004

原创 前端计算机网络基础之DNS协议介绍

在整个查询过程中,可能还涉及其他类型的DNS服务器,如辅助DNS服务器和转发DNS服务器,它们在某些情况下会参与解析过程,提供额外的解析支持或转发查询请求。值得注意的是,DNS查询过程中还涉及到不同类型的查询,如A记录查询(将主机名解析为IP地址)、CNAME记录查询(查询域名的别名)等,这些查询类型根据用户的需求和域名的配置而定。总的来说,DNS完整的查询过程是一个复杂但高效的机制,它确保了用户能够通过输入域名来方便地访问互联网上的各种资源。

2024-04-28 13:59:10 411

原创 前端工程化详解

使用统一的开发工具IDE,安装相同的插件,有利于代码风格统一。推荐使用jest,Jest 是一个由 Facebook 开发的测试运行器,致力于提供一个“bettery-included”单元测试解决方案。根据选择的技术栈使用官方推荐的脚手架工具或者是自研脚手架工具。是一个现代的前端构建工具,它在开发环境中利用浏览器原生的 ES 模块加载机制实现快速启动和热更新,而在生产环境打包时,默认。原生的webpack配置项较多,vue-cli减轻了开发者心智负担,按照vue开发者的习惯整理并且构建了一套配置和规范。

2024-04-26 16:49:58 523

原创 前端工程化-简介

前端工程化是指通过利用工具, 制定规范,优化工作流程等方式,让项目具有健壮性和灵活性,让开发团队能够高效率,高质量的完成工作。具体来说,前端工程化涵盖了多个方面,

2024-04-26 14:13:21 204

原创 前端如何优化工程

如果需要,可以编写自定义的Webpack插件或扩展,针对特定需求进行性能优化。

2024-04-25 14:39:52 981

原创 作为前端工程师如何SEO优化

SEO,全称Search Engine Optimization,即搜索。

2024-04-24 13:52:31 1518

原创 VUE diff算法面试题

key的主要作用其实就是对比两个虚拟Dom节点时,判断其是否为相同节点。如果key一样就直接对比其children中不同就行, 如果没有key值没有或者不一样, 那么就需要对比其他很多属性参数(很多很多)才能得出是不是相同的节点。头与尾(头与尾比,此种发生了,涉及移动节点,那么新前指向的节点,移动到旧后之后)尾与头(尾与头比,此种发生了,涉及移动节点,那么新前指向的节点,移动到旧前之前)的方法,最快速的找出新老虚拟dom的差异方法。头对头(先比开头,后插入和删除节点的这种情况)diff算法是一种通过。

2024-04-23 16:40:17 319

原创 vue源码解析patch.js

前言:在vue2.0 中,VNode转换成真正的DOM是通过patch(oldVNode,VNode,hydrating)方法实现的。源码目录:/vue/src/core/vdom/patch.ts。

2024-04-19 13:51:27 408 1

原创 Vnode是如何产生的?

Vue.js2.0中有两种生成方式:第一种是直接在Vue对象的option中添加render字段;第二种是像Vue.js 1.x版本那样写一个模板或者指定一个el根元素,它会首先转换成模板,经过HTMI语法解析器生成一个 ast 抽象语法树,对语法树做优化,然后把语法树转换成代码片段,最后通过代码片段生成function添加到option的render字段中。经过一系列的编译操作之后生成的render方法。

2024-04-18 20:57:09 334

原创 Vue的虚拟DOM是什么

由于现代网络和浏览器的发展,网页的内容也变得很复杂,ajax 诞生让用户可以在不刷新页面的条件下获取到数据。但是 新的数据的渲染需要操作dom,这个是比较耗性能的。所以人们想出来, 将dom转化成js也称为vdom,通过跑js程序,对比出来新vdom 和 老vodm,拿到需要更新变化的vdom,这样就可以通过dom操作,需要变化的内用。简单来说,不再因为一部分的改动就把整体的dom重新渲染,通过筛选出来变动的内容,只渲染变动的内容。核心思想:使用 js对象的形式来表现html的dom结构。

2024-04-17 14:49:01 324

原创 VUE3.0对比VUE2.0

vue2和vue3的区别

2024-04-15 13:53:51 857

原创 有关Vuex需要知道知识

确实是如此——如果您的应用够简单,您最好不要使用 Vuex。但是,如果您需要构建一个中大型单页应用,您很可能会考虑如何更好地在组件外部管理状态,Vuex 将会成为自然而然的选择。● 当 State 中的数据被改变之后,就会重新渲染(Render)到 Vue Components 中去,组件展示更新后的数据,完成一个流程。“store” 基本上就是一个容器,它包含应用部分的状态 ( state )。2.改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation。

2024-04-11 16:12:08 432

原创 前端同学必会有关http的相关知识

HTTP协议()是一种应用层协议,用于在网络中传输超文本(如网页)数据。。

2024-04-10 16:55:05 407

原创 VUE路由懒加载如何实现

也称为延迟加载或按需加载,是一种优化技术,可以延迟加载应用程序的某些模块或组件这种技术可以在初始加载时只加载必要的基本组件,而将其他组件按需加载,当用户访问特定的路由时,相关的组件才会被异步加载。这样做的好处是可以减少初始加载的文件体积,提高应用程序的加载速度,特别是在处理大型单页应用时,可以有效地分担首页所承担的加载压力,减少首页加载时间,从而提高用户体验。

2024-04-09 19:17:00 317

原创 VUE路由跳转、传参总结

使用方式router-link,目标使用path。13.使用方式router-link,目标使用path。)使用方式使用编程式导航,目标使用path,15.使用方式使用编程式导航,目标使用path,7.使用方式使用编程式导航,目标使用path,11.使用方式使用编程式导航,目标使用path。12.使用方式使用编程式导航,目标使用name。16.使用方式使用编程式导航,目标使用name。4.使用方式使用编程式导航,目标使用name。8.使用方式使用编程式导航,目标使用name。

2024-04-08 13:44:13 546 1

原创 VUE 实现路由的基本原理

abstract模式是使用一个不依赖于浏览器的浏览历史虚拟管理后端。基于内存的历史。该历史的主要目的是为了处理服务端渲染。它从一个不存在的特殊位置开始。用户可以通过调用 router.push 或 router.replace 将该位置替换成起始位置。

2024-04-07 14:38:44 465

原创 JSX 和 HTML 之间的区别

需要注意的是,JSX 和 HTML 并不相互排斥,可以在 React 应用程序中一起使用,其中 JSX 用于定义应用程序的组件和结构,HTML 用于呈现内容。JSX和 HTML 都是用于创建和构建网页的标记语言,但它们有一些关键的区别。

2024-04-03 15:57:53 552

原创 VUE中组件常用的通信方式有哪些?

子组件中通过接受父组件传递的参数,同时通过, 发送数据给父组件。父组件中通过事件绑定获取子组件传递的参数。优先推荐这个种方法。原因有这些:1. 子组件中可以规范接受的参数,它是什么数据类型,以及默认值。2. 在通过emit传递给父级数据,保证数据的实时性。

2024-04-02 14:58:08 471

原创 深入理解VUE的keep-alive

是一个内置组件,它的功能是在多个组件间动态切换时缓存被移除的组件实例。比如:实际页面业务中,申请页面可能需要填写多页或者多张表单,需要缓存已填写的表单信息,在页面或者组件切换中,数据不会被销毁。个时候就可以用到。或者是移动端项目,用户在进行返回操作时,希望保持之前的页面内用。

2024-04-01 15:33:54 443

原创 Git如何修改commit注释

这上面第一一行就是一次commit历史,按照提交的顺序进排列。修改内容的操作同第1次一样,之后输入指令,完成修改操作。第一行是最后一次的注释信息。1. 按i键进行编辑状态,修改注释信息。进行编辑,需要修改那个注释,就将其前面的。例如我想要修改最近2次注释信息就使用。wq保存并按enter建退出。再次输入指令修改第2条注释。查看,注释信息已修改。

2024-03-31 20:43:11 1370

原创 前端小白如何理解mvc mvp mvvm

mvc:用户操作视图,发生改变通知控制器,控制更新数据,模型接受新数据,发给视图展示。例如:计算器,输入1 + 1, 计算后等于2,计算器显示了2.mvp:用户操作视图,发生改变通知住持,住持处理更新数据,模型接受新数据,发给住持,住持更新视图。== 我们可以看到从这里开始,视图和模型直接不能直接通信了,这个思想也被mvvm模型借鉴==mvvmmvvm的视图和视图模型是双向数据绑定,他们彼此的变化不需要在单独处理而是响应式。其他的和mvp一样。

2024-03-30 16:11:11 343

原创 如何简单理解vue的NextTick

nextTick 中文意思:下一个敲击点。由于vue的响应式是异步的,那么当我们想在所有组件渲染结束后做一下“自己的事情”,所以就有了nextTick这个方法。这也就弥补了有一种情况mounted这个生命周期钩子满足不了需求,比如在子组件种操作父组件的dom,子组价的mounted就使不上劲啦。1.利用js的事件循环机制,2.源码主要判断当前设备环境支持的异步方法,将回调函数放入数组中,当vue渲染结束,依次执行数组中存放的事件。由于JS是单线程应用,所以按常理代码应该是自上到下依次执行。

2024-03-29 10:28:27 398

空空如也

空空如也

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

TA关注的人

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