weixin_51458883的博客

原创 【乔治夫の小demo】ts环境下利用node实现实时读取md文件在html页面展示的小案例

文章目录文件准备初始化环境实现思路主函数代码封装的Promise工具函数实现结果文件准备main.ts——用于执行主文件操作index.md——md的主要内容github.css——引入样式covertoHtml——将md转化为HTML格式operateFile——文件操作的Promise封装初始化环境npm init -ynpm i typescript——安装ts依赖tsc --init 初始化ts的配置json文件npm i ts-node -D 安装一个开发依赖，可以帮

原创 Vue-Router学习笔记

Vue-Router文章目录Vue-Router简介准备阶段URL的hashH5中的pushStateH5中的replaceStateH5中的go认识配置安装搭建路由框架配置路由的映射关系路由的默认路径修改哈希模式使用代码实现路由动态路由==路由的懒加载==路由的嵌套使用参数传递导航守卫keep-alive简介路由就是通过互联的网络把信息从源地址传输到目的地址的活动后端路由:后端处理URL和页面之间的映射关系随着前后端分离阶段的出现，之后便到了单页面富应用阶段：其实SPA最主要的特点就是在前后

原创 ES6(一)let和const、模板字符串、箭头函数、扩展运算符

ES6(一)目录ES6(一)ECMAScriptletconst(定义常量)变量结构赋值基本用法默认值对象的解构赋值字符串的解构赋值数值和布尔值的解构赋值==用途==交换变量的值从函数返回多个值提取JSON数据函数参数的默认值==模板字符串==(反引号)简化对象写法函数参数赋初始值rest参数扩展运算符箭头函数以及声明特点ECMAScript通过ECMA-261标准化的脚本程序语言第六版(ES6)是2015年发布的let作用跟var一样，但声明的变量有一些特性let a;let

原创 回流(reflow)和重绘(repaint)

回流(reflow)和重绘(repaint)文章目录回流(reflow)和重绘(repaint)1.了解浏览器的渲染机制2.回流3.重绘4.性能影响5.避免性能影响减少重排的范围：分离读写操作：CSS:Javascript:优化动画:关于深度优先在浏览器中查看涉及到前端性能优化1.了解浏览器的渲染机制（1）浏览器采用流式布局模型（2）首先浏览器会将HTML解析成DOM Tree，把CSS解析成CSSOM，把CSSOM与 DOM Tree 结合产生render Tree，浏览器根据render

原创 JS继承(原型、原型链)

JS继承(原型、原型链)这里写目录标题JS继承(原型、原型链)关于原型定义隐式属性 \__proto\_\_==注意==constructor关于原型链样例原型链上属性的增删改查Object.prototype==call/apply==作用区别总结继承原型模式共享借用构造函数组合继承(结合上面两者)原型式继承ES5中的Object.create()寄生式继承寄生式组合继承解决样例要了解JS继承，首先要明白构造函数，实例和原型的关系。简单来说原型链的产生就是一个实例的原型又是由另一个构造函数构造出来的实

原创 小A最终考核(一)所有基本功能的完成(附操作视频)

小A最终考核(一):所有基本功能的完成 小A二轮考核(一)基本要求实现 目录小A最终考核(一):所有基本功能的完成使用的全局变量封装的AJAX请求(配合Promise使用)GET请求使用POST请求使用用户模块用户登陆/注册/注销登陆流程以及代码流程：代码：注册流程以及代码流程：代码：注销流程以及代码流程：代码：修改密码流程:代码:登陆注册的正则验证流程：代码:记住账号密码流程:函数：用

原创 个人练习:结合cookie和动态结点插入做的可存储的用户名存储系统(id具有唯一性)

#结合cookie和动态结点插入做的可存储的用户名存储系统(id具有唯一性)注意:要有端口才能运行以下代码,如果单单打开，cookie是不能存的访问服务器上的html文件是以http的协议方式去打开，有网络交互。直接打开html文件是以file协议的方式去打开，没有网络交互。此为个人研究练习缺点:id具有唯一性 个人cookie练习 <!DOCTY

原创 ES6(四)：模块化

ES6(四)：模块化概念将一个大的程序文件，拆分成许多小的文件，然后将小文件组合起来好处防止命明冲突彼此互不干扰，每个js文件声明的data不会冲突代码复用可以把功能函数封装成一个文件，对外暴露一个接口，哪个项目想用直接用即可高维护性开发人员对文件修改不会产生过多冲突升级只需要对某一些模块升级模块化规范产品ES6之前的模块化规范有:前面是模块规范，后面是产品CommonJS => Node.js、Browserify(前端代码的打包)AM

原创 ES6(三)Promise、Set、Map、Class完整、数值扩展，对象方法扩展

ES6(三):Promise、Set、Map、Class完整、数值扩展，对象方法扩展PromisePromise基本使用ES6引入的异步编程(文件IO 数据库IO 网络请求)的新解决方案，主要解决之前回调地域的问题，之前我们是使用回调函数层层回调，看起来丑，挑食起来麻烦。语法上Promise是一个构造函数，我们可以利用它实例化对象接着我们函数内部封装异步操作，获取成功或失败的结果//实例化对象时我们接受一个函数类型的参数，而这个函数有两个形参//现在我们实例化一个对象p(对象的三个状态:初始

原创 ES6(二)：Symbol、class初识、迭代器和生成器工作原理

ES6(二)文章目录ES6(二)Symbol的基本使用基本概念作为属性名时候的Symbol属性名遍历中的Symbolclass初识Symbol.for()Symbol.keyFor()往对象里添加Symbol类型属性Symbol内置的值(指向内部使用的方法)迭代器==迭代器工作原理==生成器生成器函数实例Symbol的基本使用基本概念ES6引入了一种新的原始数据类型Symbol(因为不是对象，所以不能添加属性),表示独一无二的值。他是JS语言的第七种数据类型，是一种类似于字符串的数据类型。ES5的

原创 实战知识点(二):FormData，页面实现，正则实现实时输入验证，键盘响应输入框，发送请求(发送前确认格式)

实战知识点(二):FormData，页面实现，正则实现实时输入验证，键盘响应输入框，发送请求(发送前确认格式)FormData1.概念XMLHttpRequest 2级定义的，它是为序列化表以及创建与表单格式相同的数据提供便利(一般用于XHR传输)2.构造函数创建一个formData对象实例的两种方式创建一个空对象实例，往里面放数据 let data1 = new FormData(); //利用构造函数创建一个对象存输入的账号密码 var lgNameInner

原创 这个Joseph的顺序栈一点也不好吃

目录基于数组而实现的顺序栈顺序栈的结构体所有函数显示菜单初始化栈判断是否为空栈或没初始化获取栈顶的元素清空栈销毁栈检测栈的长度入栈出栈显示栈的数据主函数基于数组而实现的顺序栈栈(Stack)是限定只能在表尾进行插入和删除操作的线性表。栈又称为后进先出（Last In First Out）的线性表，简称LIFO结构。缺点:需要事先确定好储存空间大小顺序栈的结构体typedef struct SqStack{ ElemType *elem; //指向数组 int

原创 AJAX(二).IE缓存，网络超时和异常，取消请求，防止重复请求

AJAX(二)：IE缓存，AJAX网络超时和异常，取消请求，防止重复请求文章目录AJAX(二)：IE缓存，AJAX网络超时和异常，取消请求，防止重复请求IE 缓存问题AJAX网络超时和异常AJAX的取消请求AJAX防止重复发出请求方便在更改服务器代码后，无需再重启服务器，它可以自动检测服务端代码在存在node.js的环境中，在终端输入 npm install -g nodemon启动服务时，在终端输入一次 nodemon 文件名即可注意：需要在管理员身份下来运行VSCODE桌面打开

原创 AJAX(一).AJAX的基本概念原理以及如何使用(联系JS笔记十JSON)

AJAX(一):AJAX的基本概念原理以及使用(联系JS笔记十JSON)目录AJAX(一):AJAX的基本概念原理以及使用(联系JS笔记十JSON)XML简介AJAX特点优点：缺点：HTTPexpress的使用步骤关于请求类型GET关于请求类型POST如何设置请求头信息▲与JSON一起使用AJAX全称为Asynchronous Javascript And XML , 就是异步的 JS 和 XML，通过AJAX可以在浏览器中向服务器发送异步请求，最大的优势：无刷新获取数据。AJAX不是新的编程语言，是

原创 防抖(debounce)和节流(throttle)的原理以及实现

防抖(debounce)和节流(throttle)的原理以及实现在平时开发的过程中，会有很多场景会频繁触发事件，比如说搜索框的实时发请求，疯狂点轮播图换图，onmousemove,resize,onscroll等等，有些时候，我们并不能或者不想频繁触发事件，咋办呢？应用场景resize时间input输入发起请求元素的拖动等等防抖原理事件相应函数在一段时间后才执行，如果在这段事件内再次调用，则重新计算执行时间；当预定的时间内没有再次调用该函数，则执行dosomething函数

原创 (十一)Javascript中的正则表达式（RegExp）

(十一)Javascript中的正则表达式（RegExp）多行字符串//此处想实现写入的时候能按照代码规范<script type="text/javascript">document.body.inner = " <div></div> <span></span>";</script>这里会报错，因为系统规定字符串不能多行显示<script type="text/javascript">docu

原创 (十)Javascript中的JSON,渲染,异步加载,时间线(进程优化基础)

(十)Javascript中的JSON,异步加载,时间线（进程优化基础）目录(十)Javascript中的JSON,异步加载,时间线（进程优化基础）JSON关于渲染异步加载JSJS加载时间线(为后面优化做铺垫)JSONJSON是一种传输数据的格式（以对象为样板，本质上就是对象，但用途有区别，对象就是本地用的，json是用来传输的）为了区分对象和JSON，JSON中的属性名要加双引号所以前端后台传输数据的格式其实是字符串，只不过这个是JSON格式的字符串，使用下面的方法，来使对象变为JSON传输

原创 关于Git的学习

git的基本学习基本的Linux命令学习Git配置Git基本理论（核心）工作流程Git项目搭建Git文件操作GIT分支基本的Linux命令学习cd : 改变目录cd+空格+… :回退上一个目录，直接cd进入默认目录pwd :显示当前所在的目录路径clear :清屏(reset效果跟这个差不多)ls(ll) :都是列出当前目录中的所有文件，只不过ll列出的内容更为详尽蓝色代表目录 白色代表文件 绿色代表程序touch :新建一个文件rm

原创 (九)Javascript事件分类(含JS实现固定定位)

(九)事件分类目录(九)事件分类鼠标事件键盘事件keydown keyup keypress文本操作事件(含输入框的实现)==实现一般页面中输入框的实现==窗体操作类(window上的事件)scroll==load==Js实现固定定位鼠标事件click、mousedown、mousemove、mouseup、contextmenu、mouseover、mouseout、mouseenter、mouseleave查看鼠标各个点的坐标注意，这里的前缀是document <body

原创 实战知识点(一)：CSS和JS部分知识点的运用(小A一轮)

CSS和JS部分知识点的运用(小A一轮)目录CSS和JS部分知识点的运用(小A一轮)首页首页大标题蓝色边框动画的实现头部导航条黄色块的实现第三个英文标题透明字体的实现通过伪元素修饰各个标题右侧导航条右侧导航栏的样式实现右侧导航栏展开内容的动画实现右侧导航栏图标字体的引用右侧导航栏自动滚轮动画的js实现轮播图轮播图的弹性容器设置轮播图无限自动轮播的js实现轮播点随着轮播图切换的js实现轮播点点击时的被选中的js实现圈圈动画效果的实现公用样式中的设置关于固定定位与粘滞定位与视距的一个问题首页首页大标题蓝色

原创 (八)Javascript中的事件（1）

(八)Javascript中的事件事件交互体验的核心功能如何绑定事件处理函数1.ele.onxxx = function (event){}兼容性很好，但是一个元素的同一个事件上只能绑定一个处理程序基本等同于写在HTML行间上<body> <div style="width:100px;height:100px;background-color:red;"></div> //句柄 <script type="text/javascr

原创 (七)Javascript中date对象,定时器,脚本化CSS,dom尺寸,获取窗口属性

（七）Javascript中data对象，定时器，获取窗口属性和dom尺寸，脚本化CSS(含封装函数)小练习封装函数insertAfter<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="view

原创 (六)Javascript从DOM选择器,DOM基本操作，DOM继承树

(六)Javascript从DOM选择器,DOM继承树,DOM基本操作1.DOM选择器以及对节点的增删改查查查看元素节点document代表整个文档document.getElementById("")//这里识别的是id，唯一标识，只能选一个，不能选一组，所以无下标（而且element后面无s）ie8以下不区分id大小写最好不要用id.getElementsByTagName("")[];//标签名，但兼容性好把页面中所有div都拿出来，拿出一个注意要写下标这里不是

原创 JS部分知识点回顾(一).xmind

总结复习关于前几天学的JS知识所构制的脑图点击此处下载xmind文件

原创 (六)Javascript从DOM选择器至DOM继承树(3月22日终版)

(六)Javascript从DOM选择器至DOM继承树1.对节点的增删改查查查看元素节点document代表整个文档document.getElementById("")//这里识别的是id，唯一标识，只能选一个，不能选一组，所以无下标（而且element后面无s）ie8以下不区分id大小写最好不要用id.getElementsByTagName("")[];//标签名，但兼容性好把页面中所有div都拿出来，拿出一个注意要写下标这里不是数组，是类数组从DOM开始，系

原创 (五)Javascript从深度克隆至dom操作初识

(五)Javascript从深度克隆至dom操作初识深度克隆//方法：//1.首先通过遍历判断origin中的属性是不是原始值 //(typeof()看结果是不是object)//2.如果是引用值，判断是数组还是对象 //(三个方法)constructor instanceof toString(最好)//3.从而建立相应的数组和对象var obj = { name : "abc". age : 123, card : ["visa","master"], wife : { na

原创 封装typeof 和 数组去重

封装typeof 和 数组去重封装typeoffunction type(target){ //分两类 原始值 引用值 //区分引用值(数组 对象 包装类(typeof(new Number())得到也是"object" ) //样板 var template = { "[object Array]" : "array", "[object Object]" : "object", "[object Number]"

原创 (四)Javascript从原型至对象枚举

(四)Javascript从原型至对象枚举原型定义:原型是function对象的一个属性，它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象。//Person函数是对象//Person.prototype -- 原型(在被构造函数定义时就产生了)//Person.prototype = {} 是祖先(它也是一个对象)Person.prototype.LastName = "Wei";//原型的一个属性Person.prototype

原创 (三)Javascript从立即执行函数至包装类(含闭包问题)

(三)Javascript从立即执行函数至包装类(含闭包)立即执行函数定义- 此类函数没有声明，在一次执行过后即释放，适合做初始化工作。//立即执行函数(只用一次，声明的话浪费空间)//针对初始化功能的函数,形式如下:(function abc(){ var a = 123; var b = 234; cconsole.log(a+b)}())//在控制台中输入abc，会显示报错，abc is not undefined//前后两个括号的作用，前面是形参，后面是实参var nu

原创 (二)Javascript从函数至闭包

(二)Javascript从函数至闭包初识函数(也是一个引用值)定义​ 函数出生的原因在于编程思想:高内聚，低耦合)函数声明//函数声明function theFirstName(){}//命明中第一个单词小写，之后的单词首字母大写(开发规范).document.write(theFirsrName);//这里与C不同之处在于它不输出地址，输出的是函数体//这里得到的是function theFirstName(){}函数表达式命明函数表达式 var test =

原创 (一)Javascript从变量至类型转化(含练习)

（一）Javascript从变量至类型转化(含练习)变量（variable）变量声明声明、赋值分解单一var命明规则变量名开头是：英文字母、_、$变量名可以包含英文字母、_、$、数字不可以使用系统的关键字、保留字作为变量名值类型——数据类型不可改变的原始值（栈stack数据）五大类Number，String，Boolean(布尔)，undefined，null声明变量为赋值，则改变量为undefined引用值（堆heap数据）array Object f

原创 CSS的知识总结和梳理

尚硅谷的CSS学习知识总结和梳理此为个人学习完css后通过脑图做的知识总结和梳理，大多数细节知识点和讲解存入xmind各项的笔记中，需要可自取。资源仅供参考以及学习交流，希望能指出不足之处。xmind文件下载处...

原创 html知识巩固脑图

原创 CSS编码规范的一些学习

CSS代码规范说明：文字中高亮部分为个人认为比较重要的部分1.代码风格1.1 格式VSCode编译器里下载prettier插件，调整保存时自动格式化代码如何调整？参考：https://blog.csdn.net/qq_37815596/article/details/109225879?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-1&spm=1001.2101.3001.4242以下有关格式类的内容以及代

原创 HTML代码规范的一些学习

HTML代码规范的一些学习1. 代码风格1.1 格式​ VSCode编译器里下载prettier插件，调整保存时自动格式化代码如何调整？参考：https://blog.csdn.net/qq_37815596/article/details/109225879?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-1&spm=1001.2101.3001.42421.2 命名对于class单词必须全字母小

原创 初次使用Typora做笔记并且一些小操作

Typora中的一些小操作Typora-结构类操作一.多级标题这是一个四级标题这是第五级标题六级标题​ 方法：文字前面加#来实现​ 快捷键：ctrl+1~6 清除标题效果 ctrl+0二.有序列表打开冰箱插电开关开门放入大象关闭冰箱​ 快捷键：对选中内容按Ctrl+shift+“["​ 方法：数字+“.”+空格注意：编号后，一定要有空格行末回车开启下一行行末多次回车或方向↓键不会添加序号降级快捷键：Tab升级快捷键：shift+Tab