- 博客(23)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 vue3相比vue2到底改变了啥（vue3新增了哪些新特性）
1、源码组织方式改了从flow改成了typescript使用monorepo管理项目结构2、新增composition APi（组合API）优点：一个基于函数的API。将同一功能逻辑的代码集合到一起。优化了之前项目大时，同一功能的逻辑代码分散的问题。可以更灵活的组织组件的逻辑3、性能提升响应式系统升级 （defineProperty变更为proxy）当有属性嵌套时，proxy默认只会监听第一层，只有访问内部某个属性时才会递归去处理下一级的属性编译优化vue3中会标记和提升静态根节
2021-11-02 23:50:01
5146
3
原创 vueRouter实现原理解析（从零实现一个简易版的vueRouter）
前一篇文章，我们说了vueRouter的两种路由模式，以及两种路由模式的特点，区别，今天我们通过来自己写一个简易版的vueRouter来剖析vueRouter内部的核心实现原理
2021-10-29 21:32:57
1553
6
原创 vue首次渲染全过程
昨天有朋友问我vue在页面第一次加载时到底做了些什么，看来这个问题在很多朋友心中可能还比较模糊，今天我们一起来详细的看看vue的首次渲染过程vue源码下载地址：vue源码了解vue首次渲染全过程，我们应该从哪说起呢，很明显，是不是应该从入口文件说起啊，即main.js1、vue初始化首先，我们看main.js中，第一个最关键的肯定是引入vue吧import vue from 'vue'其实，vue被打包后，dist文件夹中存在多个版本，分别是通用版本（UMD）：中的完整版 vue.js .
2021-04-17 22:19:54
4886
24
原创 一文让你学会封装自己的前端自动化构建工作流（gulp）
说起前端自动化构建，相信做过前端的小伙伴们都不会陌生，可能第一感觉就会想到webpack。但是，其实webpack本质意义上应该是一个强大的模块打包器，以入口文件为起点，结合文件间各种引用关系，将各种复杂的文件最终打包成一个或多个浏览器可识别的文件。所以说，webpack更大意义上是一个模块打包器，而非自动化构建工具。今天我们来介绍的是一款强大的自动化构建工具gulp常用自动化构建工具...
2021-04-11 22:30:09
2971
11
原创 node.js开发自己的脚手架工具以及利用yeoman开发自己的脚手架工具
本文先介绍一款通用脚手架（yeoman）的基本使用，然后再利用node.js来开发一个自己的脚手架工具。yeoman脚手架的本质也是通过node.js实现的什么是脚手架相信大家应该都用过脚手架，像create-react-app, vue-cli angular-cli等。应该也大概能知道脚手架具体是干嘛的，用来做什么。脚手架本质就是用来快速生成我们所需要的项目结构，但他最重要的意义却在于，提供了统一的规范约定。有助于我们团队项目的开发常用的脚手架工具像现在比较流行得 create-reac.
2021-04-09 11:16:29
2161
7
原创 vue 数据变化侦测原理详解（Array篇）
上周写了数据劫持原理Object篇，还欠大家一个Array篇，趁今天周末，补给大家吧。（最近实在是有点忙，补的有点忙，见谅见谅）前言：上周我们说了vue数据劫持原理Object篇，我们先来回顾下。Object数据侦测分为3个部分，依赖者wathcer(和实际依赖者一对一关系)，依赖的管理着Dep（也可以叫发布者），以及用于劫持数据的Observer。数据被劫持后，当获取数据时会触发get，而数据发生变化时会触发set。我们在get的时候收集依赖，即用dep去调用他的addSubs方法去添加wa.
2021-03-20 23:00:34
3032
12
原创 理解javascript中的函数式编程
javascript函数式编程是继面向过程编程和面向对象编程之后的又一种编程思想，在函数式编程思想中，主张函数是一等公民，旨在用函数的方式来抽象现实事物之间的联系。今天，我们一起来好好了解下函数式编程1、为什么要学习函数式编程函数式编程是随着 React 的流行受到越来越多的关注Vue 3也开始拥抱函数式编程函数式编程可以抛弃 this打包过程中可以更好的利用 tree shaking 过滤无用代码方便测试、方便并行处理有很多库可以帮助我们进行函数式开发：lodash、undersco.
2021-03-16 12:50:42
2333
6
原创 vue 数据变化侦测原理详解（Object篇）
vue 数据侦测是vue框架一块最为核心的模块之一，也是vue区别传统前端架构最重要的区别之一，那么它到底是怎么实现的。今天我们一起来看看吧vue的出现解决了什么问题大家都知道，angular,vue，react出来以前，我们前端的页面在数据发生变化时，都需要手动去操作dom来更新页面，获取使用模板引擎来进行页面的重新渲染。但是，这在项目越来越大越来越复杂的今天，传统的方式必然会产生很多问题。手动操作dom进行更新的话，项目一大，代码会非常杂乱，且不易维护使用模板引擎进行数据更新的话，当模板中.
2021-03-12 21:58:07
5823
14
原创 理解javascript类数组
js数组，相比大家都很熟悉，因为走到哪都要用，但它有个“双胞胎弟弟” ，叫类数组（也叫伪数组），可能有的人了解，有的人不了解，今天我们来看一看。什么是类数组顾名思义，这玩意儿肯定是个长得像数组，但又不算数组的东西。那到底是个啥，其实它就是一个对象，一个长的像数组的对象。和数组的区别那类数组和数组有啥区别：1、都有length属性2、类数组也可以for循环遍历，有的类数组还可以通过 for of 遍历3、类数组不具备数组的原型方法，因此类数组不可调用相关数组方法（如，push,slicec.
2021-03-06 20:07:17
6674
21
原创 vue 虚拟dom和diff算法详解
虚拟dom是当前前端最流行的两个框架（vue和react）都用到的一种技术，都说他能帮助vue和react提升渲染性能，提升用户体验。那么今天我们来详细看看虚拟dom到底是个什么鬼虚拟dom的定义与作用什么是虚拟dom大家一定要记住的一点就是，虚拟dom就是一个普通的js对象。是一个用来描述真实dom结构的js对象，因为他不是真实dom，所以才叫虚拟dom。虚拟dom的结构从下图中，我们来看一看虚拟dom结构到底是怎样的如上图，这就是虚拟dom的结构，他是一个对象，下面有6个属性.
2021-03-02 12:36:17
38461
51
原创 typescript 用法详解
typescript 现在是越来越流行和普遍了，那么为什么在javascript的基础上又会出现一个typescript呢。typescript有些什么特点呢。今天我们一起来看一看javascript 的痛点我们都知道，javascript是一个弱类型、动态类型的语言。他会带来哪些问题弱类型变量的数据类型不是固定的，我们可以给一个变量赋值多种不同类型的值。这样可能代码编写时会更简单，但当项目变大时，可能会给项目带来一定的隐患，也不便于多人合作function add (a, b) { re.
2021-01-15 13:44:49
2663
原创 javascript 对象的深拷贝与浅拷贝
今天我们来谈一谈对象的深拷贝和浅拷贝吧我们都知道，js数据类型主要分为两大类 基础数据类型和引用（复杂）数据类型。基础数据类型存在于栈内存中，当被拷贝时，会创建一个完全相等的变量而引用数据类型存在于堆中，存储的是一个内存空间，而赋值给变量的，仅仅是这个内存空间的一个引用而已。而就会出现一个问题，当我们将一个对象赋值给另一个变量时，赋值的是对象的引用，必然导致两个变量都指向同一个内存空间，其中一个改变时，必然会影响到另一个。浅拷贝和深拷贝的理解什么是浅拷贝简单理解就是自己创建一个新的对.
2021-01-13 18:45:30
1413
原创 javascript 数组相关方法（函数）整理 记不全的可以看看
今天整理下javascript和数组相关的所有方法（函数）吧。感兴趣的可以收藏以后多看看生成数组相关方法1、Array构造函数2、Array.of()3、Array.from()数组原型方法添加删除类1、push()和 pop()2、unshift() 和 shift()操作数组类5、join()6、slice()7、splice()8、fill()9、concat()10、sort()11、reverse()12、copyWithin()13、flat() 和 fl.
2021-01-13 12:21:55
1419
2
转载 vue一些常见面试题
vue的一些常见面试题，可以看看，先保留下原文转载于 https://www.cnblogs.com/MJ-MY/p/11612112.html
2021-01-04 16:00:49
663
原创 vue this.$nextTick核心原理剖析 超详细，认真看你一定看的懂
上篇文章vue生命周期中我们说过一个句话，那就是mounted中并不会保证所有子组件都被挂载完成后再触发，因此当你希望视图完全渲染完成后再做某些事情时，请在mounted中使用$nextTick。那么$nextTick到底是干嘛用的，为什么能解决我们以上的问题。下面我们来好好了解了解$nextTick。但在此之前，如果不懂js事件循环的人，请先去看下什么是js事件循环，因为要理解$nextTick，必须得先理解js事件循环js事件循环回顾下面我们先简单得回顾下什么是事件循环(具体理解请看这 js事件.
2021-01-04 15:42:24
14069
40
原创 超详细vue生命周期解析(详解)
vue是每一个前端开发人员都绕不过的一个技术，在国内的市场占有量也是非常的大，我们大部分人用着vue, 却不知道他内部其实经历了一些什么。每个生命周期又是什么时候开始执行的。我们今天来详细的看一看首先，生命周期是个啥？借用官网的一句话就是：每一个vue实例从创建到销毁的过程，就是这个vue实例的生命周期。在这个过程中，他经历了从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程。那么这些过程中，具体vue做了些啥，我们今天来了解一下。语述了解之前，我们先贴上一张官网的.
2020-12-25 14:37:22
129788
56
原创 javascript 执行上下文与上下文this
上下文this是一个面试频率非常高问题，今天我们一起来了解了解this执行上下文首先，我们先来看看什么是执行上下文前一篇文章我们有说到过，代码运行环境主要分为两类全局运行环境函数运行环境而javascript代码的运行，主要分为两个阶段编译阶段执行阶段代码编译主要由编译器完成，而代码执行，由js引擎完成，而执行上下文，其实就是在执行阶段创建的。代码每进入到一个运行环境，都会创建一个当前环境的执行上下文。而执行上下文在创建的时候，会做以下事情首先会生成变量对象：上篇文章我们.
2020-12-09 18:48:04
1326
4
原创 javascript作用域链详解
今天我们来看看js作用域链，我们先带着一个疑问去看后面的内容。什么疑问呢，我们都知道的一个常识是，一个函数内，我们可以访问这个函数外的变量，或者可以访问全局变量，但是有没有想过，他为什么可以访问啊。而且，当函数外和函数内都定义了一个相同变量时，为什么只取函数内的变量，而不取函数外的呢。javascript到底是怎么处理的呢。带着这个疑问，我们来看下面的文章要理解作用域链，首先我们得理解几个概念执行环境：javascript代码执行所处得环境，他定义了环境内变量及函数所能访问的其他数据（包括外部数据.
2020-12-08 18:20:57
1879
原创 ES6 Promise源码解析 （从Promise功能的角度看Promise源码实现）
上一篇，我们说了Promise的用法详解。今天趁周末有空，我们来继续看一看Promise源码。下面，我将从Promise功能的角度一步一步来看每步的功能是怎么实现的首先，我们再来回顾一下Promise的基本用法，看代码new Promise((resolve, reject) => { try { if (success) { resolve() } if (fail) { reject().
2020-11-30 11:27:48
10004
20
原创 深入剖析javascript的事件循环机制 Event loop
如何js事件循环 是当前各大公司问的非常频繁的一个问题。很多人估计大概知道js事件循环是个什么东西，单可能在脑子里的概念又比较模糊，无法深入的理清楚。那么事件循环到底是个什么东西。今天我们来好好了解一下。
2020-11-05 16:15:56
2754
15
原创 关于事件那些事
前端 关于事件的那些事事件是各位前端大佬们工作中避免不了的东西，大家肯定都不陌生。那么大家是否有更为细致的了解事件呢。今天我们一起来探讨探讨，有写的不好或者不对的地方，欢迎各位大佬修正。事件，就是文档或浏览器窗口发生的一些特定的交互瞬间。也就是说html于javascript脚本之间的交互其实就是通过事件来完成的那么，想要了解事件，有些概念就必须知道了，分别是：事件流事件处理程序事件对象1、事件流是什么我们可以简单的理解为 事件流就是描述从页面中接收事件的顺序2、事件流有哪几种我们都
2020-11-03 16:28:07
1518
2
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人