FE.SRC-React实战与原理笔记

2019-08-20
阅读 3 分钟
2.4k
React实战与原理笔记 概念与工具集 jsx语法糖;cli;state管理;jest单元测试; webpack-bundle-analyzer Storybook 查看更多... 生命周期 constructor() 用于初始化内部状态,很少使用; 唯一可以修改state的地方; 使用 this.state 来初始化 state 给事件处理函数绑定 this getDerivedStateFromProps() 当创建时、接收新的...

FE.CSS-容易疏忽的CSS细节

2019-07-07
阅读 5 分钟
1.5k
比如剩余空间为 x,三个元素的 flex-grow 分别为 a,b,c。设 sum 为 a + b + c。那么三个元素将得到剩余空间分别是 x a / sum, x b / sum, x * c / sum,是为权重也。

FE.BASE-WEB组件包容性设计手册

2019-06-10
阅读 74 分钟
4.6k
包容性设计这个术语并不是一个新概念。这是自2005年以来一直存在的一个短语。它被定义为“尽可能多的人可以访问和使用的主流产品/服务的设计,而不需要特殊的适应或专门的设计“。

FE.SRC-Vue实战与原理笔记

2019-05-24
阅读 21 分钟
2.2k
实战 - 插件 form-validate {代码...} i18n {代码...} 实战 - 组件 Vue组件=Vue实例=new Vue(options) 属性 自定义属性 props:组件props中声明的属性 原生属性 attrs:没有声明的属性,默认自动挂载到组件根元素上 特殊属性 class,style:挂载到组件根元素上 事件 普通事件 @click,@input,@change,@xxx 通过this.$emit('...

FE.BASE-vscode使用、原理、插件开发笔记

2019-05-15
阅读 11 分钟
5k
使用 命令行使用 帮助:code --help 使用已经打开的窗口来打开文件:code -r 打开文件并滚动到特定行:code -r -g package.json:128 比较两个文件:code -r -d a.txt b.txt 接受管道符数据:ls | code - 图形界面、快捷键使用 光标移动至 单词开头/末尾 Ctrl + Left/Right, 代码块开头/末尾 Cmd + Shift + \ 文档首行/末...

Ops.CI/CD-持续交付概要笔记

2019-05-13
阅读 4 分钟
2.8k
持续集成:集成构建和测试的反复持续过程持续交付:在持续集成之后获取外部对软件的反馈再通过持续集成进行优化的过程持续部署:将可交付产品快速且安全地交付用户使用的一套方法和系统

FE.BASE-前端设计模式、编码与重构笔记

2019-05-10
阅读 5 分钟
3.5k
高质量Javascript Javascript特性:面向对象,无类,原型 可维护的代码(可读;一致;可预测;看起来像是同一个人写的;文档) 减少全局对象,传参访问全局对象 单 var 模式,忘记 var 时的副作用(显式声明的全局变量无法用 delete 删除) (不)扩充内置原型 switch 模式 每个 case 和 switch 对齐(这里不考虑花括号相关的缩进规...

FE.SRC-webpack原理梳理

2019-04-26
阅读 29 分钟
3.5k
Module(模块)是webpack的中的关键实体。Webpack 会从配置的 Entry 开始递归找出所有依赖的模块. 通过Loaders(模块转换器),用于把模块原内容按照需求转换成新模块内容.

FE.B-浏览器的工作原理:新式网络浏览器幕后揭秘

2019-04-05
阅读 27 分钟
1.7k
这是一篇全面介绍 WebKit 和 Gecko 内部操作的入门文章,是以色列开发人员塔利·加希尔大量研究的成果。在过去的几年中,她查阅了所有公开发布的关于浏览器内部机制的数据(请参见 资源 ),并花了很多时间来研读网络浏览器的源代码。她写道:

FE.ES-了解JS数据国际化

2019-03-28
阅读 5 分钟
2.5k
支持 "second", "minute", "hour", "day", "week", "month", "quarter", "year"

FE.B-浏览器支付接口概览-PaymentRequest

2019-03-25
阅读 5 分钟
2.7k
PaymentRequest API 允许商家(即销售物理或数字商品的网站)以最小的集成使用一种或多种支付方法。用户代理(例如,浏览器)促进商家和用户之间的支付流程。github链接 [链接]w3c规范链接 [链接]

FE-ES 前端数据结构与算法leedcode训练合集40题

2019-03-21
阅读 24 分钟
2.2k
无关知识点 1.精通一个领域: 切碎知识点 刻意练习 反馈 2.切题四件套 审题 所有解法 比较(时间/空间复杂度) 加强 编码 测试用例 [链接] 数组,链表 数组 查询:O(1)插入 O(n) 删除O(n)链表 查询:O(n)插入 O(1) 删除O(1) 206.翻转链表 reverse-linked-list {代码...} 24. 两两翻转链表 Swap Nodes in Pairs {代码...} 1...

FE.ES-(for...of) 可迭代对象Range(n) in JS

2019-03-18
阅读 3 分钟
1.3k
可迭代对象 Array [10, 20, 30] String "boo" TypedArrayc new Uint8Array([0x00, 0xff]) Map new Map([["a", 1], ["b", 2], ["c", 3]]) Set new Set([1, 1, 2, 2, 3, 3]) arguments (function() {for (let arg of arguments) console.log(arg)})(1, 2, 3) Nodelist document.querySelectorAll("article > p")( 浏览...

FE.CSS-快速梳理

2019-03-05
阅读 8 分钟
1.3k
CSS设计初衷是为了更好地展示图文。HTML元素根据”外在盒子“是内联还是块级,分成块级元素和内联元素。HTML元素也可根据是否具有可替换内容,分成替换元素和非替换元素

FE.BASE-HTTP基础梳理

2019-03-02
阅读 4 分钟
1.5k
<方案>://<用户>:<密码>@<主机>:<端口>/<路径>;<参数>?<查询>#<片段>

FE.ES-终结0.1+0.2,答到点上的那种

2019-02-26
阅读 2 分钟
1.3k
由于0.1.toString(2)=0.0001100110011001100110011001100110011001100110011001101所以0.1 = 2^-4 * [1].10011001100110011001100110011001100110011001100110100.2 = 2^-3 * [1].1001100110011001100110011001100110011001100110011010

FE.B-异常监控原理

2019-02-10
阅读 3 分钟
2.1k
window.onerror 捕获异常的能力比 try-catch稍强一点,无论是异步还是非异步的错误,onerror都能捕获到运行时的错误

FE.B-前端性能优化

2019-01-30
阅读 1 分钟
1.8k
http1.0: expires,last-modifiedhttp1.1 E-tag,cache-controlhtml no-cache

FE.ES-JavaScript的模块化历史

2019-01-11
阅读 2 分钟
1.4k
Node 应用由模块组成,采用 CommonJS 模块规范。每个文件就是一个模块,有自己的作用域。在一个文件里面定义的变量、函数、类,都是私有的,对其他文件不可见。在服务器端,模块的加载是运行时同步加载的;在浏览器端,模块需要提前编译打包处理。

FE.ES-理解Event Loop

2019-01-08
阅读 5 分钟
1.8k
JavaScript引擎又称为JavaScript解释器,是JavaScript解释为机器码的工具,分别运行在浏览器和Node中。而根据上下文的不同,Event loop也有不同的实现:其中Node使用了libuv库来实现Event loop; 而在浏览器中,html规范定义了Event loop,具体的实现则交给不同的厂商去完成。

FE.WEB-前端安全防范初识

2019-01-07
阅读 7 分钟
2.4k
xss-跨站脚本攻击概念:用户填写信息是可运行的 js 代码。 操作用户界面攻击源头:反射型 – 从url读取内容展示 {代码...} 存储型 - 从后台读取内容展示 {代码...} 防范手段:纯文本– html encode , js encode。由于内容可能在多端展示,所以不在提交的时候转义,只在展示的时候转义。 {代码...} {代码...} 富文本– 白名...
封面图

FE.CSS-理解Matrix,Flex,Grid

2018-12-30
阅读 5 分钟
2k
transform的matrix()方法写法如下:transform: matrix(a,b,c,d,e,f);新旧像素位置转换如下:$ \begin{bmatrix} a & c &e \\ b & d &f\\0 & 0 & 1 \end{bmatrix} *\begin{bmatrix} x \\ y \\1 \end{bmatrix}=\begin{bmatrix} ax+cy+e \\ bx+dy+f \\0+0+1 \end{bmatrix} \begin{matrix} ←x' \\ ←y...

FE.B-理解浏览器的同源策略与跨域方案

2018-12-21
阅读 1 分钟
1.3k
同源 概念:协议,域名,端口 相同。目的:保证用户信息的安全,防止恶意的网站窃取数据。限制的行为: Cookie、LocalStorage 和 IndexDB 无法读取。 DOM 无法获得。 AJAX 请求不能发送。 跨域 资源跳转: A链接、重定向、表单提交 资源嵌入: <link>、<script>、<img>、<frame>等dom标签,还有...

FE.ES-异步编程进化史

2018-12-15
阅读 5 分钟
1.6k
本文通过实践从古至今对XMLHttpRequest封装的各种方式,来了解在es中异步编程的实现细节和设计模式。 回顾XMLHttpRequest原生写法 XMLHttpRequest -MDN {代码...} 常见封装方法 1.回调函数 传值方式实现 {代码...} 传对象方式实现 {代码...} 2.Promise 使用 Promise - MDNPromise 本质上是一个绑定了回调的对象,而不是...

FE.ES-理解ECMA Javascript的原型

2018-12-06
阅读 8 分钟
1.3k
字面量对象字面量 var a = {};数组字面量 var arr = [1,2,3];正则表达式字面量 var reg = /[a-z]/g;

FE.ES-理解ECMA Javascript的this

2018-11-24
阅读 4 分钟
1.6k
无论是否在严格模式下,在全局执行上下文中(在任何函数体外部)this 都指代全局对象。(MDN)在严格模式下,this将保持他进入执行上下文时的值,如果 this 没有被执行上下文(execution context)定义,那它将保持为 undefined。(MDN)

FE.ES-理解ECMA Javascript作用域

2018-11-23
阅读 6 分钟
1.5k
作用域是一套规则,用于确定在何处以及如何查找变量(标识符)。如果查找的目的是对变量进行赋值,那么就会使用 LHS 查询;如果目的是获取变量的值,就会使用 RHS 查询。赋值操作符会导致 LHS 查询。 = 操作符或调用函数时传入参数的操作都会导致关联作用域的赋值操作。

FE.SRC-webpack/tapable-0.2 源码分析

2018-11-17
阅读 5 分钟
1.8k
Tapable [链接][链接] {代码...} Tapable 是一个用于插件绑定的类 继承方式1 {代码...} 继承方式2 {代码...} 公有方法 apply {代码...} 通过调用apply它们将作为参数传递的所有插件附加到实例。 plugin {代码...} names需要监听的事件名称,可以传入事件名称集合(同时绑定多个事件),也可以传入单个事件名称handler 事...

FE.TEST-前端测试初探

2018-11-08
阅读 4 分钟
2.7k
测试可以提供快速反馈,根据测试用例覆盖代码,从而提升代码开发效率和质量。根据投入产出价值,通常迭代较快的业务逻辑不做测试用例,对通用常用的代码基本组件或框架需要编写测试。

FE.ES-ECMA中的相等性判断

2018-10-30
阅读 2 分钟
1.4k
概要 本文主要讨论以下几种比较操作: == 宽松相等 ("double equals"),将执行类型转换 === 严格相等 ("triple equals" 或 "identity") Object.is (ECMAScript 2015/ ES6 新特性)与三等号相同,但是对于NaN和-0和+0进行特殊处理 以及ECMA中的ToPrimitive,ToBoolean,ToNumber官方文档的实现逻辑 == {代码...} === {代码....