自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

学无止境

学习心得分享,注重基础教育

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

原创 React 学习笔记(一)

React是用于构建响应式用户界面的JavaScript库React是一个自由及开放源代码的前端JavaScript工具库, 用于基于UI组件构建用户界面。 它由Meta和由个人开发者和公司组成的社群维护。 React可用作开发具有Next.js等框架的单页、手机或服务器渲染应用程序的基础。然而,React只专注状态管理和将状态渲染到DOM,因此创建React应用程序通常需要使用额外的工具库来进行路由实现,以及某些客户端功能。

2023-03-04 13:18:03 98

原创 Vuex 基础与原理实现

在实际项目中,经常会出现多个组件之间需要共享一些状态数据的问题。多个视图依赖于同一状态来自不同视图的行为需要变更同一状态等。常用的解决办法:① 将数据以及操作数据的行为都定义在父组件;② 将数据以及操作数据的行为传递给需要的子组件(可能需要多级传递)这样的解决在组件嵌套层次太多时,十分麻烦,易导致数据不一致等问题。所以Vuex为此而生,很好地解决了多组件之间的状态,保证数据的一致性。Vuex是实现组件全局状态管理的一种机制,可以方便的实现组件之间的数据共享。

2023-01-20 16:44:08 522 5

原创 koa 基础入门与源码学习

Koa的中间件(Middleware) 是一个函数,是在请求和响应中间的处理程序,它可以通过ctx对象访问请求对象和响应对象。比如,在处理请求中,可以在响应之前,可以在请求和响应之间做一些操作,并且可以将这个处理结果传递给下一个函数继续处理。

2023-01-15 13:40:36 803 9

原创 你应该掌握的JavaScript高阶技能(八)

ECMAScript 为数组定义了 5 个迭代方法。every some map forEach filter每个方法接收两个参数:以每一项为参数运行的函数, 以及可选的作为函数运行上下文的作用域对象(影响函数中 this 的值)。传给每个方法的函数接收 3 个参数:数组元素、元素索引和数组本身。因具体方法而异,这个函数的执行结果可能会也可能不会影响方法的返回值。

2023-01-10 09:30:00 217 4

原创 你应该掌握的JavaScript高阶技能(七)

手写 Promise

2022-12-08 23:23:58 303

原创 你应该掌握的JavaScript高阶技能(六)

只要创建一个函数,就会按照特定的规则为这个函数创建一个 属性(指向原型对象)。默认情况下,所有原型对象自动获得一个名为 的属性,指回与之关联的构造函数。对前面的例子而言, 指向 。在自定义构造函数时,原型对象默认只会获得 属性,其他的所有方法都继承...

2022-12-05 19:47:56 520

原创 你应该掌握的JavaScript高阶技能(五)

this 的指向是可变的、动态的,所以在判断 this 指向时很容易让人感到困惑。暂时不考虑 this 指向如何改变,首先需要清楚知道两点:this 永远指向一个对象,this 指向完全取决于函数的调用位置

2022-11-30 18:20:23 413

原创 你应该掌握的JavaScript高阶技能(四)

axios 是基于 promise 可以用于浏览器(客户端)和 node.js 的网络请求库同一套代码可以运行在浏览器和 node.js 中,在服务端它使用原生 node.js 的 http 模块, 而在浏览端则使用 XMLHttpRequests。从浏览器创建 XMLHttpRequests 对象从 node.js 创建 http 请求,支持 Promise 的 API,可以拦截请求和响应,转换请求和响应数据,取消请求,自动转换 JSON 数据,客户端支持防御 XSRF

2022-11-26 17:34:56 1432 4

原创 你应该掌握的JavaScript高阶技能(三)

Proxy (代理)可以给目标对象定义一个关联的代理对象,而这个代理对象可以作为抽象的目标对象来使用。在对目标对象的各种操作影响目标对象之前,可以在代理对象中对这些操作加以控制。Proxy 是一个构造函数,可以通过它生成一个 Proxy 实例。跟 JavaScript 中的类似(也就是访问器属性,关注vue2.x的朋友都知道,vue2.x 的底层响应式原理部分就是使用它来实现的,vue3.x使用的是 Proxy + Reflect 来实现的数据代理)

2022-11-21 19:45:08 1160

原创 你应该掌握的JavaScript高阶技能(二)

JS 引擎是基于单线程事件循环的概念构建的,同一时刻只能完执行一个代码块,即将运行的代码被放入任务队列中,每当一段代码准备执行,都会被添加在任务队列。每当 JS 引擎中的一段代码执行结束,事件循环(Event Loop)会执行队列中的下一个任务。但如果有一个任务的执行时间很长,比如文件的读取或者数据的请求等等,那么后面的任务就要一直等待,这就会影响用户的使用体验。异步行为是为了优化因计算量大而时间长的操作。在异步操作中,每一个任务有一个或多个回调函数。

2022-11-17 09:30:00 1292

原创 从0到1学会TypeScript(二)

面向对象是程序中一个非常重要的思想,简而言之就是程序之中所有的操作都需要通过对象来完成。程序之中所有的操作都需要通过对象来完成。操作浏览器要使用 window 对象操作网页要使用 document 对象操作控制台要使用 console 对象也就是所谓的面向对象,那么对象到底是什么呢?这就要先说到程序是什么,计算机程序的本质就是对现实事物的抽象,抽象的反义词是具体,比如:照片是对一个具体的人的抽象,汽车模型是对具体汽车的抽象等等。

2022-11-14 20:02:07 1328 6

原创 从0到1学会 TypeScript (一)

如果一个目录下存在一个文件,那么它意味着这个目录是TypeScript项目的根目录。文件中指定了用来编译这个项目的根文件和编译选项。

2022-11-10 10:46:33 1055

原创 你应该掌握的JavaScript高阶技能(一)

本文内容参考 老师的素材与视频讲解,特别鸣谢❤️轮播图在网页中是无处不在,轮播图在网页中起到非常重要的作用,我们可以发现,点击轮播图的(图示)按钮,可以切换图片,底部(图示)小矩形同样可以有切换图片的效果,还有自动切换图片的功能。对于一名前端同学,能够使用实现轮播图是必备技能!我们将图片进行刨析,它的原型应该长这样,如图所示:可视窗口中(绿色空心矩形)只有一张图片,图片左右两侧有两个方向为左和右的按钮,点击可以进行图片切换,发生滚动效果。

2022-11-07 19:57:51 1746 3

原创 Vue 源码阅读学习(四)

问题:父元素和新旧元素的获取 构造函数编写 中有一个元素 是真正的 , 其 同样也是真正的 方法用于 转为真正的 : 写到这里,其实大家也发现了代码量非常大,看多了自己都不知道写啥,后面使用构建工具(模块化)来帮忙!继续编写 方法完成!验证一下:页面:验证成功!源码见文章末尾。使用 的时候,赋值属性和获取属性都是直接使用 实例,在设置属性的时候,页面数据进行更新。 : 需要定义属性的对象 : 要定义或修改的属性的名称或 : 要定义或修改的属性描述符其有比如 返回值为被

2022-11-05 19:42:45 1543

原创 Vue 源码阅读学习(三)

嘿,朋友们,本节是Vue源码阅读的第三讲。Vue源码阅读系列得到了赞赏,我很高兴,同时希望大家可以给予反馈!我虚心接纳您的意见!如果没有看之前的和的内容可以先去看看哦,好啦,让我们开始吧。

2022-11-04 15:13:06 1277 1

原创 Vue 源码阅读学习(二)

本节课内容要解决第一节课遗留的问题首先,温故知新第一节的重要内容我们来理清一下思路。DOM元素(就是模板)将来会换成虚拟DOM是一个树结构,看个例子。思路:模板要求是一直驻留在内存中,是渲染的根本。我们需要做的就是利用数据和模板结合生成真正的DOM。其中数据发生变化,DOM变化,而模板不变,然后生成的DOM加入页面。

2022-11-03 13:04:59 1900 8

原创 最详细 so easy 的正则表达式(二)

括号有很多,一般指的是(),还有中括号[]、花括号{},它们长的太像了,我们一起来区分一下,上代码!// 中括号 [] 字符集合.匹配方括号中的任意字符. var reg = / ^[abc]$ /;// a 也可以 b 也可以 c 也可以 a || b || c 三选一 console . log(reg . test('a'));//false // 大括号 量词符. 里面表示重复次数 var reg1 = / ^a{3}$ /;

2022-11-02 10:44:54 330 2

原创 最详细 so easy 的正则表达式(一)

### **方法**​ `RegExp`的主要方法是 `exec()`,主要用于配合**捕获组**使用。这个方法只接受一个参数,即要应用模式的字符串。​ 如果找到了匹配项,则返回包含第一个匹配信息的数组;否则返回 `null`。返回的数组虽然是 `Array`的实例,但是包含两个额外的属性,分别是 `index` 和 `input`,词如其面,`index`是字符串中匹配模式的起始位置,`input`是要查找的字符串。​ 这个数组的第一个元素是匹配整个模式的字符串,其他元素是与表达式中捕获组匹配

2022-11-01 12:20:54 543 3

原创 Vue 源码阅读学习(一)

/在真正的 Vue 源码中 DOM --> 字符串模板 --> 抽象语法树 --> VNode --> 真正的DOM。//我们此时是没有生成新的template 所以这里看到的是直接在页面总就更新的数据,因为DOM是引用类型。//3.将数据与模板结合,得到的是HTML元素 (DON元素)//3.将数据与模板结合,得到的是HTML元素 (DON元素)//现在的案例 template 是 DOM 元素。//注意:txt现在和DOM元素是没有关系的。//函数的第 0 个 参数 表示匹配的内容。

2022-10-31 16:48:30 722

原创 JavaScirpt 数组(一)

​ 情况二 : 有两个参数,第一个参数指定删除的起始位置,第二个参数为删除元素的个数。中重点内容,对于数组方法的灵活使用是一名合格前端的必备技能,所以让我们一起开始学习吧![注:不考虑低版本的浏览器]​ 用于将数组的某个片段切出新数组,不会改动原数组,非变异方法。现有的数组,而仅仅会返回被连接数组的一个副本,是非变异方法。是前端的基础,正所谓基础不牢,地动山腰,数组是。的情况,使用这些数组方法的时候,会发生什么?也会相应变化,是数组中的变异方法,会。也会相应变化,是数组中的变异方法,会。

2022-10-30 21:25:24 920 1

原创 Javascript 垃圾回收机制(简要)

当变量进入执行环境(声明变量)的时候,被标记为“进入环境”,当该变量离开环境的时候,将其再度标记为“离开环境”,随之进行删除。若引用次数为 0,那么在垃圾回收期下次运行时,会释放所有引用次数为 0 的值所占用的内存。Javascirpt具有垃圾回收机制,会按照固定时间间隔周期性的执行操作,用来释放那些。如果该变量的值赋值为另外一个值,则这个引用类型值的引用次数减1;同一个值又被赋值给另一个变量,这个引用类型值的引用次数加1;赋值给该变量的时候这个值的引用次数就加1;文章参考:小火柴的前端小站。

2022-10-30 14:17:09 855 1

空空如也

空空如也

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

TA关注的人

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