_Kay_
码龄8年
关注
提问 私信
  • 博客：370,431
    370,431
    总访问量
  • 104
    原创
  • 1,679,212
    排名
  • 126
    粉丝
  • 2
    铁粉

个人简介：欢迎关注我的公众号"独望天涯路"

IP属地以运营商信息为准，境内显示到省（区、市），境外显示到国家（地区）
IP 属地：广东省
  • 加入CSDN时间： 2017-05-31
博客简介：

brokenkay的博客

查看详细资料
个人成就
  • 获得238次点赞
  • 内容获得109次评论
  • 获得1,106次收藏
  • 代码片获得1,126次分享
  • 博客总排名1,679,212名
创作历程
  • 1篇
    2022年
  • 30篇
    2021年
  • 54篇
    2020年
  • 13篇
    2019年
  • 1篇
    2018年
  • 5篇
    2017年
成就勋章
TA的专栏
  • 计算机基础
    9篇
  • 商业知识
  • 代码人生
    11篇
  • nodejs
    7篇
  • jquery源码
    7篇
  • git
    1篇
  • ionic
    3篇
  • 前端
    61篇
  • PHP
    2篇
  • 微信小程序
    2篇
兴趣领域 设置
  • 前端
    webpack前端框架
  • 后端
    node.js
  • 移动开发
    flutter
创作活动更多

王者杯·14天创作挑战营·第2期

这是一个以写作博客为目的的创作活动，旨在鼓励码龄大于4年的博主们挖掘自己的创作潜能，展现自己的写作才华。如果你是一位热爱写作的、想要展现自己创作才华的小伙伴，那么，快来参加吧！我们一起发掘写作的魅力，书写出属于我们的故事。 注： 1、参赛者可以进入活动群进行交流、分享创作心得，互相鼓励与支持（开卷），答疑及活动群请见https://bbs.csdn.net/topics/619735097 2、文章质量分查询：https://www.csdn.net/qc 我们诚挚邀请你们参加为期14天的创作挑战赛！

73人参与 去参加
  • 最近
  • 文章
  • 代码仓
  • 资源
  • 问答
  • 帖子
  • 视频
  • 课程
  • 关注/订阅/互动
  • 收藏
搜TA的内容
搜索 取消

算法专题之矩阵

前言矩阵相关的算法在互联网世界有着广泛的应用,比如图片的像素修改(上一小结介绍过)、获取地图路径方案等.在数学中,一个矩阵说穿了就是一个二维数组.矩阵相关的基础算法也都是基于二维数组的基础上完成各类数据操作.本小节列举了前端面试中高频出现的leetcode真题,通过题目的思路讲解和代码实现系统的学习矩阵的基础知识.从宏观上建立起基本的认知,从而加深应用场景下使用矩阵解决实际问题的理解.真题图片旋转一组由 N × N 矩阵表示的图像,其中每个像素点的大小为 4 字节.请你设计一种算法,将图像旋转9
原创
发布博客 2022.01.21 ·
1289 阅读 ·
0 点赞 ·
0 评论 ·
2 收藏

js操作像素实现图片编辑

基础概念众所周知,图片是由一个个像素点组成.每一个像素点包含四个值,决定了渲染出来的状态.这四个值为rgba(red, green, blue, alpha).前三个值是红绿蓝,值的大小范围从0到255,或者从0%到100%之间.第四个值alpha,规定了色彩的透明度,它的范围为0到1之间.其中0代表完全透明,1代表完全可见.红绿蓝是色彩中的三元色,通过设置这三种颜色所占的比重,可以变幻出其他所有颜色.比如某个标签的文字想设置为红色,就可以通过css设置rgba值(代码如下).span {
原创
发布博客 2021.12.26 ·
3236 阅读 ·
1 点赞 ·
0 评论 ·
12 收藏

算法专题之二叉树

前言树型数据结构广泛存在于现实世界中,比如家族族谱、企业职能架构等,它是一类在计算机领域被广泛应用的非线性数据结构.二叉树是树型数据中最常用的一类,本文从前端角度以js语法构建和操作二叉树的相关知识.基础概念观察上图,二叉树的数据结构如图所示.树中每一个圆圈代表一个节点,其中根部的节点A称为根节点B和C是A的子节点.子节点的个数称为度,A节点的度为2,D节点的度数为1.度为0的节点称之为叶子节点,比如图中的 H、E、F、G 都属于叶子节点节点的深度: 从根节点到当前节点的唯一路径上的节点总
原创
发布博客 2021.12.12 ·
901 阅读 ·
0 点赞 ·
0 评论 ·
0 收藏

算法专题之链表

前言链表是一种物理存储结构上非连续的数据结构,数据的逻辑顺序是通过链表中的指针链接次序实现相互勾连.链表相对数组而言有很多不同之处,在特定场景下能发挥独特的优势.例如链表的插入和删除操作比数组效率高,数组需要改变其他元素的位置,而链表只需要改变指针的指向.javascript中没有直接生成链表的api,但仍然可以利用语言本身的特性实现一条链表并完成其他操作.链表的实现链表的数据结构如下图,每一个节点都包含一条数据和指向下一个节点的索引.如果获取了链表中的某一个节点,比如第一个节点,那么就可以获
原创
发布博客 2021.11.20 ·
693 阅读 ·
0 点赞 ·
0 评论 ·
0 收藏

vue3简化vuex的调用

前言vuex作为跨组件通信的利器,在开发复杂应用过程中必不可少.但vuex在组件中渲染状态和调用action和mutation的语法过于繁琐,严重影响开发效率.本文借助vue3提出的hook思想对vuex进行封装,使其使用起来更加快捷高效.从而使前端同学能更加关注业务本身,而少写样板代码(源代码贴在了文尾).vuex的基础使用配置vuex 4相当于3版本没有多大的区别,4版本增加了ts的支持和Composition Api.配置之初,在项目根目录下执行命令安装vuex.yarn add vue
原创
发布博客 2021.11.07 ·
1252 阅读 ·
2 点赞 ·
0 评论 ·
3 收藏

前端基础排序算法

前言前端工程师开发常规项目时,很少会涉及排序算法的编写.即使碰到了需要进行排序的需求,使用js提供的array.sort()也能轻松搞定,很少需要编写底层的排序代码.但有些业务场景应用了特殊的数据结构,比如需要实现链表的排序,堆的排序,此时就使用到了排序算法的思想.另外前端面试中算法相关题目偶尔出现在笔试里,要求面试者能够手写.本文依次整理了冒泡排序、快速排序、插入排序、选择排序、奇偶排序以及二分查找法,这些算法的实现难度都不大,花些时间即能理解.冒泡排序冒泡排序会重复地遍历要排序的数列,依次比较
原创
发布博客 2021.10.16 ·
268 阅读 ·
0 点赞 ·
0 评论 ·
1 收藏

企业项目定制脚手架

前言脚手架已经成为了前端日常工作中必不可少的开发利器,通过它不仅能够减少机械的重复工作,而且还能有效的组织和管理企业的项目模板.企业内部涵盖的前端项目类型不一,比如针对不同平台有pc端、h5、小程序等.不同框架有react和vue技术栈.业务类型又可以将项目区分为后台管理系统、门户网站以及数据大屏等.这么多不同类型的项目,它们采用的技术栈组合也会随着相应的场景搭配.后台管理系统通常会采用vue+Element UI + vuex + ts 搭建项目.手机端项目除了基础的设置,它还需要额外配置不同屏幕下
原创
发布博客 2021.09.28 ·
626 阅读 ·
1 点赞 ·
0 评论 ·
5 收藏

祖传项目封装组件库

前言随着企业内部开发的项目逐渐增多,组件的维护工作变得愈益困难.前端同学通常会面临的困境之一.开发完了A项目,在A项目下封装了大量的公共组件.当B项目启动时,由于设计风格相似,以至于A项目的很多组件可以直接复制到B项目下使用.A和B项目开发完毕,后续的C和D项目又启动.每当有新项目启动时,手工复制就要重复一遍,这样的工作不仅乏味而且低效.如果仅仅只是在新项目启动时,将旧项目的组件代码复制一遍还能勉强接受.倘若有一天,产品经理要求D项目下的某个公共组件做一下样式的调整,并且A、B和C项目下的对应的公
原创
发布博客 2021.09.12 ·
652 阅读 ·
1 点赞 ·
0 评论 ·
5 收藏

手写mini-webpack

前言前面两个小节已经系统介绍了webpack中两个核心概念:plugin和loader.今天将plugin和loader串联起来,从0手写一个基于插件体系搭建的程序架构,完成一个mini模仿版的webpack.目标需求:实现js的模块打包搭建plugin体系,允许接入开发者自定义plugin搭建loader体系,允许接入开发者自定义loadermini-webpack有了plugin和loader的赋能,开发者就可以自己编写插件直接对打包的中间过程进行干预.除了实现最基本的js编译,我们还
原创
发布博客 2021.08.28 ·
202 阅读 ·
0 点赞 ·
0 评论 ·
0 收藏

webpack之plugin详解

基本概念plugin(插件)是webpack的支柱功能,webpack整体的程序架构也是基于插件系统之上搭建的,plugin的目的在于解决loader无法实现的其他功能.plugin使用方式如下面代码.通常我们需要集成某款plugin时,会先通过npm安装到本地,然后在配置文件(webpack.config.js)的头部引入,在plugins那一栏使用new关键字生成插件的实例注入到webpack.webpack注入了plugin之后,那么在webpack后续构建的某个时间节点就会触发plugin定义
原创
发布博客 2021.08.15 ·
1568 阅读 ·
2 点赞 ·
0 评论 ·
5 收藏

webpack之loader详解

基础概念webpack是一款强大的模块打包工具,它可以引入配置文件完成前端高度定制化的构建工作.webpack默认只能理解JavaScript和JSON文件,但实际工作中各种需求层出不穷,文件类型也多种多样.比如.vue、.ts、图片、.css等,这就需要loader增强webpack处理文件的能力.在webpack的配置文件中,我们经常会看到如下设置.module.exports = { ... module: { rules: [ { t
原创
发布博客 2021.08.06 ·
970 阅读 ·
0 点赞 ·
0 评论 ·
5 收藏

一文弄懂区块链技术原理

前言近期由于工作需要,于是对区块链相关技术展开了大量的研究和学习.本文将以开发者的角度,对整个区块链行业技术的发展做一次全面的总结和归纳.文章宗旨是为了帮助大家理解区块链技术出现的目的、能够解决什么问题还有数字货币的意义与价值.另外文章后半部分会探讨一下区块链快速发展的今天,开发者群体能做哪些事情.如今市面上新型的数字货币如雨后春笋层出不穷,其中以诈骗圈钱为目的空气币也不少.只有深入了解了数字货币的底层逻辑,才能看清楚它想要达到的目的,谨防上当受骗.区块链技术有一次听外行的朋友提问:“如果区块链技
原创
发布博客 2021.07.20 ·
7731 阅读 ·
5 点赞 ·
3 评论 ·
31 收藏

vue轻松实现虚拟滚动

前言移动端网页的日常开发中,偶尔会包含一些渲染长列表的场景.比如某旅游网站需要完全展示出全国的城市列表,再有将所有通讯录的姓名按照A,B,C...首字母依次排序展示.长列表的数量一般在几百条范围内不会出现意外的效果,浏览器本身足以支撑.可一旦数量级达到上千,页面渲染过程会出现明显的卡顿.数量突破上万甚至十几万时,网页可能直接崩溃了.为了解决长列表造成的渲染压力,业界出现了相应的应对技术,即长列表的虚拟滚动.虚拟滚动的本质,不管页面如何滑动,HTML 文档只渲染当前屏幕视口展现出来的少量Dom元素.
原创
发布博客 2021.07.08 ·
9054 阅读 ·
12 点赞 ·
2 评论 ·
81 收藏

react搭建websocket通信架构

前言随着跨端技术的发展,前端开发职能不再局限于浏览器,而是具备了很多客户端开发的能力,比如桌面应用框架Electorn,移动App框架React native.一般而言,前端同学对http协议非常熟悉,在平时的工作中使用http与后端通信居多.但在原生客户端领域,比如Java语言开发的安卓应用,与后端通信的方式大多采用socket.众所周知,http连接是一种短连接,即客户端向服务器端发送一次请求,服务器端响应后连接即会断掉.而socket连接是一种长连接,理论上客户端和服务器端一旦建立起连接将不会主
原创
发布博客 2021.06.27 ·
2628 阅读 ·
0 点赞 ·
1 评论 ·
9 收藏

Electron应用申请管理员权限

前言Electron是一款使用 JavaScript, HTML 和 CSS 等 Web 技术创建原生程序的框架,它内部集成了Chromium 和 Node.js.前端工程师通过Electron相关技术,可以开发基于Windows、Linux以及Mac系统的客户端应用,这些能力拓展了前端所能触摸的边界,释放了更大的想象空间.如果客户端应用仅仅局限于页面内容的展现和操作,通过web相关技术就可以实现.但由于Electron集成了Node.js,这便使开发的应用具备调用操作系统级别服务的能力.Elect
原创
发布博客 2021.06.13 ·
4883 阅读 ·
2 点赞 ·
1 评论 ·
6 收藏

vue引入iconfont的优雅实践

前言本文撰写的初衷是为了向组内成员推行使用svg sprites的方式管理项目的图标,由于实际工作中很多项目仍然采用font class的方式,这样不自觉带来一个痛点.当项目一期开发完毕后,过段时间进入到项目二期。新增的开发需求不可避免的会增加新的图标,而font class需要全量打包图标的字体文件.哪怕新需求只添加了一个图标,而前端同学却要将旧图标和新图标融合后重新打包生成一次字体文件,这样的结果让人无法接受.svg sprites能完美的解决这一问题.整体思路是先将项目中每一个图标都生成一个s
原创
发布博客 2021.06.06 ·
1966 阅读 ·
2 点赞 ·
4 评论 ·
9 收藏

从零实现js开发Linux图形界面程序

前言近期工作上收到开发需求,公司欲大肆出售运行在特殊场景下的服务器硬件(基于Linux操作系统),前端工程师需要配合开发Linux系统下的图形化应用程序一起交付.最终需要的应用程序通过调用硬件工程师编写的shell脚本直接获取机器当前运算数据和相关参数,然后渲染界面提供给用户查看.整个过程由前端与硬件工程师对接,不需要后端参与.由于之前拥有使用Electron在windows下开发客户端软件的经验,这一次仍然选择Electron作为技术方案实现开发目标.Electron是一个使用 JavaScrip
原创
发布博客 2021.05.30 ·
2383 阅读 ·
3 点赞 ·
11 评论 ·
21 收藏

一文弄懂vuex源码

前言vuex作为一款强有力的状态管理工具被广泛应用于实际工作当中,通过学习vuex的源码可以帮助我们解决藏于心中很久的困惑.比如vuex的全局状态存放到了哪个地方?为什么修改store里面的状态,页面也会同步更新?action、mutation它们是如何协作修改状态的?为什么action里面建议写异步操作,而mutation定义成同步?很多实际使用过vuex的同学相信心中会存在这些疑问.本文将摒弃从头到尾直述源码的方式,从提出问题再结合场景去研究源码的实现过程,从而将上述疑问一一解答.核心原理首先
原创
发布博客 2021.05.17 ·
561 阅读 ·
2 点赞 ·
2 评论 ·
2 收藏

浅显易懂的vue-router源码解析（二）

next实现原理全局前置守卫router.beforeEach在上面已经介绍过,我们这次主要想要研究一下函数里面的next是如何实现的(代码如下).next()函数如果什么都不传表示放行直接进入下一个导航钩子.如果next里面填入的是一个对象,对象里面只包含path属性时,导航会push到该路径.对象要是除了path外,还有存在replace:true,那么导航会重定向到path路径.最后next(false)传递的是一个false或者Error实例,那么导航就会终止本次跳转操作,接下来
原创
发布博客 2021.04.25 ·
743 阅读 ·
2 点赞 ·
0 评论 ·
2 收藏

浅显易懂的vue-router源码解析(一)

前言在正式进入vue-router之前,我们先从框架的思维跳出来,仔细思考一下前端路由的实现原理,观察如下案例.<body> <a onclick="jump('/a')">A</a> <a onclick="jump('/b')">B</a> <a onclick="jump('/c')">C</a> <div id="app"> </div
原创
发布博客 2021.04.17 ·
1374 阅读 ·
6 点赞 ·
5 评论 ·
25 收藏
加载更多