- 博客(19)
- 收藏
- 关注
RSS订阅原创 唯心主义蠢货的[vue学习] Vue的nextTick
$nextTick简介Vue 异步执行 DOM 更新。只要观察到数据变化，Vue 将开启一个队列，并缓冲在同一事件循环中发生的所有数据改变。如果同一个 watcher 被多次触发，只会被推入到队列中一次。这种在缓冲时去除重复数据对于避免不必要的计算和 DOM 操作上非常重要。然后，在下一个的事件循环“tick”中，Vue 刷新队列并执行实际 (已去重的) 工作。Vue 在内部尝试对异步队列使...
2020-02-24 23:21:10
143
原创 唯心主义蠢货的[vue学习] Vue数据的监听原理
Vue数据的监听如何监听vue2.0Object.defineProperty() 只能对属性进行数据劫持，不能对整个对象进行劫持，同理无法对数组进行劫持，但是我们在使用 Vue 框架中都知道，Vue通过遍历属性或者数组的项进行观察，实现数据劫持，我们查看相关代码如下： /** * Observe a list of Array items. */ observeArra...
2020-02-23 18:14:09
422
原创 唯心主义蠢货的[网络相关] https的加密过程和http的版本比较
http详细内容https加密过程HTTPS与HTTP的一些区别HTTPS协议需要到CA申请证书，一般免费证书很少，需要交费。HTTP协议运行在TCP之上，所有传输的内容都是明文，HTTPS运行在SSL/TLS之上，SSL/TLS运行在TCP之上，所有传输的内容都经过加密的。HTTP和HTTPS使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。HTTPS可以有效...
2020-02-18 21:12:48
207
原创 唯心主义蠢货的[网络相关]前端缓存
前端缓存1.http缓存分为以下三种情况发起http请求，浏览器没有该请求的缓存结果和缓存标识（同第一次请求），则向服务器发起http请求发起http请求，存在请求的缓存结果和缓存标识,已经失效，使用协商缓存【即携带缓存标识向服务器进行请求】如果服务器发现资源未更新，返回304，协商缓存生效如果资源进行更新，则返回200和请求结果，协商缓存失效，将新的结果存入浏览器缓存中...
2020-02-14 17:46:34
193
原创 唯心主义蠢货的[vue学习] vue实现组件间通信的方法
vue实现组件间通信的方法1. props + $emit这是我们最常用到的方法，props是单向数据流，通过父组件向子组件传递数据可以使用props，但是如果子组件子元素向父元素传参的话，则需要this.$emit(‘methodName’,‘data’)的方式向父组件抛出事件,在父组件中使用v-on进行接收参数// father.vue<template> &...
2020-02-04 16:06:45
158
原创 唯心主义蠢货的[js知识总结] 事件处理和垃圾回收机制
事件处理和垃圾回收机制事件处理机制过程分析JavaScript是单线程执行的，现在推行的多线程执行，都可以理解成伪多线程，事件循环是实现异步的机制更具体来讲：js的事件大体可以分为两种，Macrotask宏任务，Microtask微任务，循环机制为先执行宏任务，一个宏任务结束后执行内部对应的微任务，然后再执行下一个宏任务Macrotask: script(整体代码),setTime...
2019-12-02 17:11:56
316
原创 唯心主义蠢货的[js知识总结] 原型和原型链、类型判断
原型和原型链、类型判断js原型的出现1.构造函数js设计之初，是作为提供网络交互的简易脚本语言，设计者并未想设计类，但需要有一种机制将所有对象联系起来，设计者借用了new关键字，但后边跟的并不是类名，而是直接的构造函数function test(){ // 实际上这样就定义了一个构造函数 this.name = "test"}let x = new test() // new对象...
2019-12-02 13:58:45
245
原创 唯心主义蠢货的[UI组件_4]走马灯
实现可选卡片化的走马灯组件卡片化效果非卡片化效果逻辑分析与代码实现整体结构整体分为carousel和carousel_item，通过$parent 和 $children 进行父子间组件的选择，类似发布订阅模式carousel：包含slot插槽，显示窗口和indicator指示器，控制走马灯的整体效果，包括item的显示方式，如何进行切换，切换速度，以及一些相关事件操作caro...
2019-11-25 17:15:54
559
原创 唯心主义蠢货的[js知识总结] new和对于argument和..arg的补充
new和对于argument和…arg的补充new过程分析通过console.log( new object) 我们发现 我们根据test模板，新建了一个对象，对象有对应的属性，proto中有对应的方法和构造器过程新建一个对象将模板的所有属性赋值给这个属性改变内部的this指向返回这个对象问题js的构造函数是允许出现返回值的，当出现返回值时返回结果为对象和非对象时分别...
2019-11-19 20:58:57
445
原创 唯心主义蠢货的[js知识总结] call apply bind改变this指向
手撸bind apply call 改变函数的this指向call.(obj,arg1,arg2,arg3…)call的用法：首先传入一个对象，再传入对应的参数进行解构赋值，返回函数结果。错误情况：call中没有传入参数，则默认obj为window代码实现函数调用.call来改变内部的this指向，所以我们可以在Function.prototype中再新增添一个方法作为我们自己的c...
2019-11-19 16:55:38
180
1
原创 唯心主义蠢货的[js知识总结] this指向
this指向正常this指向原则：this指向最后调用它的【对象】！当函数预处理时，确定 作用域链，VO（变量对象），this指向，但此时的this指向是针对于谁来调用这个函数,对于函数内部 this变量并没有定义，仍然为undefined，当执行当前函数时，VO -> AO 变量对象里的this确定指向。this的指向不是在代码编译的时候确定的，而是在执行到函数调用语句时才确...
2019-11-17 20:15:36
220
原创 唯心主义蠢货的[js知识总结] 执行上下文(VO,AO)和闭包
执行上下文(VO,AO)和闭包执行上下文 Excution Context概念当某个函数被调用时，会创建一个执行环境（execution context）及相应的作用域链。然后，使用 arguments 和其他命名参数的值来初始化函数的活动对象（activation object）。但在作用域链中，外部函数的活动对象始终处于第二位，外部函数的外部函数的活动对象处于第三位，……直至作...
2019-11-16 21:25:01
569
原创 唯心主义蠢货的[js知识总结] 手写一个promise
promise用法分析流程分析promise通过一个接收一个函数进行实例化此函数接收两个参数，一个为fulfill时进行的处理，一个为reject时进行的处理当exector函数在promise内部进行执行时，修改promise的value和status在then和catch中，根据status进行条件判断关于优化的点exector为异步调用时如何实现then的链式调用...
2019-11-16 21:10:01
217
原创 唯心主义蠢货的[js知识总结] 变量部分(变量类型 深浅拷贝 变量提升)
变量1.变量类型js的变量类型有两种基本类型: null undefined number boolean string symbol(ES6)是存放在栈中的简单数据段，按值储存，所以可以按值访问，大小由类型确定，内存空间大小可以分配引用类型: object(function array 都是基于object拓展出来的 typeof arr == ‘object’，涉及...
2019-11-14 15:43:32
186
原创 唯心主义蠢货的[一些demo] 做一个时钟吧_vue版
实现效果分析部分重复渲染的操作一般是通过设置原基础div状态，然后绑定旋转修饰的点 通过v-for渲染内部点60次，将transform:‘rotate(’+item*6+‘deg)’，动态绑定到点上同样的对于时针、分针、秒针的操作，也是基于以上思路：原div进行基础定位，然后伪元素进行细节修改对于伪元素伪元素默认为inline元素，无法响应width和height，设置d...
2019-10-28 21:28:53
160
原创 唯心主义蠢货的[UI组件_3]Loading加载(css练习)
实现效果line型point型解决的问题vue.directive的相关使用练习css制作loading动画position踩到的部分坑代码实现Vue部分vue部分的结构很简单整体用visible控制是否显示用if else判断loadingStyle分别渲染point型和line型的loading动画对于point型，通过for渲染9个点，然后在css中对点进...
2019-10-28 21:06:28
143
原创 唯心主义蠢货的[UI组件_2]如何写一个全局通过函数调用的弹窗
实现效果解决的问题vue.use的使用/ vue.extend+mount 和 vue.component的区别如何使用prototype实现全局通过函数调用弹窗效果的实现，以及对应弹窗的排版和回调函数的执行如何实现弹窗的拖拽效果 （v-directive 拖拽指令）问题相关知识vue.usevue.install源码分析/* istanbul ignore if ...
2019-10-24 15:09:45
146
原创 唯心主义蠢货的[UI组件_1]如何写一个侧边栏
最终效果基本功能判断是否有二级菜单代码结构如下:点击显示/隐藏二级菜单代码结构如下:根据是否存在submenu控制二级菜单的显示关于route部分 （可看代码位置）添加伸长收缩动画原思路（获取dom）获取dom，设置element.style.height这样的方法,以下是踩到的坑：element.style.height不能获取clas...
2019-10-16 15:48:30
249
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人