- 博客(106)
- 收藏
- 关注
RSS订阅原创 vue2源码解读笔记(一)
背景：前端自我学习到了一个瓶颈方式：从网络获取别人的文章资料，学习实践，添加自己遇到的问题和解决方式目的：读懂vue部分源码，体验vue的设计方式，弥补源码涉及到但本人不具备的知识一源码下载，调试见歹佬原文：https://juejin.cn/post/6949370458793836580（可以直接看歹佬的原文，不止技术厉害，文章也写得好。我这里是个人学习的笔记，可能你也遇到了，可以参考）二Vue 初始化过程1、Vue 构造函数在 /src/core/instance/index.js.
2022-01-21 16:37:46
1791
1
原创 前端硬核知识点（三）
简述浏览器的渲染过程，回流(重排)和重绘（reflow和repaint）在渲染过程中的哪一部分？html文档解析成dom树，css解析成css对象模型（CSS Object Model），两者合并生成渲染树（rendering tree），渲染树进行布局（layer）即根据渲染树带有的位置信息计算位置，最后绘制（painting）屏幕就显示了页面。回流：布局（layer）发生变化需要倒回去重新渲染，这个回退就是回流（reflow）。因为绘制发生在布局的下一步，所以回流必定触发重绘重绘：绘制时背景色，
2021-01-14 15:14:34
179
原创 前端硬核知识点（二）
promise 有哪些状态？简述 promise.all 的实现原理Pending状态（进行中）Fulfilled状态（已成功）Rejected状态（已失败）参考链接：https://www.jianshu.com/p/b16e7c9e1f9f参考链接： https://www.jianshu.com/p/c8af0c130ccb简述 CORS（跨源域资源共享） 的用途以及基本设置跨源资源共享 (CORS) （或通俗地译为跨域资源共享）是一种基于[HTTP]头的机制，该机制通过允许服务器标
2021-01-14 15:10:39
131
1
原创 前端硬核知识点（一）
Vue 中双向数据绑定的实现原理是怎样的？// 通过Object.defineProperty( )设置了对象Book的name属性// get就是在读取name属性这个值触发的函数，set就是在设置name属性这个值触发的函数// vue通过这种方法来进行数据劫持var Book = {}var name = '';Object.defineProperty(Book, 'name', { set: function (value) { name = value; cons
2021-01-14 15:05:45
247
原创 Tagcc-共享网址（零）
此文和具体开发无关，纯属牢骚。19年开年以来咸鱼了一段时间，这里强迫自己开发一个小玩意，近一年主业前端，重拾下java的感觉，也希望借助这个小玩意融汇下所学所用。共享网址：心路历程，平时收藏的网址比较多，有工作的，有娱乐的，一般使用edge和谷歌浏览器，不喜欢登录浏览器，浏览器收藏夹的分类功能也不够我的使用需求。所以就想着自己做一个类似收藏夹的玩意，然后自己写需求，写功能，画原型图，然后…...
2019-04-29 23:11:05
353
原创 前端-进度条实践
最近有需求画横向展示的柱状图，插件开始使用了echarts，实现效果不理想，最后改为表格和进度条配合，完成柱状图（动态的）关键标签：<progress>属性：max: 规定任务一共需要多少工作，就是柱状图100%时对应的值value: 规定已经完成了多少任务，即柱状图的长度思路：修改 progress 标签样式，完成横向柱状图。注意：样式要兼容各个浏览器例如...
2018-12-26 15:06:07
778
转载 前端-localStorage
在HTML5中，新加入了一个localStorage特性，这个特性主要是用来作为本地存储来使用的，解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k)，localStorage中一般浏览器支持的是5M大小，这个在不同的浏览器中localStorage会有所不同。在使用localStorage的时候，我们需要判断浏览器是否支持localStorage这个属性：...
2018-11-07 15:26:31
422
原创 前端-杂记
很久没有写博客，今天随意写点近来一直在写前端业务逻辑代码，由于之前学习和使用的都是大杂烩，对专业的前端代码书写很乏力，主要是前端代码思想这块，能实现功能，但不够高效，不够简练。界面使用Element UI框架，通过文档和案例构造出项目需要的逻辑组件。在工作途中，首次使用java的websocket和js的websocket通信，在vue中实现订阅主推显示实时行情，这块内容挺有意思，初时...
2018-09-26 21:16:50
264
原创 正则表达式入门
近来常用到正则，避免眼盲直接从网络拷贝导致不能预料的错误，这里做简单了解。一、简单示例：^once // 匹配那些以once开头的字符串;在[]内出现时表示'非'。例如该模式与字符串"once upon a time"匹配，与"There once was a man from NewYork"不匹配bucket$ //以 bucket 结尾,与"Who kept all of t...
2018-09-12 11:25:39
301
原创 java多线程初探（零）使用Lock-线程间通信
测试类package gcc.thread.Lock.condition;/** * 类似wait和notify，ReentrantLock使用Condition来控制等待和唤醒机制，并且可以根据分组唤醒指定的线程，选择性通知 * 如下，线程aa和ab在等待时所属不同的Condition，通过condition_A只唤醒了aa的等待 */public class Test {...
2018-08-03 17:39:32
154
原创 java多线程初探（零）生产者消费者模式-线程通信
测试类package gcc.twoThreadTransData.producerAndConsumer;import org.slf4j.Logger;import org.slf4j.LoggerFactory;/** * 多个线程之间通信 * 消费者生产者模式 * 多个生产者和消费者 * 流程： * 多个线程（生产者，消费者）公用一把锁 * 本例设置了两个生产者...
2018-08-03 17:17:48
129
原创 java多线程初探（零）线程间通信
测试类：package gcc.twoThreadTransData.waitAndNotify;/** * 通过wait和notify来实现多线程间的通信，这样可以避免一直轮询的消耗 * wait和notify需要在同步代码块内调用 * 对正在wait的线程执行interrupt()，会报异常，同时释放锁 * * 1，代码执行到wait，等待执行，并释放锁 * 2，noti...
2018-08-03 16:53:44
153
原创 java多线程初探（零）基础demo
package gcc.thread.test;import org.junit.Test;import org.slf4j.Logger;import org.slf4j.LoggerFactory;/** * 一个进程至少一个线程，如main方法的线程由jvm来创建，取名也叫main（线程） * 此demo主要介绍Thread类的方法 */public class Dem...
2018-08-02 18:55:54
239
原创 git 常用命令
使用git步骤//从远处仓库clone代码，远程仓库默认名字叫origin，可以是http方式，也可以是SSH方式$ git clone https://github.com/mengguagua/demoVue.git//查看当前分支$ git branch//指定远程分支到本地，例如dev分支$ git checkout -b dev origin/dev //修改文件...
2018-07-20 14:12:51
245
原创 vue笔记（六）使用vuex
这里通过一个实例，来描述vuex的mapState ， mapGetters ， mapActions 这里使用 Element UI 官网地址：http://element-cn.eleme.io/#/zh-CN/component/select一、使用 Element UI 给出的demo，选择其一拷贝到本地项目二、修改demo，得到如下： <div> ...
2018-07-18 16:23:37
189
原创 vue笔记（五）表单验证
这里以验证两次密码是否一致，来记录vue表单验证写法。 一、首先这里使用 Element UI 的表单验证，基本用法如地址：http://element-cn.eleme.io/#/zh-CN/component/form 二、然后查看示例代码，了解对应的属性，方法，事件。 三、拷贝示例代码然后简化，如下： <div> <el-fo...
2018-07-13 17:06:36
2472
原创 网站架构 - 图解析
这是某从《大型网站技术架构：核心原理与案例分》一书中拿来的图，书中还有更加符合大型网站的架构图，为什么拿这张，是出于个人的理解。再往下的分布式的数据服务器和分布式的独立业务服务器，如非必要尽量不去碰，用句打游戏的话，‘团战容错率太低’。下面讲讲这张图的意思。首先是CDN，基本原理是缓存，CDN部署在网络提供商的机房里，使用户可以在请求服务时，从距离自己最近的网络提供商机房获取数据。然后是反向代理服...
2018-07-12 14:52:30
4579
原创 Spring-Spring MVC简述（四）
使用Spring MVC需要在web.xml中配置DispatcherServlet，例如：<servlet> <servlet-name>dispatcherServlet</servlet-name> <servlet-class>org.springframework.web.servlet.DispatcherServlet</...
2018-07-12 10:55:30
258
原创 Spring-总体架构简述（三）
Spring的骨骼架构是，Bean组件，Content组件，Core组件。最核心是Bean组件，意义类似于java面向对象的 '对象' 这个概念。spring的作用核心是，把对象之间的依赖关系通过配置文件来管理，即依赖注入机制。Bean组件包装了Object，而Object一定带有数据，所以需要通过Content组件来给这些数据提供生存环境，同时Content去找寻Bean之间的关系，并维护这些关...
2018-07-11 17:10:29
273
原创 tomcat结构简述
tomcat总体模块如下图，其中Connector和Container是核心，将核心和其他组件封装形成一个service。给service提供一个生存环境，控制其生命周期，即Server。Connector组件Connector用来接收浏览器发过来的TCP连接请求，创建一个Request和Response对象用来交换数据，然后产生一个线程来处理这个请求，并把Request和Response对象传给...
2018-07-11 15:34:52
500
原创 ES6·杂
这里零碎记录一些ES6的内容，和部分以前版本的内容一、for-of如何遍历数组中的元素？很久以前是这样的：for (var index = 0; index < myArray.length; index++) { console.log(myArray[index]);}ES5之后是这样的：myArray.forEach(function (value) { consol...
2018-07-10 11:26:54
117
原创 vue笔记（四）原组件重写
这里记录下对Element UI走马灯组件的重写，增加一个点击图片跳转对应页面的功能。思路是：重写的子组件使用Element UI走马灯组件代码，将参数设置为由父组件传递，然后增加所需功能。一、先来大致看一下Element UI走马灯组件，这里给出地址：http://element-cn.eleme.io/#/zh-CN/component/carousel二、新建父组件和子组件文件，笔者使用工具...
2018-07-06 16:07:32
6069
原创 web基础·杂（浏览器缓存，DNS，CDN）
一、浏览器缓存在查看页面时发现异常，一般会刷新缓存，快速的做法是Ctrl+F5，重新发起请求。问了确保Ctrl+F5重新发起的请求得到的结果既不是浏览器缓存也不是服务器缓存，Ctrl+F5时在HTTP头会添加一些参数，如下：Cache-Control:no-cache：针对浏览器，内容不被缓存Pragma:no-cache：针对服务器，内容不被缓存二、DNS域名解析（DNS），简单来说就是把类似w...
2018-07-02 20:20:37
1000
转载 java基础·杂（InetAddress）
在了解DNS解析时，缓存方面，再具体到java上，于是记录下InetAddressjava的JVM会缓存DNS的解析结果，这个缓存在InetAddress类里完成，InetAddress一旦得到一个给定主机的地址，就会缓存起来，即使重新定义一个InetAddress类，也不会重新再获取一次，而是直接从缓存中获取。并且有两种缓存策略，一种是：正确的解析结果缓存，另一种是：失败的解析结果缓存。分别由j...
2018-07-02 19:15:12
126
原创 HTTP（三）HTTP报文
HTTP报文（message）：用于 HTTP 协议交互的信息被称为 HTTP 报文，用于请求的叫请求报文，用于响应的叫响应报文。HTTP 报文大致可分为报文首部和报文主体两块。通常，并不一定要有报文主体。结构如图：F12查看一个ajax option请求方法的实例如图：报文有通用，请求，响应，实体四类headers，分别包含的字段说明如下图：...
2018-06-26 17:11:09
223
原创 HTTP（二）Cookie基础
HTTP 协议和 TCP/IP 协议族内的其他众多的协议相同，用于客户端和服务器之间的通信。基本的请求报文和响应报文如下：其中请求方法详细如下图：注：HTTP1.0是短连接，HTTP1.1之后是长连接HTTP 是一种不保存状态，即无状态（stateless）协议。使用 HTTP 协议，每当有新的请求发送时，就会有对应的新响应产生。协议本身并不保留之前一切的请求或响应报文的信息。这是为了更快地处理大...
2018-06-26 16:29:04
215
原创 HTTP（一）网络基础
为了理解 HTTP，有必要事先了解一下 TCP/IP 协议族。通常使用的网络（包括互联网）是在 TCP/IP 协议族的基础上运作的。而 HTTP 属于它内部的一个子集。协议（protocol）：计算机与网络设备要相互通信，双方就必须基于相同的方法。比如，如何探测到通信目标、由哪一边先发起通信、使用哪种语言进行通信、怎样结束通信等规则都需要事先确定。所有的这一切都需要一种规则。而我们就把这种规则称为...
2018-06-26 15:30:00
344
原创 java基础·杂（NIO之ByteBuffer）
接触了NIO的东西，这里记下，方便以后查阅。1，NIOJava NIO(New IO)是一个可以替代标准Java IO API的IO API（从Java 1.4开始)，Java NIO提供了与标准IO不同的IO工作方式。Channels and Buffers（通道和缓冲区） 标准的IO基于字节流和字符流进行操作的，而NIO是基于通道（Channel）和缓冲区（Buffer）进行操作，数据总...
2018-06-04 15:52:44
152
转载 vue笔记（三）vue路由
这里增改转发一篇xing.org1的博客。1，作用：路由：控制组件之间的跳转，不会实现请求、不用页面刷新，直接跳转-切换组件。2，安装本地环境安装路由插件vue-router：npm install vue-router --save-dev 3，配置在src/router/index.js中： 1：引入，注意这个Router是自定义的名字，这里叫这个名字后，下面会用到import Vue ...
2018-05-31 14:36:00
350
原创 vue笔记（二）vue项目整合element-ui-全局
打开vue项目，推荐使用webstorm，在如图位置输入命令：1. 安装 loader 模块：npm install style-loader -Dnpm install css-loader -Dnpm install file-loader -D2. 安装 Element-UI 模块：npm install element-ui --save3.修改 build...
2018-05-29 19:50:04
4682
原创 谷歌浏览器调试 · 杂
记录下常用的谷歌浏览器使用点：1，f12打开调试界面2，Elements，1位置可以选取查看页面的节点元素，查看如下：3，Console为控制台，最下方可编写前端代码，进行测试：4，Network，主要用来查看ajax的数据传递情况，Form data是送去后台的参数，打开Preview是收到的参数，用来比对显示内容。5，Application，Local Storage，笔者主要用来查看数据字典...
2018-05-23 20:07:48
169
原创 vue笔记（一）基础语法
这里记录vue的demo例子，整理自官方文档。至于什么是vue可以理解为js各种进阶版之一，方便开发。下面是基本用法的demo：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type=
2018-05-15 10:30:49
398
转载 java基础·杂（http请求方式）
标准Http协议请求方法，如： 0，GET 1，HEAD 2，PUT 3，DELETE 4，POST 5，OPTIONS 我们大部分情况下只用到了GET和POST。下面依次简单说明这六种。 0，GET：GET可以说是最常见的了，它本质就是发送一个请求来取得服务器上的某一资源。资源通过一组HTTP头和呈现数据（如HTML文本，或者图片或者视频等）返回给客户端。GET请求中，永远不会包...
2018-05-09 09:42:35
144
原创 java8类库简单了解（四）String
常用方法：1，字符串中包含的字符数，也就是字符串的长度：int length（）2，根据位置获取位置上的某个字符：char charAt（int index）3，根据字符获取该字符在字符串中的位置： int indexof（String str）;int indexof（String str，int fromIndex）4，字符串中是否包含某一个子串：boolean contains(str)5，...
2018-05-04 16:16:24
232
原创 java基础记录·杂（while、split、位运算符）
一、split截取是将所有子串放入数组里，若大量操作效率较低，可以用StringTokenizer替换。测试如下：package gcc.mix.test;import java.util.StringTokenizer;/** * Created by gcc on 2018/5/4. * 单纯截取字符串用substring,少量长字符串截取取值可以用split，大量的话用StringT...
2018-05-04 15:12:15
148
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人