客户端检测

2019-01-30
阅读 2 分钟
2.3k
检测 web 客户端的手段有很多,而且各有利弊。但最重要的是要知道,不到万不得已,就不要使用客户端检测!如果能找到更通用的方法,应优先采用更通用的方法。既是,先设计通用的方案,在针对差异增强该方案

vue-router源码解析(四)路由匹配规则

2019-01-29
阅读 8 分钟
8.5k
前面我们讲过,在使用 vue-router 的时候,主要有以下几个步骤: {代码...} 然后再进行路由跳转的时候,我们会有以下几种使用方式 。 详细使用请查看官方文档 {代码...} 那么,你有没有想过, push 进去的对象是如何与我们之前定义的 routes 相对应的 ??接下来,我们一步步来进行探个究竟吧! 匹配路由入口 之前我们说过...

vue-router源码解析(三)路由模式

2019-01-22
阅读 4 分钟
4.5k
vue-router 默认是 hash 模式 , 即使用 URL 的 hash 来模拟一个完整的 URL ,于是当 URL 改变时,页面不会重新加载。

vue-router源码解析(二)插件实现

2019-01-21
阅读 5 分钟
3.7k
vue-router 插件方式的实现 vue-router 是作为插件集成到 vue 中的。 我们使用 vue-router 的时候,第一部就是要 安装插件 Vue.use(VueRouter); 关于插件的介绍可以查看 vue 的官方文档 我们重点关注如何开发插件 如何开发插件 Vue.js 要求插件应该有一个公开方法 install。这个方法的第一个参数是 Vue 构造器,第二个参...

vue-router源码解析(一)

2019-01-21
阅读 2 分钟
7.6k
准备工作 Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。 这里主要通过阅读 vue-router 的源码,对平时使用较多的一些特性以及功能,理解其背后实现的思路。 阅读版本 : 3.0.2 目录结构 {代码...} 我们知道 , 我们在使用 vue-router 的时候 ,主要有以下几步: ...

Js高级编程笔记--面向对象的程序设计

2019-01-02
阅读 7 分钟
1.8k
理解对象 属性类型 1.数据属性 特性: Configurable : 表示能否通过 delete 删除属性,能否修改属性特性,能否把属性改为访问器属性 Enumerable : 表示能否通过 for in 循环返回 Writable : 表示能否修改属性的值 Value : 包含属性的值,读取或写入实际上操作的是这个值 2.访问器属性 特性: Configurable : 表示能否...

vue虚拟dom原理剖析

2018-12-28
阅读 1 分钟
8.7k
vue的虚拟dom是基于 snabbdom 改造过来的。了解 snabbdom的原理之后再回过头来看 vue的虚拟dom结构的实现。就难度不大了!

snabbdom源码解析(七) 事件处理

2018-12-26
阅读 5 分钟
2.7k
事件处理 我们在使用 vue 的时候,相信你一定也会对事件的处理比较感兴趣。 我们通过 @click 的时候,到底是发生了什么呢! 虽然我们用 @click绑定在模板上,不过事件严格绑定在 vnode 上的 。 eventlisteners 这个模块,就是定义了一些钩子,在 patch 的时候,能够进行事件的绑定以及解绑。 建议阅读这个篇章之前,先阅...

snabbdom源码解析(六) 模块

2018-12-26
阅读 6 分钟
2.6k
在 ./src/modules 里面,定义了一系列的模块 , 这些模块定义了相应的钩子 。这些钩子会在 patch 的不同阶段触发,以完成相应模块的功能处理

snabbdom源码解析(五) 钩子

2018-12-26
阅读 1 分钟
2.4k
文件路径 : ./src/hooks.ts 这个文件主要是定义了 Virtual Dom 在实现过程中,在其执行过程中的一系列钩子。方便外部做一些处理 {代码...} snabbdom源码解析系列 snabbdom源码解析(一) 准备工作 snabbdom源码解析(二) h函数 snabbdom源码解析(三) vnode对象 snabbdom源码解析(四) patch 方法 snabbdom源码解析...

snabbdom源码解析(四) patch 方法

2018-12-26
阅读 14 分钟
4.1k
patch 方法 前言 在开始解析这块源码的时候,先给大家补一个知识点。关于 两颗 Virtual Dom 树对比的策略 diff 策略 同级对比对比的时候,只针对同级的对比,减少算法复杂度。 就近复用为了尽可能不发生 DOM 的移动,会就近复用相同的 DOM 节点,复用的依据是判断是否是同类型的 dom 元素 init 方法 在 ./src/snabbdom.t...

snabbdom源码解析(三) vnode对象

2018-12-26
阅读 2 分钟
3.3k
vnode 对象 vnode 是一个对象,用来表示相应的 dom 结构 代码位置 :./src/vnode.ts 定义 vnode 类型 {代码...} 定义 VNodeData 的类型 {代码...} 创建 VNode 对象 {代码...} snabbdom源码解析系列 snabbdom源码解析(一) 准备工作 snabbdom源码解析(二) h函数 snabbdom源码解析(三) vnode对象 snabbdom源码解析(...

snabbdom源码解析(二) h函数

2018-12-26
阅读 2 分钟
3.9k
介绍 这里是 typescript 的语法,定义了一系列的重载方法。h 函数主要根据传进来的参数,返回一个 vnode 对象 代码 代码位置 : ./src/h.ts {代码...} 其他 h 函数比较简单,主要是提供一个方便的工具函数,方便创建 vnode 对象 snabbdom源码解析系列 snabbdom源码解析(一) 准备工作 snabbdom源码解析(二) h函数 sna...

snabbdom源码解析(一) 准备工作

2018-12-26
阅读 2 分钟
6.4k
阅读 vue 源码的时候,想了解虚拟 dom 结构的实现,发现在 src/core/vdom/patch.js 的地方。作者说 vue 的虚拟 DOM 的算法是基于 snabbdom 进行改造的。

使用 canvas 绘图

2018-12-25
阅读 5 分钟
3.7k
HTML5 添加的最受欢迎的功能就是<canvas>元素,这个元素负责在页面中设定一个区域,然后就可以通过 javascript 动态的在这个区域中绘制图形

js 任务

2018-12-24
阅读 2 分钟
2k
前言 先看一段代码 {代码...} 输出: promise 、global、 then、timeout macrotasks 和 microtasks 在 V8 实现中包含两种任务: macrotasks script ,setTimeout, setInterval, setImmediate, I/O, UI rendering microtasks process.nextTick, Promises, Object.observe, MutationObserver 执行过程如下: JavaScript 引...

http 与 https

2018-12-23
阅读 3 分钟
3.5k
http 协议是无状态的,同一个客户端的这次请求和上次请求是没有对应关系,对 http 服务器来说,它并不知道这两个请求来自同一个客户端。 为了解决这个问题, Web 程序引入了 Cookie 机制来维护状态.

underscore中的小技巧

2018-12-21
阅读 4 分钟
1.8k
这里为啥要用 obj === void 0, 而不是 obj === undefined 呢?因为,在 js 中,undefined 并不是类似关键字(js 关键字有 function,return ...),所以,理论上是可以更改的。事实上,在 IE8 上也的确是可以被更改的,

不定参数(rest 参数 ...)

2018-12-21
阅读 3 分钟
5.4k
这些方法都有一个共同点,就是可以传入不定数量的参数,例如,我想删除掉 array 中的 value1,value2 ,可以这样使用 , _.without(array,value1,value2);

编写可维护的代码

2018-12-20
阅读 9 分钟
2.6k
编写可维护的代码 前言 我们在修改他人代码的时候,阅读他人代码所花的时间经常比实现功能的时间还要更多 如果程序结构不清晰,代码混乱 。牵一发而动全身。那维护起来就更难维护了 可读性 可理解性:他人可以接手代码并理解它 直观性 : 代码逻辑清晰 可调试性 :出错时,方便定位问题所在 如何提高可读性 代码格式化 适...

利用 canvas 压缩图片

2018-12-20
阅读 6 分钟
9.1k
利用 canvas 压缩图片 前言 在一个移动端的项目中,图片上传是一个比较常用的功能。 但是,目前手机的随便拍的照片一张都要好几 M , 直接上传的话特别耗费流量,而且所需时间也比较长。 所以需要前端在上传之前先对图片进行压缩。 原理 要使用 js 实现图片压缩效果, 原理其实很简单,主要是: 利用 canvas 的 drawImage...

js 常用计算

2018-12-20
阅读 2 分钟
2.1k
这里右移动小数点需要先转成整形,再进一步处理是因为存在一些浮点数乘以 10 的倍数也会出问题!例如: 268.34*100 => 26833.999999999996

Promise 简单实现

2018-12-20
阅读 9 分钟
3.4k
Promise 简单实现 前言 你可能知道,javascript 的任务执行的模式有两种:同步和异步。 异步模式非常重要,在浏览器端,耗时很长的操作(例如 ajax 请求)都应该异步执行,避免浏览器失去响应。 在异步模式编程中,我们经常使用回调函数。一不小心就可能写出以下这样的代码: {代码...} 当你的需要异步执行的函数越来越...

基本排序算法

2018-12-19
阅读 3 分钟
1.6k
基本排序算法 在计算机科学中,一个排序算法是一种能将一串数据依照特定的排列方式进行排列的一种算法。 这里简单的介绍三种最基本的排序,分别是:冒泡排序、选择排序以及插入排序 排序的过程中,经常要用到交换元素位置,故抽离为公共函数 swap。 {代码...} 冒泡排序 冒泡排序是最简单的排序,一一对比相邻的两个数,...