- 博客(32)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 在react中使用decorator遇到的问题
如果package.json 里面还没有 babel 配置，需要先执行npm run eject。如果安装了sass,还是报这个错误，删掉node_modules文件夹；b.在项目根目录新建jsconfig.json，添加代码。
2022-11-24 19:29:24
376
原创 深度优先与广度优先
深度优先遍历简称DFS（Depth First Search），广度优先遍历简称BFS（Breadth First Search），它们是遍历图当中所有顶点的两种方式。深度优先遍历：选取一个节点开始，沿着一条路一直走到底，然后从这条路尽头的节点回退到上一个节点，再从另一条路开始走到底…，不断递归重复此过程，直到所有的顶点都遍历完成。实现方式：回溯（利用栈的先入后出特性）和递归遍历；首先访问顶点0、1、7、8，这四个顶点依次入栈，此时顶点8是栈顶：从顶点8退回到顶点7，顶点8出栈：...
2022-05-25 18:06:57
3714
1
翻译 常见的网络协议
ARP(Address Resolution Protocol)地址解析协议它是用于映射计算机的物理地址和临时指定的网络地址。启动时它选择一个协议（网络层）地址，并检查这个地址是否已经有别的计算机使用，如果没有被使用，此结点被使用这个地址，如果此地址已经被别的计算机使用，正在使用此地址的计算机会通告这一信息，只有再选另一地址了。SNMP(Simple network management p)网络管理协议它是TCP/IP协议中的一部分，它为本地和远端的网络设备管理提供了一个标准化途径，是分布式.
2022-05-25 17:01:50
556
原创 service worker相关知识
service worker是浏览器运行在后台，与网页主线程独立的另一个线程，这种工作子线程的出现通常是为了做一些比较耗费性能的计算，有需要时再和主线程通讯，告知主线程计算结果，这样将渲染与计算独立开开，就避免了阻塞情况。 service worker本质上充当web应用程序、浏览器与网络（可用时）之间的代理服务器，它会拦截网络请求并根据网络是否可用来采取适当的动作，更新来自服务器的资源，是web worker的一种，它是一个注册在指定源和路径下的事件驱动worker。特点：...
2022-05-24 09:49:32
2725
转载 HTTP与HTTPS的区别
超文本传输协议HTTP协议被用于在Web浏览器和网站服务器之间传递信息，HTTP协议以明文方式发送内容，不提供任何方式的数据加密，如果攻击者截取了Web浏览器和网站服务器之间的传输报文，就可以直接读懂其中的信息，因此，HTTP协议不适合传输一些敏感信息，比如：信用卡号、密码等支付信息。为了解决HTTP协议的这一缺陷，需要使用另一种协议：安全套接字层超文本传输协议HTTPS，为了数据传输的安全，HTTPS在HTTP的基础上加入了SSL协议，SSL依靠证书来验证服务器的身份，并为浏览器和服务器之间的通信
2022-05-18 10:49:03
28243
原创 如何实现vue中的数据深度监听？
vue中监听数据的变化分三步：1.判断监听的数据是普通值还是引用对象；2.如果是数组要单独实现数组的部分方法；3.对于多层嵌套对象，递归遍历监听所有属性；// 触发更新视图function updateView() { console.log('视图更新')}// 重新定义数组原型const oldArrayProperty = Array.prototype// 创建新对象，原型指向 oldArrayProperty ，再扩展新的方法不会影响原型const arrP
2022-03-27 21:19:33
4243
原创 vue随记
目录1. 常见的修饰符使用（self修饰符）2.mixin:抽离组件公共逻辑3.实现v-model1. 常见的修饰符使用（self修饰符）<!--阻止单击时间继续传播--><a v-on:click.stop="doThis"></a><!--提交事件不再重载页面--><form v-on:submit.prevent="onSubmit"></form><!--修饰符可以串联-->...
2022-03-27 21:12:57
1531
原创 react的优化方法
目录1.render里面尽量减少新建变量和bind函数，传递参数是尽量减少传递参数的数量。2.定制shouldComponentUpdate函数3.使用React.PureComponent4.使用React.memo来缓存组件5.延迟加载不是立即需要的组件React.loadableReact.Lazy/React.Suspense6.调整CSS而不是强制组件加载和卸载7.使用React.Fragment避免添加额外的DOM1.render里面尽量减少新...
2022-01-22 22:29:30
2673
原创 react中组件通信总结
目录父子组件通信：父传子使用props；子组件向父组件传值通过回调函数多层嵌套组件通信：使用context共享组件树中的数据(消费订阅模式) props传值：父传子使用props；子组件向父组件传值通过回调函数 多层嵌套组件通信：使用context共享组件树中的数据(生产者消费者模式) (1) 创建一个context对象：const MyContext = React.createContext(defaultValue);只有当组件所处的树中没有匹配到 Provi.
2022-01-20 17:51:08
545
转载 ::before和::after伪元素的用法
css3为了区分伪类和伪元素，伪元素采用双冒号写法。常见伪类——:hover,:link,:active,:target,:not(),:focus。常见伪元素——::first-letter,::first-line,::before,::after,::selection。::before和::after下特有的content，用于在css渲染中向元素逻辑上的头部或尾部添加内容。这些添加不会出现在DOM中，不会改变文档内容，不可复制，仅仅是在css渲染层加入。所以不要用:before
2021-07-05 14:32:53
147
转载 Promise源码阅读理解
Promise的基本使用 let p = new Promise((resolve, reject) => { console.log('excutor') setTimeout(() => { let timer = Date.now() if (timer % 2) { resolve('成功的数据，timer = ', timer) } else { reject(n
2020-08-21 16:55:30
162
转载 解析页面从输入URL到加载显示完成的过程
1、首先，在浏览器地址栏中输入url，浏览器开启一个线程处理该请求。2、浏览器先查看浏览器缓存-系统缓存-路由器缓存，如果缓存中有，会直接在屏幕中显示页面内容。若没有，则跳到第三步操作。3、在发送http请求前，需要域名解析(DNS解析)，解析获取相应的IP地址。4、浏览器向服务器发起tcp连接，与浏览器建立tcp三次握手。5、握手成功后，浏览器向服务器发送http请求，请求数据包。6、服务器处理收到的请求，将数据返回至浏览器7、浏览器收到HTTP响应8、读取页面内容，浏览器渲染
2020-08-20 12:32:39
181
翻译 TCP三次握手与四次挥手
三次握手1. 客户端主动打开，发送连接请求的报文段，将SYN标识位置为1， sequence number置为a（TCP规定SYN=1时不能携带数据）然后进入SYN-SEND（同步已发送）状态。2. 服务器收到SYN报文段进行确认，将SYN标识位设为1，ACK标识位设为1, sequence number置为b，ack置为a+1，然后进入SYN-RCVE（同步收到）状态。3. 客户端再进行一次确认，将ACK置为1， sequence number置为a+1, ack置为b+1发向服务器，最后
2020-08-20 12:19:53
138
翻译 一个div宽度或高度固定，另一个div铺满剩余空间
一. 一个div宽度固定，实现如下效果： box1固定宽度200px; box2铺满页面剩余部分<div class="wrapper"> <div class="box1"></div> <div class="box2"></div></div>1. 利用flex布局.wrapper { display: flex;}.box1 { width: 200px; height: 200px
2020-08-18 23:52:19
2203
转载 css实现水平垂直居中的几种方式
1. 利用flex布局：align-items: center垂直居中 justify-content:center水平居中<div class="box"> <div class="child"></div></div>.box { width: 100vw; height: 500px; background: skyblue; position: relative;}.child { width: 200px
2020-08-18 23:19:50
368
原创 “==”VS“===”、浅比较VS深比较、浅拷贝VS深拷贝（实现js对象的深拷贝）
浅拷贝：复制对象的所有变量都含有与原来的对象相同的值，改变任何一个对象，其他对象的值都会被改变 深拷贝：不仅将原对象的各个属性复制过来，而且对原对象所包含的各个属性中的对象也依次采用深拷贝的方式递归的复制到新对象上；深拷贝时，一个对象的改变不会影响另一个对象实现深拷贝的方式：目标对象是数组【arr1 = [4,5,2]】1. for... inlet arr2 = []for (let index in arr1) { arr2[index] = arr1[index]}2.
2020-08-13 12:54:26
1009
原创 样式引入：link与@import的区别
1. link标签是浏览器元素，不仅可以加载css样式，还可以定义RSS, rel连接属性等；@import是css引入的语法规则，只能用来引入样式表；2 页面加载时，link引入的css样式表被同时加载，@import引入的css样式在页面加载完成后被加载；3. link标签是HTML元素，不存在兼容性问题，@import是css2.1才定义的语法规则，只有在IE5+的浏览器上才能被识别；4. 通过js操作DOM，插入link改变样式， DOM是基于文档的，无法使用@import的方式插入样.
2020-08-13 12:28:04
424
原创 HTTP是如何支持Gzip传输的
1. 浏览器发送请求时，通过Accept-Encoding说明可以接受的压缩方式；2. 服务器接收到请求，使用Accept-Encoding中的一种对响应数据进行压缩；3. 服务器返回数据，在Content-Encoding中指明使用的压缩方式；4. 浏览器获取响应数据，使用Content-Encoding对结构进行解析。...
2020-08-13 12:17:09
457
原创 对页面性能优化的理解
1. 减少HTTP请求，尽可能的合并js文件，css样式以及图片资源；删除冗余的js, css代码；2. 网页上的js, css等静态资源使用CDN托管CDN(content delivery network)内容分发网络，构建于现有网络之上的智能虚拟网络，依靠部署在各地的边缘服务器，通过中心平台的负载均衡、内容分发，调度等功能模块，使用户就近获取所需内容，降低网络阻塞，提高用户访问网页速度和命中率。3. 使用innerHTML代替DOM操作，减少DOM操作次数；4. css文件放在顶部.
2020-08-13 12:11:23
199
原创 element-ui主题色切换
实现思路：1. 获取element ui默认的主题色，并保存在originalStyle中；2. 将originalStyle默认的主题色中需要更换的颜色用变量标记并保存在临时变量css中；3. 用户选择需要更换的主题色；4. 将css临时变量中的颜色变量用用户选择的颜色值替换掉；5. 插入新的更换后的css样式。 <!-- 切换主题色 --><template> <div> <el-color-picker .
2020-08-13 11:28:03
1772
原创 element开发-Table表格多选表头添加文字
要实现在table多选框checkbox后添加文字，效果如下：<el-table-column type="selection"></el-table-column>/deep/ .el-table__header-wrapper .el-checkbox__input::after { content: '全选'; position: absolute; margin-left: 5px;}...
2020-07-02 22:39:45
3664
1
原创 div中的弹性元素分为指定行显示，且每个弹性元素不跨行完整展示
项目有如下需求：1.标签最多展示两行，超出部分以“...”显示；2. 每个标签内容不能被拆分，一行至少展示一个完整的标签，如果该标签的内容在一行内展示不了，则其内容以“...”展示；最终UI如下： <div class="report-card" v-for="item in articleList" :key="item.articleId"> &...
2020-02-16 09:06:28
246
原创 es5继承与es6继承
es5中的继承方式：1. 原型链继承 缺点：1. 创建实例时无法像父类构造函数传递参数； 2. 因为指定了原型，所以不能实现多继承； 3. 父类构造函数上的属性被所有子类共用，给原型上的属性赋值会改变其他子类的属性值；// es5const Parent = function (name, ag...
2020-02-02 15:39:51
196
原创 new的过程实现
《JavaScript模式》中提到，new的过程要有三步：• 创建一个空对象，将它的引用赋给 this，继承函数的原型。• 通过 this 将属性和方法添加至这个对象• 最后返回 this 指向的新对象，也就是实例（如果没有手动返回其他的对象）更准确的来说应该是：•以构造器的prototype属性为原型，创建新对象；•将this(也就是上一句中的新对象)和调用参数传给...
2020-02-02 10:44:03
749
原创 手写vue-router相关知识点
hash模式：location.hash: 获取url的hash值； window.onhashchange监听hash的改变history模式：location.pathname:获取路径； window.onpopstate监听history变化vue.use的用法：把你给它的东西调用一遍；如果你给它的是一个方法，那么它会直接执行这个方法，如果你给它的东西里有一个install属性...
2020-02-01 18:42:21
160
原创 CSS易混淆知识点
css选择器div span{color:bule;}：后代选择器， 作用于div中所有的span标签；div>span{color:bule;}：儿子选择器， 作用于div里的span标签div+span{color:orange;}：毗邻选择器，作用于紧挨着div下面的一个span标签；div~span{color:red}：兄弟选择器，作用于所有与div处于同一级的sp...
2020-02-01 16:37:50
388
1
原创 JS中的bind、call、apply方法
bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用call 和 apply 是为了动态改变 this 而出现的，当一个 object 没有某个方法（banana没有say方法），但是其他的有（apple有say方法），我们可以借助call或apply用其它对象的方法来操作。function fruits() {}fruits.prototype = { ...
2020-02-01 16:12:31
203
原创 vue知识整理
eventBus的使用在Vue的项目中使用EventBus来实现组件之间的数据通讯前需初始化：第一种，新创建一个.js文件// event-bus.jsimport Vue from 'vue'export const EventBus = new Vue()另外一种方式，可以直接在项目中的main.js初始化EventBus：// main.jsVue.pro...
2019-08-03 12:24:07
115
原创 git rebase知识点整理
rebase原理git rebase branchA branchB：首先会取出branchB，将branchB中的提交放在branchA的顶端，一般branchB为当前分支，可以不指定。master branch 上有新代码提交，本地branch1还停留在旧的master版本。目的：使branch1同步master的最新代码，并且本地的改动也不会丢失$ git checkout...
2019-08-03 12:02:05
362
原创 perl笔记整理
1. 在Perl 中，注释由#开始，直到本行结束（Perl 中没有“块注释”（block comments）） (1) 在Unix 系统中◆，如果文本的第一行前两个字符是“#!”，接着的就是执行下面文件的程序 #! /usr/bin/perl print “Hello,word!\n”(2) 在非Unix 系统中，传统上把第一行写做#!perl。2. s/\...
2019-07-20 17:46:35
1209
关于Hibernate的配置及数据访问
2016-12-21
计算机图形学
2015-11-15
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人