- 博客(146)
- 收藏
- 关注
RSS订阅原创 JavaScript中闭包的简单介绍
1.什么是闭包《JavaScript高级程序设计》这样描述：闭包是指有权访问另一个函数作用域中的变量的函数；最常见的闭包结构如下function aaa(){ var name = "xxx" return function bbb(){ alert(name); }}如上代码，bbb函数内可以访问aaa函数作用域内的变量2.闭包的作用正常函数执行完毕后,...
2020-09-10 10:17:00
104
原创 第一节：webpack打包、压缩及兼容性处理
一.前言当我们使用vue-cli3创建项目时，会自动生成相应的webpack配置，不过明白webpack的原理和基本设置方法对我们局部修改某些webpack配置还是很有必要的；二.为什么需要构建工具？转换ES6语法；转换JSX；CSS前缀补全/预处理器；压缩混淆；图片压缩；官方文档三.Webpack五个核心概念1.入口(Entry)入口(Entry)指示webpack...
2020-09-04 10:36:00
127
1
原创 第二节：webpack性能优化
一.概述1.webpack性能优化开发环境性能优化生产环境性能优化2.开发环境性能优化优化webpack的打包构建速度HRM优化代码调试source-map3.生产环境性能优化优化打包构建速度oneOfbabel缓存多进程打包优化代码运行的性能缓存(hash-chunkhash-contenthash)tree shackingco...
2020-09-04 09:56:00
105
原创 第三节：webpack基本参数配置
一.Entry参数配置1.环境搭建首先文件目录如下：add.js文件：function add (a, b){ return a + b;}export default add;count.js文件：function count(x, y){ return x + y;}export default count;index.js文件：import add f...
2020-09-03 22:58:00
109
原创 async与await输出顺序的思考
asyncasync其实就是对Generator的封装，只不过async可以自动执行next()。async必须等到里面所有的await执行完，async才开始return，返回的Promise状态才改变。除非遇到return和错误。async默认返回一个Promise，如果return不是一个Promise对象，就会被转为立即resolve的Promise，可以在then函数...
2020-08-30 00:54:00
42
原创 跨域及九种解决方法
一.同源策略如下：URL说明是否允许通信http://www.a.com/a.js http://www.a.com/b.js同一域名下允许http://www.a.com/lab/a.js http://www.a.com/script/b.js同一域名下不同文件夹允许http://www.a.com:8000/a.js http://www.a.co...
2020-08-29 15:58:00
24
原创 解决移动端1px边框问题的几种方法
解决移动端1px边框问题的几种方法本文介绍了解决移动端1px边框问题的5种方法。当然了，在这之前先整理了与这些方法相关的知识：物理像素、设备独立像素、设备像素比和viewport。物理像素、设备独立像素和设备像素比在CSS中我们一般使用px作为单位，需要注意的是，CSS样式里面的px和物理像素并不是相等的。CSS中的像素只是一个抽象的单位，在不同的设备或不同的环境中，CSS中的1px所代表...
2020-08-29 12:50:00
38
原创 Max-age和Expires的区别
ExpiresExpires是HTTP/1.0中的，它比max-age要麻烦点。Expires指定的时间分下面二种，这个主要考虑到apache中设置是A还是M。1.相对文件的最后访问时间(Atime)当Apache使用A时间来做Expires时.这样设置时，他就和max-age的值相等，因为max-age是相对文件的请求时间(Atime)。例如：ExpiresByType text/ht...
2020-08-29 12:45:00
90
原创 移动端300ms延迟
1. 300ms延迟的产生缘由移动端浏览器的默认显示宽度是980px(不同机型各异，但相差不大)，而不是屏幕的宽度(320px或其他)。为了对早期普通网页更好的体验，iphone设计了双击放大显示的功能--这就是300ms延迟的来源：如果用户一次点击后300ms内没有其他操作，则认为是个单击行为；否则为双击放大行为。2. 点透行为假设有两个层级，A和B；A在上面，B在下面。 如果A监听to...
2020-08-29 12:43:00
32
原创 eslint配置项
配置文件如果想保留eslint的语法检测，那就把不符合自己习惯的规则去掉吧。配置文件在项目根目录里，文件名以 .eslintrc.* 为名。module.exports = { root: true, parser: 'babel-eslint', parserOptions: { //设置"script"(默认)或"module"如果你的代码是在ECMAScript中...
2020-08-29 12:37:00
26
原创 新版vscode配置eslint自动格式化代码
旧版配置{ //配置eslint "eslint.autoFixOnSave": true, // 启用保存时自动修复,默认只支持.js文件 "eslint.validate": [ "javascript", // 用eslint的规则检测js文件 { "language": "vue", // 检测vue文件 "autoFix": ...
2020-08-23 13:00:00
43
原创 vue-cli项目部署到Gitee Page
为什么不选择Github Page？原因很简单，因为Gitee不用FQ速度快！1.创建仓库这步比较简单，就不做演示了；2.添加vue.config.js文件由于使用vue-cli3创建的项目隐藏了webpack的配置，所以需要该文件来修改部分的webpack配置。文件内容如下：// vue.config.jsmodule.exports = { publicPath: pro...
2020-08-20 01:29:00
39
原创 Element-UI参数与注意事项
详细内容，见官方文档：element-ui文档1.布局置顶：标签内属性(Attributes)的使用方式为：<el-row :gutter = "6">；<el-button type="primary">；分栏偏移：<el-row :gutter="20"> <el-col :span="6" ><div...
2020-08-18 00:19:00
186
原创 HTML与CSS布局技巧
一、使用$标识原生DOM元素let $white = document.querySelector('.white')二、要使用top，left等定位属性要先将该元素设置position属性，absolute或者relative等三、十种选择器三类基础选择器：ID选择器；class选择器；标签选择器，tag；以下为延伸的选择器：第一种：空格.container div{...
2020-08-17 19:08:00
103
原创 Error: Cannot find module 'Y:\@vue\cli-service\bin\vue-cli-service.js'
使用vue-cli创建项目后，执行命令：npm run serve运行项目，出现如下错误：原因很简单，npm无法找到图中框出的文件。那么，为什么会无法找到呢？可以看到，该项目的顶层目录名字为dailyHTML&CSS，问题就处在这个文件夹名字上，将其中的&去掉就解决了这个问题：深层原因这里不深究，有兴趣可自行探索。不过给出了我们一个提示：文件夹命名尽量不要使用特殊...
2020-08-16 17:58:00
70
原创 Git应用开发详解
第一讲：Git分区，配置与日志第二讲：Git删除、修改、撤销操作第三讲：本地分支的重要操作第四讲：版本回退的三种方式与stash第五讲：远程仓库Github与Git图形化界面第六讲：Git协作与Git pull常见问题第七讲：Git refspec与远程分支的重要操作第八讲：Git标签、别名与Git gc第九讲：Git cherry-pick与Git rebase第十讲：Git...
2020-04-21 15:52:00
32
原创 Git应用详解第十一讲（完结）：Git工作流Gitflow
说明：本文转载于：https://github.com/xirong/my-git个人在学习Git工作流的过程中，从原有的 SVN 模式很难完全理解Git的协作模式，直到有一天我看到了下面的文章，好多遗留在心中的困惑迎刃而解：我们以使用SVN的工作流来使用Git有什么不妥？Git方便的branch在哪里，团队多人如何协作？冲突了怎么办？如何进行发布控制？经典的master-发布、...
2020-04-21 11:19:00
28
原创 Git应用详解第十讲：Git子库：submodule与subtree
前言前情提要：Git应用详解第九讲：Git cherry-pick与Git rebase一个中大型项目往往会依赖几个模块，git提供了子库的概念。可以将这些子模块存放在不同的仓库中，通过submodule或subtree实现仓库的嵌套。本讲为Git应用详解的倒数第二讲，胜利离我们不远了！一、submodulesubmodule：子模块的意思，表示将一个版本库作为子库引入到另一个版本库...
2020-04-20 12:10:21
2793
2
原创 Git应用详解第九讲：Git cherry-pick与Git rebase
前言前情提要：Git应用详解第八讲：Git标签、别名与Git gc这一节主要介绍git cherry-pick与git rebase的原理及使用。一、Git cherry-pickGit cherry-pick的作用为移植提交。比如在dev分支错误地进行了两次提交2nd和3rd，如果想要将这两次提交移植到master分支上。采用先删除再添加的方法将会很繁琐，而使用cherry-pick...
2020-04-19 19:09:30
1914
2
原创 Git应用详解第八讲：Git标签、别名与Git gc
文章目录前言一、`Git`标签(`tag`)1.标签的实质两类标签**查看标签文件**2.创建标签`git tag ``git tag -a -m '注释'`3.查看标签`git tag``git show `4.查找标签`git tag -l `5.将标签推送到远程`git push origin ``git push origin --tag`6.删除远程标签`git push origin...
2020-04-18 18:08:51
778
1
原创 Git应用详解第六讲：Git协作与Git pull常见问题
文章目录前言一、`git`协作方式1.常见开发模式2.`SVN`方式（典型模型）3.模拟多人协作4.协作的本质二、`git pull`1.不发生合并冲突2.`git pull`同源合并冲突错误原因解决方案3.`git pull`不同源合并冲突错误原因解决方案实战演示前言前情提要：Git应用详解第五讲：远程仓库Github与Git图形化界面git除了可以很好地管理个人项目外，最大的一个用处...
2020-04-16 16:24:08
338
原创 Git应用详解第五讲：远程仓库Github与Git图形化界面
文章目录前言一、`Git`裸库二、本地仓库与远程版本库1.`git push`与`git pull``git push`的三种情况`git pull`实质2.`Github`和`Gitlab``Github``Gitlab`三、本地仓库 `->` 远程版本库1.建立联系`HTTP/HTTPS`协议`SSH`协议生成秘钥对部署公钥添加账户`SSH`2.推送代码3.查看远程仓库地址4.修改远程仓...
2020-04-15 23:38:01
754
1
原创 Git应用详解第四讲：版本回退的三种方式与stash
文章目录前言一、版本回退Ⅰ.`git reset`1.参数`--mixed``--soft``--hard`2.写法`git reset --hard HEAD^``git reset --hard HEAD^^``git reset --hard HEAD~n``git reset --hard commit_id`Ⅱ.`git revert`1.参数`-e``--no-edit``-n`2....
2020-04-14 19:12:07
780
原创 Git应用详解第三讲：本地分支的重要操作
文章目录前言一、分支概述二、查看本地分支1.`git branch`2.`git branch -a`3.`git branch -v`4.`git branch -r`5.`git branch -av`6.`git branch -vv`三、创建本地分支1.`git branch `2.`git branch -b `四、切换本地分支1.`git checkout `2.`git checko...
2020-04-13 21:53:23
471
原创 Git应用详解第二讲：Git删除、修改、撤销操作
文章目录前言一、删除文件1.`git rm `2.`rm `二、重命名文件1.`git mv `2.`mv `三、比较文件1.本地文件 `<->` 本地文件`diff file_a file_b`2.工作区 `<-` 暂存区`git diff`3.工作区 `<-` 版本库`git diff commit_id``git diff HEAD`4.暂存区 `<-` ...
2020-04-12 15:40:49
549
原创 Git应用详解第一讲：Git分区，配置与日志
前言曾经听到过这样一句话：不会git就不要敲代码了。细细品味确实有其中的道理，可能是当事人代码被强行覆盖后的叹息吧！因此，为了避免这种情况，接下来我们就一起来好好学习git的相关知识吧！不怕你不会，就怕你不看！一、git的三个分区：工作区（working directory）暂存区（stage）版本库它们之间的关系为：通过git status查看git状态时，红色的文件表示...
2020-04-11 13:27:43
501
原创 一文摸透从输入URL到页面渲染的过程
一文摸透从输入URL到页面渲染的过程从输入URL到页面渲染需要Chrome浏览器的多个进程配合，所以我们先来谈谈现阶段Chrome浏览器的多进程架构。一、Chrome架构目前Chrome采用的是多进程的架构模式，可分为主要的五类进程，分别是：浏览器（Browser）主进程、 GPU 进程、网络（NetWork）进程、多个渲染进程和多个插件进程；浏览器进程。主要负责界面显示、用户交互、子...
2020-04-11 11:20:38
586
原创 从宏观到细节为你讲解前端性能优化
一、资源的合并和压缩web前端应用的开发与部署过程：输入url到页面显示出来的过程：请求过程中一些潜在的性能优化点：dns是否可以通过缓存减少dns查询时间？网络请求的过程如何走最近的网络环境？相同的静态资源是否可以缓存？能否减少http请求的大小和次数？能否进行服务端渲染？**总结：**深入理解http请求的过程是前端性能优化的核心。优化核心减少http请求数量；...
2020-04-10 23:18:32
1287
3
原创 使用Gitee搭建个人图床
使用Gitee搭建个人图床一、前言搭建个人的图床可以更加方便地管理个人图片，虽然Github也可以实现个人图床的搭建，但是，Github毕竟是外网，访问速度慢且不稳定。因此采用Gitee来搭建图床是个好选择。二、创建仓库第一步，在Gitee上创建一个仓库，用于存放图片：三、建立联系创建一个本地文件夹与刚才创建的远程仓库建立联系，可以采用以下两种方式：**第一种：**将新创建的远...
2020-04-10 20:20:00
474
原创 JavaScript实现哈希表
JavaScript实现哈希表一、哈希表简介1.1.认识哈希表哈希表通常是基于数组实现的，但是相对于数组，它存在更多优势：哈希表可以提供非常快速的插入-删除-查找操作；无论多少数据，插入和删除值都只需要非常短的时间，即O(1)的时间级。实际上，只需要几个机器指令即可完成；哈希表的速度比树还要快，基本可以瞬间查找到想要的元素。但是相对于树来说编码要简单得多。哈希表同样存在不足之处...
2020-04-06 10:24:00
15
原创 JavaScript数据结构与算法博客目录
一、JavaScript实现栈结构(Stack)二、JavaScript实现队列结构(Queue)三、JavaScript实现集合与字典四、JavaScript实现哈希表五、JavaScript实现单向链表)六、JavaScript实现双向链表七、JavaScript实现树结构(一)八、JavaScript实现树结构(二)九、图解红黑树十、JavaScript实现图结构十一、...
2020-04-05 12:48:00
11
原创 JavaScript实现图结构
JavaScript实现图结构一、图论1.1.图的简介什么是图？图结构是一种与树结构有些相似的数据结构；图论是数学的一个分支，并且，在数学中，树是图的一种；图论以图为研究对象，研究顶点和边组成的图形的数学理论和方法；主要的研究目的为：事物之间的联系，顶点代表事物，边代表两个事物间的关系；图的特点：一组顶点：通常用 V (Vertex)表示顶点的集合；一组边：通常用 E ...
2020-04-05 12:36:00
16
原创 详解HTTP协议
一、HTTP简介1.HTTPHTTP:超文本传输协议，是一种通信协议；允许超文本标记文档从Web服务器传送到客户端的浏览器中。简单：传输html文件的协议。Web：是一种基于超文本和HTML的、全球性的、动态交互的、跨平台的分布式图形信息系统。http是无状态协议，这保证了它的高效。Cookie和Section的出现使http在保持高效的情况下，能够记住状态；2.URI与URL...
2020-03-20 18:19:00
79
原创 JavaScript实现排序算法
JavaScript实现排序算法一、大O表示法大O表示法：在计算机中采用粗略的度量来描述计算机算法的效率，这种方法被称为“大O”表示法在数据项个数发生改变时，算法的效率也会跟着改变。所以说算法A比算法B快两倍，这样的比较是没有意义的。因此我们通常使用算法的速度随着数据量的变化会如何变化的方式来表示算法的效率，大O表示法就是方式之一。常见的大O表示形式符号名称O...
2020-03-20 09:27:00
13
原创 JavaScript实现集合与字典
JavaScript实现集合与字典一、集合结构1.1.简介集合比较常见的实现方式是哈希表，这里使用JavaScript的Object类进行封装。集合通常是由一组无序的、不能重复的元素构成。数学中常指的集合中的元素是可以重复的，但是计算机中集合的元素不能重复。集合是特殊的数组：特殊之处在于里面的元素没有顺序，也不能重复。没有顺序意味着不能通过下标值进行访问，不能重复意味着相同...
2020-03-12 18:15:00
14
原创 JavaScript实现树结构（二）
JavaScript实现树结构(二)一、二叉搜索树的封装二叉树搜索树的基本属性：如图所示：二叉搜索树有四个最基本的属性：指向节点的根(root)，节点中的键(key)、左指针(right)、右指针(right)。所以，二叉搜索树中除了定义root属性外，还应定义一个节点内部类，里面包含每个节点中的left、right和key三个属性：//封装二叉搜索树 function Bi...
2020-03-11 20:08:00
19
原创 图解红黑树
图解红黑树一、红黑树的五条规则红黑树除了符合二叉搜索树的基本规则外，还添加了以下特性：规则1：节点是红色或黑色的；规则2：根节点是黑色的；规则3：每个叶子节点都是黑色的空节点(NIL节点)；规则4：每个红色节点的两个子节点都是黑色的(从每个叶子到根的所有路径上不可能有两个连续的红色节点)；规则5：从任一节点到其每个叶子节点的所有路径都包含相同数目的黑色节点；红黑树的相对平衡...
2020-03-10 19:42:00
17
原创 JavaScript实现树结构（一）
JavaScript实现树结构(一)一、树结构简介1.1.简单了解树结构什么是树？真实的树：树的特点：树一般都有一个根，连接着根的是树干；树干会发生分叉，形成许多树枝，树枝会继续分化成更小的树枝；树枝的最后是叶子；现实生活中很多结构都是树的抽象，模拟的树结构相当于旋转180°的树。树结构对比于数组/链表/哈希表有哪些优势呢：数组：优点：可以通过下标值访问，效率高...
2020-03-09 08:15:00
16
原创 JavaScript实现双向链表
JavaScript实现双向链表一、双向链表简介双向链表：既可以从头遍历到尾，又可以从尾遍历到头。也就是说链表连接的过程是双向的，它的实现原理是：一个节点既有向前连接的引用，也有一个向后连接的引用。双向链表的缺点：每次在插入或删除某个节点时，都需要处理四个引用，而不是两个，实现起来会困难些；相对于单向链表，所占内存空间更大一些；但是，相对于双向链表的便利性而言，这些缺点微不足道。...
2020-03-08 09:58:00
18
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人