- 博客(65)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 git TortoiseGit配置相关
关于公钥私钥参照： 1. 数字签名是什么？ 2. 密码学笔记 3. SSH原理与运用（一）：远程登录关于Git TortoiseGit配置参照： 1. TortoiseGit配置私钥关联github...
2018-05-31 23:47:47
249
原创 Webpack4使用教程
1.安装 要安装最新版本或特定版本，请运行以下命令之一： npm install --save-dev webpack npm install --save-dev webpack@<version> 如果使用 webpack 4+ 版本，还需要安装 CLI。 npm install --save-dev webpack-cli 基本...
2018-05-17 20:02:37
3286
转载 Webpack模块热替换
首先强调一点：模块热替换(Hot Module Replacement)并不是live reload ，前者不需要刷新浏览器，后者需要。在热替换使用过程中，CSS的热替换踩过一个坑，可参见文章 如何使用模块热替换 HMR 来处理 CSS热替换原理参见文章：Webpack HMR 原理解析...
2018-05-17 14:58:17
785
转载 Babel相关概念及在webpack中的配置
1.javascript规范 javascript是网景公司开发的一种脚本语言，1996年的时候以ECMAScript的名字正式成为一种标准。2007年的时候发布了版本es5，然后在随后近10年里js并没有大的变化。所以现在的浏览器都可以很好的支持es5。这一局面直到2015年被打破。2015年6月，TC39（javascript标准的制定组织）公布了新版本的js语言——ES6。而且从ES...
2018-05-15 20:59:51
606
转载 JavaScript核心概念——执行环境、执行环境栈、变量对象、活动对象
1.执行环境(Execution Context)什么是执行环境（Execution Context）？ “每当程序的执行流进入到一个可执行的代码时，就进入到了一个执行环境中。”执行环境栈（Execution Stack） 执行流依次进入的执行环境在逻辑上形成了一个栈，栈的底部永远是全局环境，栈的顶部则是处于活动状态当前的执行环境(浏览器总是执行处于栈顶的上下文)。当执行...
2018-05-11 21:24:40
280
1
转载 DOM Core 与 HTML DOM的区别和联系
本文内容的主题便是，为什么开发者要认为“DOM Level 1规范的架构”是至关重要的，其突出的重要性在哪里等等，以及还有HTML DOM和XML DOM之间微妙的区别及内在的联系。 W3C所制订的DOM Level分为两大模块：Core和HTML。第一个大模块是Core核心，W3C规范是这样描述Core的：满足软件开发者和Web脚本编写者，访问和操控产品项目中包含的可解析的HTML和XML...
2018-05-01 14:57:28
1710
原创 JavaScript数据结构与算法——栈及其应用
1.使用ES6模拟栈的实现let Stack = (function() { const items = new WeakMap(); // 放入WeakMap统一管理，避免外部直接修改数据 class Stack { constructor() { items.set(this, []) } push(element) { it...
2018-05-01 10:23:19
173
转载 event loop
参考： 1. JavaScript 异步、栈、事件循环、任务队列 2. 从event loop规范探究javaScript异步及浏览器更新渲染时机 3. 深入探究 eventloop 与浏览器渲染的时序问题 4. 从Vue.js源码看异步更新DOM策略及nextTick...
2018-04-25 13:22:55
100
转载 三次握手四次挥手
1. 三次握手大致过程：客户端发送seq=x(随机选取一个序列号x作为自己的初始序号发送给B)、SYN = 1，客户端将自身状态设为SYN-SENT；服务端接收到seq=x的包之后，需要继续接收seq=x+1的包，因此对客户端发送SYN = 1(发起一个新连接)、ack = x + 1、seq = y(自身数据包序列号)、ACK = 1(确认序号有效)，同时将自身状态设置为SYN-RECE...
2018-04-24 21:24:06
111
转载 HTTP2的优点
HTTP2.0使用HTTP2.o测试便可看出HTTP2.0比之前的协议在性能上有很大的提升。下面总结了HTTP2.0协议的几个特性。1.多路复用 (Multiplexing)多路复用允许同时通过单一的 HTTP/2 连接发起多重的请求-响应消息。在 HTTP/1.1 协议中浏览器客户端在同一时间，针对同一域名下的请求有一定数量限制。超过限制数目的请求会被阻塞。这也是为何一些站点会有...
2018-04-24 20:16:25
2680
转载 HTTP与HTTPS的区别
1. HTTPS加入SSL层，加密大致过程：服务器返回公钥；客户端自己生成随机私钥，用公钥加密，发送加密后的私钥；客户端与服务端通过加密后的私钥通信。2. HTTP与HTTPS的区别：HTTPS更安全，但不是绝对安全，面对恶意攻击大部分时候无能为力；HTTPS申请证书需要花钱；HTTPS连接更耗时，在缓存方面也有问题；参考： 1. HTTP与HTTPS的区别...
2018-04-24 19:50:46
154
转载 深入理解JavaScript异步编程
参考： 1. JavaScript 运行机制详解：再谈Event Loop 2. 深入理解 JavaScript 事件循环（一）— event loop 3. JS 事件循环机制 - 任务队列、web API、JS主线程的相互协同 4. HTML5新特性之Mutation Observer 5. Vue 中如何使用 MutationObserver 做批量处理？ 6. Promise简...
2018-04-23 21:55:20
126
转载 margin技术相关
1. 由浅入深漫谈margin属性 2. 深入了解margin的问题 3. 用Margin还是用Padding 4. 不要告诉我你懂margin
2018-04-20 14:39:56
169
原创 13个常用的HTTP状态码
一、 状态码类别 状态码 类别 原因 1XX 信息性状态码 接收的请求正在处理 2XX 成功状态码 请求处理正常完成 3XX 重定向状态码 需要进行附加请求以完成请求 4XX 客户端错误状态码 服务器无法处理请求 5XX 服务端错误状态码 服务器处理请求出错二、14个常用的状态码...
2018-04-12 14:39:02
282
原创 TCP/IP协议族分层及其作用
TCP/IP 协议族按层次分别分为： 应用层、 传输层、 网络层和数据链路层。1. 分层好处：改动自由：比如， 如果互联网只由一个协议统筹， 某个地方需要改变设计时， 就必须把所有部分整体替换掉。 而分层之后只需把变动的层替换掉即可。 把各层之间的接口部分规划好之后， 每个层次内部的设计就能够自由改动了。设计简单：值得一提的是， 层次化之后， 设计也变得相对简单了。 处于应用层上的...
2018-04-11 15:09:41
4475
原创 模拟创建JS的链表结构
1.单向链表概念：链表是由一组节点组成的集合。 每个节点都使用一个对象的引用指向它的后继。 指向另一个节点的引用叫做链。 直接上代码：var LList = function() { var Node = function(element) { this.element = element; this.next = null; };...
2018-04-08 18:04:05
194
原创 利用数组创建JS的队列结构
var Queue = (function(){ function enqueue(element){ this.dataStore.push(element); }; function dequeue(){ return this.dataStore.shift(); }; function front(){ ...
2018-04-08 15:51:05
131
原创 利用数组创建JS的栈结构
1. 实现源码var Stack = function(){ function pop(){ return this.dataStore[--this.top]; }; function push(element){ this.dataStore[this.top++] = element; }; function p...
2018-04-04 19:19:00
203
原创 JS系列总结笔记——7.创建型设计模式
概念：创建型设计模式是一类处理对象创建的设计模式，通过某种方式控制对象的创建来避免基本对象创建时可能导致设计上的问题或增加设计上的复杂度。1. 简单工厂模式概念：又叫静态工厂方法，由一个工厂对象决定创建某一种产品对象类的实例，主要用来创建同一类对象。function createPop(type, text) { var o = new Object(); ...
2018-04-04 16:17:45
119
原创 JS系列总结笔记——6.深入数组的sort方法
1. sort方法使用说明该方法接收一个函数作为参数，该函数在sort方法内部执行n-1次。该函数的两个参数分别对应数组每次比较的两项。var arr = [2,1,4,3,6,7,5];arr.sort(function(a,b){ console.log(a,b);});执行结果为： 正常来说，该方法的排序需要自己传入相应的回调函数。例如实现数字数组的排序函...
2018-03-23 22:02:34
163
原创 JS系列总结笔记——5.深入理解call、apply、bind方法
1. call方法的作用说明：在js中所有的函数都是Function的实例，而且对于Function来说，它的原型即Function.prototype中含有很多东西，其中call,apply和bind方法就是Function原型中的方法，所以根据原型的规则，所有的函数都可以使用原型中属性和方法，所以来说，对于所有的函数都可以使用call、apply、bind方法。 作用：而在JavaScr...
2018-03-22 18:16:32
185
原创 JS系列总结笔记——4.JS继承
1.类式继承// 父类var SuperClass = function() { this.superValue = true;}// 子类var SubClass = function() { this.subValue = false;}SubClass.prototype = new SuperClass(); // 原型指向父类的实例，即可继承父类的...
2018-03-21 22:02:50
101
原创 JS系列总结笔记——3. 深入理解JS中的this
1. 定义JS中的this代表的是当前行为执行的主体，context指的是当前行为执行的环境（区域）。 例如：我在餐厅吃饭和我在食堂吃饭，this都是我，改变的是执行环境。2.判断this到底是谁函数执行，首先看执行时函数名前是否有 “ . ”，有的话前面是谁this就是谁，没有的话this就是window。function fn() {console.log(t...
2018-03-21 10:51:10
160
原创 JS系列总结笔记——2. JavaScript函数执行内部原理
1. 函数执行的步骤JavaScript函数执行时的步骤如下： (1) 形成新的私有作用域； (2) 如果有形参，先给形参赋值； (3) 进行私有作用域中的预解释（预解释原理）； (4) 私有作用域中的代码从上到下执行。2. 区分私有变量和全局变量全局变量：在全局（window）下声明的变量即全局变量；私有变量：在JavaScript（不包含es6）函数内部声明的变...
2018-03-21 10:22:05
411
原创 JS系列总结笔记——1. JavaScript的预解释机制（变量提升）
1. 概念当浏览器加载HTML页面时，会先提供一个供全局JS代码执行的环境（即全局作用域，window或者global），在这个环境中，浏览器默认会把所有带var和function的变量进行提前声明或者定义。 (1) 理解声明和定义；var num = 12;// 声明： 告诉浏览器在全局作用域中有一个num变量// 定义： 给变量进行赋值// 使用只声明未定义的变量值为und...
2018-03-20 20:05:21
188
转载 设备像素比、DPI、PPI、DP、PX 的详细计算方法
参考地址： https://www.web-tinker.com/article/20590.html https://www.zhihu.com/question/21220154
2018-03-20 14:25:03
2595
转载 transform transform-origin详解
mark一下这两篇文章，有时间再好好总结。 https://www.w3cplus.com/content/css3-transformhttp://www.zhangxinxu.com/wordpress/2012/09/css3-3d-transform-perspective-animate-transition/
2018-03-19 15:16:42
1108
原创 word-wrap white-space word-break textoverflow的辨析
1. word-wrap属性值： normal（默认属性）、break-word 说明：正常来说，在一行文本中，如果出现这一行已经放不下的单词，浏览器会自动将该文字转入下一行。但是，如果一行都无法放下该单词，则浏览器默认会出现溢出的情况。如果设置了break-word属性，则会将该单词折断在下一行显示。 2.white-space 属性说明：规定段落中的文本不进行换行。 属性值：...
2018-03-18 14:49:12
231
原创 模拟单选框或复选框
1. 原生的input似乎有点丑，可以利用CSS属性选择器选择不同的状态，模拟出相应的效果。HTML代码如下：<label for="test"> <input id="test" type="checkbox"> <span></span></label>CSS代码如下：
2018-03-18 14:09:01
443
原创 HTML5 input常见新增类型及属性
1. url类型、email、tel类型说明：当输入非url、email的字符串时，浏览器会自动提醒。<form action="/example/html5/demo_form.asp"> <input type="url"> <input type="submit" value="提交"></form&
2018-03-17 10:44:40
3832
原创 AJAX创建相关
AJAX创建过程分为经典的四步，以下分步阐述其过程及要点。1. 创建AJAX对象;var xhr = new XMLHTTPRequest; // IE6及以下不兼容2. 发送前的基本信息配置：配置请求方式（GET、POST、PUT、DELETE、HEAD…）；打开一个URL地址（配置向哪一个服务器地址发送请求）；同步还是异步（true异步，false同步，默认是tru
2018-01-26 11:39:15
144
原创 JS中的正则
1. JS 正则概念： 用来处理字符串的规则。每一个正则表达式都是由元字符和修饰符组成。 元字符： 在 / / 之间具有意义的一些字符 修饰符：g（全局匹配） 、i（忽略大小写）、m（多行匹配）\ 转义字符 ^ 以某元字符开始 /^\d/ 以数字开头 $ 以某元字符结束 /\d$/以数字结束 . 除了 \n以外的任意字符代表出现次数的量词元字符：
2018-01-22 21:44:17
451
原创 JS中的offsetParent和parentNode 以及 获取元素相对body的偏移值
1. JS 中的 offsetParent 和 parentNode在正常的文档流中，元素的 offsetParent 值为 body 元素，offsetLeft 和offsetTop 获取的也是相对于 body 的偏移量；而 parentNode 指的是元素的父节点。 2. 获取元素相对于 body 的偏移量需要考虑到非正常文档流中（有关元素不处于正常文档流的情况，这里不
2018-01-21 21:59:11
1009
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人