- 博客(31)
- 收藏
- 关注
原创 webpack高级进阶一-source-map
会生成sourcemap,但是source-map是以。:会生成sourcemap,但是source-map是以。添加到bundle文件的后面。
2025-04-06 10:15:41
1150
原创 Node高级进阶六-koa框架
请求地址:http://localhost:6000/login。,会去执行下一个中间件,直到执行完所有中间件。默认是不会等待异步中间件执行完成的,可以在。的方式等待异步中间件执行完成。顺序跟koa执行同步代码一样。
2025-01-16 14:37:15
1081
原创 Node高级进阶五-express框架
应用场景:客户端发送请求后,后端需要做的操作很复杂的时候。比如一个请求涉及参数验证、身份验证、数据库查询、返回数据等操作,如果不想在一个中间件中完成所有操作的话,就可以分成多个中间件进行处理。
2024-12-18 18:52:08
1143
原创 Node高级进阶四-http模块
通过这种方式,foo.png图片不能正确的打开,因为里面还包含了其他非图片的信息,如其他参数,boundary等。备注:看具体的文件上传后的数据,可以在vscode中通过debug查看。
2024-11-14 17:45:17
1561
原创 Node高级进阶一-Node模块-fs和events模块
Node文件系统的API非常的多:fs的api文档我们不可能,也没必要一个个去学习;这个更多的应该是作为一个API查询的手册,等用到的时候查询即可;学习阶段我们只需要学习最常用的即可;但是这些API大多数都提供三种操作方式:方式一:同步操作文件:代码会被阻塞,不会继续执行;// common.js写法// 1.同步读取})console.log('后续的代码');方式二:异步回调函数操作文件:代码不会被阻塞,需要传入回调函数,当获取到结果时,回调函数被执行;
2024-10-13 14:49:46
1044
原创 2024-09-06 深入JavaScript高级语法十六——JS的内存管理和闭包
这里先来看一下闭包的定义,分成两个:在计算机科学中和在 JavaScript 中。在计算机科学中对闭包的定义(维基百科):闭包(英语: Closure ),又称词法闭包( Lexical Closure )或函数闭包( function closures );是在支持头等函数的编程语言中,实现词法绑定的一种技术;闭包在实现上是一个结构体,它存储了一个函数和一个关联的环境(相当于一个符号查找表);
2024-10-01 12:08:19
969
原创 2024-09-04 深入JavaScript高级语法十五——浏览器原理-V8引擎-js执行原理
每一个执行上下文会关联到一个变量环境( VariableEnvironment )中,在执行代码中变量和函数的声明会作为环境记录( Environment Record )添加到变量环境中。每一个执行上下文会被关联到一个变量环境( variable object , VO ),在源代码中的变量和函数声明会被作为属性添加到 VO 中。假如我们有下面一段代码,它在JavaScript中是如何被执行的呢?对于函数来说,参数也会被作为环境记录添加到变量环境中。对于函数来说,参数也会被添加到 VO 中。
2024-10-01 11:16:43
752
原创 2024-08-17 深入JavaScript高级语法十四——手写防抖、节流、深拷贝、事件总线函数实现
/ 1.记录上一次的开始时间// 2.事件触发时,真正执行的函数// 2.1.获取当前事件触发时的时间if (!// 2.2.使用当前触发的时间和事件的时间间隔以及上一次开始的时间,计算出还剩余多长时间需要去触发函数fn()timer) {fn()lastTime =!leading?自定义事件总线属于一种观察者模式,其中包括三个角色:发布者(Publisher):发出事件(Event);订阅者(Subscriber):订阅事件(Event),并且会进行响应(Handler);
2024-09-05 14:30:18
388
原创 2024-07-27 深入JavaScript高级语法十——浏览器Node的事件循环-微任务-宏任务
解析:不是普通的值,多加一次微任务;Promise.resolve(4),多加一次微任务。一共多加两次微任务。解析:thenable相当于多包了一层resolve(4)解析:直接return一个值,相当于resolve(4)(还不太明白,需要想一想)(还不太明白,需要想一想)(还不太明白,需要想一想)
2024-08-04 10:16:37
749
原创 2024-07-21 深入JavaScript高级语法九——迭代器和生成器
迭代器( iterator ),是确使用户可在容器对象( container ,例如链表或数组)上遍访的对象,使用该接口无需关心对象的内部实现细节。其行为像数据库中的光标,迭代器最早出现在1974年设计的 CLU 编程语言中;在各种编程语言的实现中,迭代器的实现方式各不相同,但是基本都有迭代器,比如 Java 、 Python 等;从迭代器的定义我们可以看出来,迭代器是帮助我们对某个数据结构进行遍历的对象。
2024-08-01 19:18:34
1366
原创 2024-04-19 深入JavaScript高级语法八——Promise使用详解
如果我们返回的是一个普通值(数值/字符串/普通对象/undefined等),那么这个普通的值会作为一个新的Promise被返回(相当于这个新的Promise执行resolve后,把这个做为了resolve的参数)。注意:当通过链式调用的方法调用catch方法时,catch会优先捕获原本的promise异常,如果原本的promise没有返回异常,则会依次捕获then方法返回的新的Promise的异常。我们经常传递的:普通的值或者对象,这时promise的状态变化为。比较规范的创建微任务的方式,使用。
2024-07-21 11:43:29
945
原创 一、webpack基本学习
如果我们想在自己的模块中加入一些比较特别的内容:比如添加一个noscript标签,在用户的JavaScript被关闭时,给予相应的提示;比如在开发vue或者react项目时,我们需要一个可以挂载后续组件的根标签这个时候我们需要一个属于自己的index.html模板:
2024-06-29 21:19:22
946
原创 2024-05-26 包管理工具使用
快速:pnpm比其他包管理器快2倍;高效:node_modules中的文件链接自特定的内容寻址存储库;支持monorepos:pnpm内置支持单仓多包;严格:pnpm默认创建了一个非平铺的node_modules,因此代码无法访问任意包;
2024-06-13 16:57:42
899
原创 2024-05-18 前端模块化开发——ESModule模块化
注意,export后面跟的{}不是一个对象,只是一种特定的语法。说明:3.2、导出方式二——通过as起别名3.3、导出方式三——定义的时候就直接导出4、import关键字4.1、导入方式一——直接导入4.2、导入方式二——通过as起别名一般在导入的时候起别名,而不是在导出的时候4.3、导入方式三——可以给整个模块起别名5、export和import结合使用这是一种开发思想。工具类库:工具类统一导出出口(export和import结合使用):使用工具类中的方法:6、def
2024-06-02 11:09:45
1575
1
原创 2024-05-18 Node.js学习二——CommonJS-Node模块原理
到底什么是模块化、模块化开发呢?事实上模块化开发最终的目的是将程序划分成一个个小的结构;这个结构中编写属于自己的逻辑代码,有自己的作用域,定义变量名词时不会影响到其他的结构;这个结构可以将自己希望暴露的变量、函数、对象等导出给其结构使用;也可以通过某种方式,导入另外结构中的变量、函数、对象等;上面说提到的结构,就是模块;按照这种结构划分开发程序的过程,就是模块化开发的过程;
2024-05-25 21:47:34
1158
原创 2024-04-29 Node.js学习一——安装与全局对象了解
官方对Node.js的定义:Node.js是一个基于V8 JavaScript引擎的JavaScript运行时的环境。也就是说Node.js基于V8引擎来执行JavaScript的代码,但是不仅仅只有V8引擎:前面我们知道V8可以嵌入到任何C++应用程序中,无论是Chrome还是Node.js,事实上都是嵌入了V8引擎来执行JavaScript代码;但是在Chrome浏览器中,还需要解析、渲染HTML、CSS等相关渲染引擎,另外还需要提供支持浏览器操作的API、浏览器自己的事件循环等;
2024-05-18 11:49:05
887
原创 2024-04-19 深入JavaScript高级语法七——响应式原理实现
实际开发中,需要响应的对象是有很多的,每个对象也有很多属性,不可能每个对象及每个对象的属性都通过一个数组分别收集,所以引出了类的封装。注释:每个对象单独对应一个Map(是为了防止有不同对象存在相同属性的情况),再把不同对象的Map通过一个统一的WeakMap管理起来。重点关注watchFn方法的变化和activeReactiveFn全局变量的作用,以及Proxy中的get方法。原因:真实开发中,是有多个对象的,而且每个对象也会对应不同的属性。封装一个获取depend的函数。
2024-04-19 16:26:53
401
1
原创 2023-03-12 深入JavaScript高级语法六——Proxy-Reflect
Reflect中常见的方法和Proxy是一一对应的,也是13个。类,这个类从名字就可以看出来,是用于帮助我们创建一个。在ES6中,新增了一个。
2024-04-19 09:54:55
940
1
原创 Vue2+ant-design(v1.7.8)实现合并单元格并自定义单元格内容
1、官方给出的demo官方demo地址其中主要代码为:具体通过column的customRender属性实现const renderContent = (value, row, index) => { const obj = { children: value, attrs: {}, }; if (index === 4) { obj.attrs.colSpan = 0; } return obj;};const columns = [ {
2022-02-24 19:59:16
2265
1
原创 angular9+ant-design框架实现输入框只能输入数字和小数点
1、功能实现以下代码引用至ant-design官方文档import { Component, ElementRef, ViewChild, ViewEncapsulation } from '@angular/core';@Component({ selector: 'nz-demo-input-tooltip', encapsulation: ViewEncapsulation.None, template: ` <input #inputElement
2021-12-27 14:50:38
1360
原创 2021-10-28 html5+css3学习笔记(一)
目录1、文档声明2、html元素的lang(language的缩写)属性3、head元素嵌套的元素URL/SEO优化SEO优化1、文档声明<!DOCTYPE html>作用:HTML文档声明,告诉浏览器当前页面是HTML5页面,让浏览器用HTML5的标准去解析识别HTML文档必须放在HTML文档的最前面,不能省略,省略了会出现兼容性问题2、html元素的lang(language的缩写)属性英文:<html lang="en">...</html>
2021-11-10 09:51:45
1112
原创 2021-08-27 angular9学习(二)—— 结构型指令(改变宿主文档结构)
目录1. angular语法中的*符号2. 只有一个输入属性时3. 有多个输入属性时1. angular语法中的*符号*是一个语法糖,举例:<a *ngIf="isLogin">退出</a>等价于:<ng-template [ngIf]="isLogin"> <a>退出</a></ng-template>2. 只有一个输入属性时html使用:<div *appMyDirective="firstParam
2021-08-27 15:40:37
164
原创 2021-08-25 angular9学习(一)—— ChangeDetection和属性型指令
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-08-27 11:01:26
513
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人