- 博客(138)
- 资源 (5)
- 收藏
- 关注
原创 你逛过凌晨4点的校园吗? -- 前端人的漫漫长路
时间一晃而过,弹指之间,2021 年已经接近尾声,回首望去,过往皆是青春,来看看这个前端新人的漫漫成长经历吧~
2021-12-14 10:59:11 27837 182
原创 我的大一结束了 —— 总结与规划
我的大一结束了 —— 总结与规划 时光荏苒,白驹过隙。转眼大一一年时间就这样过去了,这一年的时间里,学习到了许多的知识,结识了很多朋友,收获了很多的喜悦,同时也经历了很多的事情… 总之,这一年收获很多也成长很多。一、大学生活初入大学作为一名复读生,考上了一所还算不错的大学,自己还算满意吧~在入学的第一天,非常清楚的记得和师姐的这段对话
2021-07-10 15:49:09 3253 40
原创 Event 对象,你很了解吗?
还记得上一次使用 event 对象是什么场景吗?我猜一定是用来获取 target 或者用来阻止事件冒泡吧最近在看了一些代码和文章之后,发现 Event 对象并没有想象的那么简单,当然还是很简单,它还有更多丰富的用法!Event 对象就是事件对象,它是在事件发生之后产生的,作为参数传给监听函数。它是浏览器原生支持的一个构造函数,所有的事件都是这个对象的实例Event 构造函数接收两个参数,第一个参数是事件的名称,第二个参数是一个配置对象,主要有三个属性以上几个属性的默认值都是 false下面就通过构造
2022-07-14 13:22:13 891 3
原创 【offer 收割计划】这几道常见的面试题,你会几道
这几道前端经典面试题,你会几道呢?快来测测吧!关于 BFC, map,parseInt,Link 源码都有一个很好的解释~
2021-12-22 12:37:12 1267 14
原创 【offer 收割计划】你知道为什么 reducer 最好是一个纯函数吗?
前端面试经典题目,这几道题你能拿捏吗?来看看你会几道,redux 中的 reducer 为什么需要设计成纯函数呢?
2021-12-11 07:00:00 1300
原创 【化解数据结构】详解图结构,并实现一个图结构
图结构,你知道是什么吗?在这篇文章我们将详解图结构,通过学习图结构,我们可以解决道路,航班规划等实际问题
2021-12-07 11:39:07 890 1
原创 【化解数据结构】详解堆结构,并实现最小堆结构
如何判断最大值,最小值,你有没有很好的方法呢?不如来试试用堆实现吧,手写一个堆结构, 带你轻松学会~
2021-11-30 11:04:17 1293
原创 【化解数据结构】详解树结构,并实现二叉搜索树
这篇文章来讲解树结构,它在数据结构和算法中有着至关重要的作用,这部分的内容很多,红黑树,二叉树,avl树等等...
2021-11-26 08:00:00 924 2
原创 【化解数据结构】详解字典结构,并实现一个字典
来,给你一本字典,帮我查个单词。字典在前端的应用可谓十分的广泛,它独特的数据结构,造就了它一身的本领,一起来看看吧~
2021-11-25 08:00:00 996
原创 【化解数据结构】详解集合结构,并实现一个集合
学习了栈,队列,链表这些线性结构之后,接下来需要学习集合这个数据结构,它在前端世界中起着十分重要的作用
2021-11-22 12:53:58 1116
原创 【化解数据结构】详解队列,优先队列,循环队列,并实现一个队列
经常排队吗?了解队列这个数据结构吗?这篇文章囊括了队列相关的大部分内容,对于学习队列数据结构一定会有很大提升!
2021-11-21 08:00:00 898
原创 【化解数据结构】什么是栈?手写实现一个栈结构
关于栈数据结构你了解多少呢?入栈?出栈?如此简单,不如自己手写实现一个栈数据结构吧,那就从这篇文章开始栈的学习之旅吧~
2021-11-09 17:10:02 1136 1
原创 【化解数据结构】从这里开启数据结构和算法
在数据结构中,时间复杂度和空间复杂度是优化算法性能的关键,因此在学习数据结构和算法时一定要学会如何去计算时间空间复杂度!
2021-11-08 09:50:16 907 1
原创 React核心 -- React-Hooks
hooks 存在的意义hooks 之间的状态是独立的,有自己独立的上下文,不会出现混淆状态的情况让函数有了状态管理解决了 组件树不直观、类组件难维护、逻辑不易复用的问题避免函数重复执行的副作用应用场景利用 hooks 取代生命周期函数让组件有了状态组件辅助函数处理发送请求存取数据做好性能优化hooks API从 react 中引入1. useState给函数组件添加状态初始化以及更新组件状态const [count, setCount] = R.
2021-10-12 10:00:00 579 3
原创 React 入门学习(十七)-- React 扩展
引言学到这里 React 已经学的差不多了,接下来就学习一些 React 扩展内容,可以帮助我们更好的开发和理解,这部分的知识还有很多的东西可以探寻,比如:网红 React-Hook,就是我们需要注意的地方,打了 100 多集的类式组件,出来一个 hooks ,现在用函数式组件偏多了…所以 Hooks
2021-10-11 09:00:00 583 2
原创 React 入门学习(十六)-- 数据共享
React 入门学习(十六)-- 数据共享在写完了基本的 Redux 案例之后,我们可以尝试一些更实战性的操作,比如我们可以试试多组件间的状态传递,相互之间的交互如上动图所示,我们想要实现上面的案例,采用纯 React 来实现是比较困难的,我们需要很多层的数据交换才能实现,但
2021-10-09 21:54:04 541
原创 刚学会 TypeScript, 顺手做个贪吃蛇小游戏
最近在学习中,再次遇到了贪吃蛇的案例,之前刚学 JavaScript 的时候就有遇到过,趁着这段时间有一点点时间,就跟着做了一下,这篇文章将手把手带你实现一个贪吃蛇的小游戏,难度不会很大,嘻嘻可以从这个案例中学到以下几点:面向对象编程、this 指向问题、webpack 简单的配置、一、实现效果预览需要实现的功能有以下:页面布局
2021-10-07 00:39:02 1967 7
原创 TypeScript 超详细入门讲解
TypeScript 作为 JS 的超集,有着众多的优点,它能让我们更清晰的看到报错信息,对变量的类型有着严格的要求,这让我们的代码更加的规范和完美~
2021-10-03 14:21:19 1933 1
原创 React 入门学习(十五)-- React-Redux 基本使用
这篇文章是学习 React-Redux 的学习笔记引言在前面我们学习了 Redux ,我们在写案例的时候,也发现了它存在着一些问题,例如组件无法状态无法公用,每一个状态组件都需要通过订阅来监视,状态更新会影响到全部组件更新,面对着这些问题,React 官方在 redux 基础上提出了 React-Redux 库在前面的案例中,我们如果把 stor
2021-09-30 09:00:00 385
原创 React 入门学习(十四)-- redux 基本使用
这篇文章是学习 Redux 的学习笔记引言在了解了 Antd 组件库之后,我们现在开始学习了 Redux ,在我们之前写的案例当中,例如:todolist 案例,GitHub 搜索案例当中,我们对于状态的管理,都是通过 state 来实现的,比如,我们在给兄弟组件传递数据时,需要先将数据传递给父组件,再由父组件转发 给它的子组件。这个过程十分的复杂
2021-09-29 09:00:00 500 1
原创 React 入门学习(十三)-- antd 组件库的基本使用
这篇文章是学习 React 中 React antd组件库的学习笔记引言在我们学习JavaScript 的时候,我们学习了一个 bootstrap 的组件库。可以让我们快速开发,但是我们现在学习了 React ,一种组件化编程方式,很少说会去贴大量的 HTML 代码,再配一下 CSS,JS。我们也有一些现成的组件库可以使用,我们只需要写一个组件标签
2021-09-28 09:00:00 2401 4
原创 React 入门学习(十二)-- React 路由跳转
这篇文章是学习 React 中 React 路由跳转的学习笔记1. push 与 replace 模式默认情况下,开启的是 push 模式,也就是说,每次点击跳转,都会向栈中压入一个新的地址,在点击返回时,可以返回到上一个打开的地址,就像上图一样,我们每次返回都会返回到上一次点击的地址中当我们在读消息的时候,有时候我们可能会不喜欢这种繁琐的跳
2021-09-27 09:00:00 4336
原创 React 入门学习(十一)-- React 路由传参
这篇文章是学习 React 中 React 路由的学习笔记在上一篇中,我们学习了 React 中使用路由技术,以及如何使用 MyNavLink 去优化使用路由时的代码冗余的情况。这一节我们继续上一篇 React 路由进行一些补充1. Switch 解决相同路径问题首先我们看一段这样的代码<Route path="/hom
2021-09-26 09:00:00 400
原创 React 入门学习(十)-- React 路由
这篇文章是学习 React 中 React 路由的学习笔记在我们之前写的页面当中,用我们的惯用思维去思考的话,可能会需要写很多的页面,例如做一个 tab 栏,我们可能会想每个选项都要对应一个 HTML 文件,这样会很麻烦,甚至不友好,我们把这种称为 MPA 也叫多页面应用。1. SPA而为了减少这样的情况,我们还有另一种应用,叫做
2021-09-25 09:00:00 369
原创 React 入门学习(九)-- 消息订阅发布
这篇文章是学习 React 中 GitHub 搜索案例的学习笔记在昨天写的 Github 案例中,我们采用的是 axios 发送请求来获取数据,同时我们需要将数据从 Search 中传入给 App,再由 App 组件再将数据传递给 List 组件,这个过程会显得多此一举。同时我们要将 state 状态存放在 App 组件当中,但是这些 stat
2021-09-24 09:52:26 444
原创 React 入门学习(八)-- GitHub 搜索案例
大家好,我是小丞同学,一名大二的前端爱好者这篇文章是学习 React 中 GitHub 搜索案例的学习笔记非常感谢你的阅读,不对的地方欢迎指正愿你忠于自己,热爱生活引言本文主要介绍 React 学习中 Github 搜索案例,这个案例主要涉及到了 Axios 发送请求,数据渲染以及一些中间交替效果的实现个人感觉在做完 TodoList 案例之后,这个案例会很轻松,只是多加了一个 Loading 效果的实现思路,以及一些小细节的完善,感觉练练手还
2021-09-22 12:18:02 533
原创 React 入门学习(七)-- 脚手架配置代理
大家好,我是小丞同学,一名准大二的前端爱好者这篇文章是学习 React 中脚手架配置代理的学习笔记非常感谢你的阅读,不对的地方欢迎指正愿你忠于自己,热爱生活引言React 本身只关注于页面,并不包含发送 Ajax 请求的代码,所以一般都是集成第三方的包,或者自己封装的自己封装的话,比较麻烦,而且也可能考虑不全常用的有两个库,一个是JQuery,一个是 axiosJQuery 这个比较重,因为 Ajax 服务也只是它这个库里的一小块功能,它
2021-09-21 09:55:35 337
原创 React 入门学习(六)-- TodoList 案例
大家好,我是小丞同学,一名准大二的前端爱好者这篇文章是学习 React 练习中 TodoList 案例的操作笔记非常感谢你的阅读,不对的地方欢迎指正愿你忠于自己,热爱生活引言TodoList 案例在前端学习中挺重要的,从原生 JavaScript 的增删查改,到现在 React 的组件通信,都是一个不错的案例,这篇文章主要记录,还原一下通过 React 实现 TodoList 的全过程一、拆分组件首先第一步需要做的是将这个页面拆分成几个组件
2021-09-19 22:28:24 854
原创 React 入门学习(五)-- 认识脚手架
React专栏 已经全部更新于 GIthub大家好,我是小丞同学,这篇文章是学习 React 脚手架的学习笔记非常感谢你的阅读,不对的地方欢迎指正 ???? React专栏 已经全部更新于 GIthub 愿你生活明朗,万物可爱简介这篇文章主要围绕 React 中的脚手架,来解决一下几个问题灵魂三问:是什么?为什么?怎么办?什么是脚手架?为什么要用脚手架?怎么用脚手架????? 1. 什么是 React 脚手架?在我们的现实生活
2021-09-17 19:21:10 510
原创 React入门学习(四)-- diffing 算法
大家好,我是小丞同学,一名大二的前端爱好者这篇文章将尽力说明白 diff 算法 愿你忠于自己,热爱生活前言diff 算法是 React 提升渲染性能的一种优化算法,在 React 中有着很重要的地位,也不止于 React ,在 Vue 中也有 diff 算法,似乎没有差别。在最近的 React 学习中,学到了 diff 算法,感觉视频中的内容有点浅,对 diff 算法不够深入,因此想要深入的了解以下 diff 算法。于是在掘金,知乎,CSDN 等平台上,看了大量的博客,
2021-09-10 19:36:20 528
原创 React 入门(三) -- 生命周期 LifeCycle
React 入门(三) – 生命周期 LifeCycle大家好,我是小丞同学,这一篇是关于 React 的学习笔记,关于组件的生命周期非常感谢你的阅读,不对的地方欢迎指正愿你生活明朗,万物可爱引言在 React 中为我们提供了一些生命周期钩子函数,让我们能在 React 执行的重要阶段,在钩子函数中做一些事情。那么在 React 的生命周期中,有哪些钩子函数呢,我们来总结一下React 生命周期React 生命周期主要包括三个阶段:初始化阶段,更新
2021-09-07 14:59:02 637 5
原创 通俗易懂的 GIT 入门,这次一定能行!
大家好,我是小丞同学,一名大二的前端爱好者这篇文章将结合使用场景,带你轻松入门 GIT愿你忠于自己,热爱生活引言Git 作为目前最强大的代码管理工具,相信大家都很熟悉了。它在我们的日常工作中起着至关重要的作用,我们可以用它来实现多人开发。也可以用来方便我们自己,在我们坐车的时候,可以用手机看看自己刚刚上传的代码。这些都是不错的选择,下面我们就结合场景来学习一下 Git 的基本命令场景实战我们的第一个任务是:将代码提交到 Gitee / Github 远程仓库中?
2021-09-01 09:49:43 1278 16
原创 ⚡切图仔?你知道 V8 是如何执行 JS 代码的吗?
大家好,我是小丞同学,一名准大二的前端爱好者这篇文章将带你了解 V8 是如何执行 JS 代码的 愿你忠于自己,热爱生活引言源代码首先通过解析器解析成 AST ,然后 AST 再通过解释器解释成最终的字节码下面我们来聊聊解析器解析成 AST 的这个过程首先我们先了解一下什么是 AST???? 1. 生成 ASTAST 中文名叫抽象语法树,它是源代码语法结构的一种抽象表示它以树状的形式表现编程语言的语法结构,书上的每个节点都表示源代码中的一种结构下面我们来一个
2021-08-28 10:33:53 930 10
原创 为什么 CSS 动画比 JavaScript 高效?
大家好,我是小丞同学,一名准大二的前端爱好者 这篇文章将欢快的带你了解一下 CSS 和 JS 动画的差别愿你忠于自己,热爱生活引言讲到动画,当然是非常有意思的啦,你可以往上滑一下,看看上面的封面图,是不是相当的炫酷,以为我是代码写出来的吗?那当然不可能啊,我这么摸鱼,怎么会为了个封面图上号呢废话不多说,其实上面的动图用代码实现也不会很困难,这个图是用 canva 做出来的。本文主要讲以下这些内容浏览器渲染流程回流和重绘CSS 动画JS 动画两者对比
2021-08-25 13:56:32 7027 38
原创 新生代总结 JavaScript 运行机制解析
新生代总结 JavaScript 运行机制解析大家好,我是小丞同学,一名准大二的前端爱好者 这篇文章将带你一起学习理解 JavaScript 运行机制愿你忠于自己,热爱生活引言在一些面试中,我们或许会被问到这样的问题简述一下 JavaScript 的运行机制?你还有可能会被问这样简单的代码setTimeout(function () { console.log('定时器开始啦')});new Promise(function (r
2021-08-22 20:58:13 3439 39
原创 JS 继承的7种方法,你学会了吗?
JS 继承的7种方法,你学会了吗?大家好,我是小丞同学,本文主要写 JavaScript 中的 7 种继承方式,深入理解每种方式所存在的问题同时新的方式是如何解决问题的非常感谢你的阅读,不对的地方欢迎指正愿你生活明朗,万物可爱前言在上一篇文章中我们讲解了原型链的机制以及原型相关的一些属性,而与原型链息息相关的就是继承了,为什么这么说呢?在《JavaScript 高级程序设计》上,有这么一句话“实现继承是 ECMAScript 唯一
2021-08-20 08:01:18 645 6
原创 三张图轻松KO⚡ JS 原型和原型链
三张图轻松KO⚡ JS 原型和原型链大家好,我是小丞同学,这一篇是 JS 高程精读系列的第 n 篇文章,主要解释 JS 中的原型和原型链 非常感谢你的阅读,不对的地方欢迎指正 愿你生活明朗,万物可爱引言原型和原型链据说是面试常考的东西(没面试过,不大清楚),对于初学者来说有一定的难度,但是其实它也非常的简单,几个概念理解好了就没什么问题了,我们先从一个例子出发,然后再引出相关的知识点,下面我们先来看一个例子先定义一个类,添加一些属性和方法class S
2021-08-18 07:49:15 621 7
原创 【深扒】深入理解 JavaScript 中的异步编程
大家好,我是小丞同学,本文将会带你理解和感受 Generator 函数的异步应用引言我们先引出一个非常常见的场景:对服务器端返回的数据进行操作与服务器端交互的过程是一个异步操作如果按照正常的代码编写的话,你可能会写出这样的代码我也不知道打的什么,大概意思就是异步请求结果返回赋值给 data 然后输出,let data = ajax("http://127.0.0.1",ab) //随便写的console.log(data)虽然整个思路看起来没什么毛病,对吧。但是它就是不行的,获取数据..
2021-08-15 13:53:22 3065 8
原创 【深扒】深入理解 JavaScript 中的生成器
大家好,我是小丞同学,本文将会带你理解 ES6 中的生成器。写在前面在上篇文章中,我们深入了理解了迭代器的原理和作用,这一篇我们来深扒与迭代器息息相关的生成器。关于生成器有这样的描述红宝书:生成器是 ES6 新增的一个极为灵活的结构,拥有在一个函数块内暂停和恢复代码执行的能力阮一峰老师:Generator 函数是 ES6 提供的一种异步编程解决方案从上面的两段话中,我们可以知道生成器有着至少两个作用:打破完整运行,拥有暂停和启动的能力解决异步操作下面我们来看看生成器是如何实
2021-08-13 08:16:31 1783 14
原创 【深扒】 JavaScript 中的迭代器
读懂 JavaScript 中的迭代器大家好,我是小丞同学,本文将会带你深入理解 ES6 中的迭代器。发现问题在 ES6 中提出迭代器模式之前,传统迭代存在着怎样的问题?为什么要新增迭代器呢?我们先来看几个例子let arr = ['小', '丞', '呀']这是一个简单的数组,如果要获取它的每一项数据,我们可以采用 for 循环,当然也可以采用 forEach 循环,很酷关于 forEach 循环在之前的文章有解释,原文连接当纯这样还没什么问题我们在看下面代码
2021-08-11 07:25:23 1576 15
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人