手摸手从0实现简版Vue --- (模板编译)

2020-03-07
阅读 3 分钟
1.5k
接: 手摸手从0实现简版Vue --- (对象劫持) 手摸手从0实现简版Vue --- (数组劫持) 1. 如果有用户传入了el,去调用$mount方法 在前面对数据进行inintState之后,如果用户配置了el属性,会通过调用$mount方法,将数据渲染到页面上,此时: {代码...} $mount 此时的$mount需要做两件事: 通过用户配置的el字段,获取DOM元...

手摸手从0实现简版Vue --- (数组劫持)

2020-03-07
阅读 2 分钟
2.6k
前面已经完成了对data数据里对象的劫持,但是针对数组的变化,Object.defineProperty 不能很好的支持,所以在Vue 中,采取了对数组原生方法进行劫持的操作,来保证数据可以被正常监测到。

手摸手从0实现简版Vue --- (对象劫持)

2020-03-07
阅读 4 分钟
1.1k
npm i webpack webpack-cli webpack-dev-server html-webpack-plugin --save-dev

浏览器的缓存机制

2019-07-27
阅读 2 分钟
1.5k
​ 在前端开发中,性能一直是一个非常重要的部分,其中一个非常重要的判断标准就是一个网页打开的速度,其中一个提高网页反应速度的非常重要的方式就是利用浏览器的缓存机制,良好的缓存策略可以降低资源的重复加载提高网页的整体加载速度,减少请求的延迟,降低网络负荷。

JavaScript 的几个小技巧

2019-07-12
阅读 2 分钟
1.6k
JavaScript 的几个小技巧 1. 尽早 return {代码...} 将无效的用例尽早返回,避免意外和不必要的代码处理。 2. 用对象映射方式替代分支语句 {代码...} 分支语句的处理方式导致函数代码量大,要覆盖所有的逻辑分支。 要添加一种新的 type 就需要再添加一个分支判断 3. 多重判断时使用 Array.includes 或者 !~Array.indexOf...

彻底搞懂JavaScript执行机制

2018-08-29
阅读 3 分钟
1.3k
彻底搞懂JavaScript执行机制 首先我们大家都了解的是,JavaScript 是一门单线程语言,所以我们就可以得出: JavaScript 是按照语句顺序执行的 首先看: {代码...} 这个显然大家都知道结果,依次输出1,2 然而换一种: {代码...} 这个时候再看代码的顺序执行,输出1,2, 3, 4。好了放到浏览器运行一下,什么?输出居然...

bind的模拟实现

2018-08-28
阅读 3 分钟
2.2k
bind() 方法会创建一个新的函数。当这个新函数被调用时,bind() 的第一个参数会作为它运行时的this,之后的参数将会在传递的实参前传入作为它的参数。

使用模拟实现的方式探究call 和 apply 的原理

2018-08-28
阅读 2 分钟
1.1k
使用模拟实现的方式探究call 和 apply 的原理 call 作用: call() 方法就是在使用一个指定 this 值和若干个指定的参数值的前提下调用某个函数或者方法。 {代码...} 也就是说call()改变了 this 的指向到了 foo 。 下面进行一下模拟实现 试想当调用 call 的时候,也就是类似于 {代码...} 这样就把 this 指向到了 foo 上,...

从闭包引出来的一系列问题

2018-08-28
阅读 3 分钟
1.5k
从闭包引出来的一系列问题 1. 不起眼的开始 {代码...} 很明显,由于异步的作用。到最后输出的结果为6个5 如果用箭头表示前后两次输出有1s的间隔,用,代表前后一起输出,那么输出结果是5->5,5,5,5,5 这个也很容易的就可以进行解释,先执行console.log(),再进行setTimeout()的异步操作。 追问1:如果变成 5 -> 0,1...

从例子来看BFC

2018-08-27
阅读 1 分钟
2.4k
BFC 首先BFC的英文全称Block Format Context,也就是块级格式化上下文。 BFC特性 首先,我们大家都知道的BFC特性: 内部的元素会在垂直方向,从顶部一个接一个的放置 Box垂直方向的距离由margin决定,属于同一个BFC的两个相邻Box的margin会发生重叠。 每个元素的margin box的左边,与容器块border box的左边相接触(对于...

JavaScript中的深浅拷贝

2018-08-25
阅读 2 分钟
2k
深浅拷贝 {代码...} 从上面的例子可以发现,如果给一个变量赋值一个对象,那么两者的值会是同一个引用,其中一方改变,另一方也会相应改变。 解决这个问题,可以引入浅拷贝: 浅拷贝 可以使用Object.assign 来解决这个问题 {代码...} 使用ES6展开运算符(...)解决 {代码...} 通常浅拷贝能解决大部分的问题,但是当遇到,...

由闭包引出的垃圾回收

2018-08-25
阅读 2 分钟
7.1k
闭包 是指有权访问另一个函数作用域中的变量的函数,创建闭包最常见的方式就是在一个函数内部创建l另一个函数,通过另一个函数访问这个函数的局部变量

从雅虎军规看前端性能优化

2018-08-09
阅读 8 分钟
2.6k
雅虎军规上说明80%的响应时间都来自前端,大多数页面的加载时间都是在下载图片,样式,js,flash等,减少组件的数量反过来减少请求的数量是页面加载更快的关键。

模拟Vue实现MVVM双向绑定

2018-08-01
阅读 7 分钟
2.5k
实现MVVM主要包含两个方面,一个是数据变化更新视图,另一个则是对应的试图变化更新数据,重点在于怎么实现数据变了,如何去更新视图,因为视图更新数据使用事件监听的形式就可以实现,比如input标签通过监听input 事件就可以实现。所以重点是如何实现数据改变更新视图。