- 博客(76)
- 收藏
- 关注
RSS订阅原创 图解GC（垃圾回收）标记-清除算法
GC标记-清除算法(Mark Sweep GC)GC标记-清除算法自问世以来，一直到半个世纪后的今天，依然是处理各类程序的所用的经典算法。典型的标记-清除算法很简单，现在更常用的是与其他的算法巧妙结合达成意想不到的效果。GC标记-清除算法顾名思义，就是标记和清除。标记活动的对象，清除没有标记或者是说没有在活动的对象。标记：在标记阶段中,垃圾收集器会给所有活动打上标记即...
2021-10-07 22:41:33
335
原创 图解GC（垃圾回收）
图解GC(垃圾回收三种增量式垃圾回收图解GC(垃圾回收)引用计数法延迟引用计数法Sticky引用计数法1位引用计数法部分标记-清除法GC(垃圾回收算法)复制算法Cheney的复制算法复制算法加强版(2)近似深度优先算法复制算法加强版(3) 多空间复制算法标记-压缩加强版 Two-Finger算法保守式GC准确式垃圾回收算法保守式GC加强版(1)间接引...
2021-10-07 00:33:56
153
原创 V8垃圾回收机制的理解
一、为什么要有垃圾回收在C语言和C++语言中，我们如果想要开辟一块堆内存的话，需要先计算需要内存的大小，然后自己通过malloc函数去手动分配，在用完之后，还要时刻记得用free函数去清理释放，否则这块内存就会被永久占用，造成内存泄露。但是我们在写JavaScript的时候，却没有这个过程，因为人家已经替我们封装好了，V8引擎会根据你当前定义对象的大小去自动申请分配内存。...
2021-10-05 15:47:55
148
原创 过滤器
import Vue from 'vue';import config from '@/config';// 类型转换文本Vue.filter('statusToTextf', (value) => {let o = config.statusMapf.find(item => value === item.value)return o ? o.label...
2021-08-23 22:19:55
93
原创 Vuex
indeximport Vue from 'vue'import Vuex from 'vuex'import user from '@/store/modules/user.js'import yernews from '@/store/modules/yernews.js'import basics from '@/store/modules/basics.js...
2021-08-23 11:06:08
218
原创 性能优化
当修改一个数据时，不想整个页面都被重新渲染，只想要渲染变更数据的那一部分，怎么做？选择合适的框架，vue和react都使用了虚拟dom加diff运行，找出最小化的差异并更新到真实dom中，只会改变发生变化的dom,不会渲染整个页面。并为列表中每一个节点添加唯一的key值，提高diff运算的速度。让数据变为响应式的，如：vue中，当页面初始化时候，vue会遍历data对象所有...
2021-04-18 09:27:56
89
原创 深入Vue响应式
Vue 响应式原理vue的响应式实现主要是利用了Object.defineProperty的方法里面的setter 与getter方法的观察者模式来实现。在组件初始化时会给每一个data属性注册getter和setter，然后再new 一个自己的Watcher对象，此时watcher会立即调用组件的render函数去生成虚拟DOM。在调用render的时候，就会需要用到dat...
2021-03-16 23:40:06
275
原创 Vue的性能优化
1、首屏加载优化2、路由懒加载{ path:'/', name: 'home', component: () => import('./views/home/index.vue'), meta: { isShowHead: true }}3、开启服务器 Gzip开启 Gzip 就是一种压缩技术，需...
2021-03-10 14:11:18
80
原创 computed和watcher的区别？watch实现原理？watch有几种写法？
computed和watcher的区别？watch实现原理？watch有几种写法？计算属性computed :1、 支持缓存，只有依赖数据发生改变，才会重新进行计算2、 不支持异步，当computed内有异步操作时无效，无法监听数据的变化3、computed 属性值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data中声明过或者父组件传递的prop...
2021-01-20 22:09:43
279
原创 React路由
## react生态中路由通常是使用react-router来进行配置，其主要构成为：(1)Router——对应路由的两种模式，包括<BrowsersRouter>与<HashRouter>；(2)route matching组件——控制路径对应的显示组件，可以进行同步加载和异步加载，<Route>；(3)navigation组件——用...
2021-01-13 23:24:16
66
原创 React生命周期函数
React生命周期函数第一阶段：装载阶段3constructor()render()componentDidMount()第二阶段：更新阶段2shouldComponentUpdate()render()componentDidUpdate()第三阶段：卸载阶段1componentWillUnmount()constructor生命周期：(1)当reac...
2021-01-11 23:27:36
277
原创 immutable
immutable 基础入门什么是immutableimmutable(不可改变的)immutable是一种持久化数据。一旦被创建就不会被修改。修改immutable对象的时候返回新的immutable。但是原数据不会改变。原理：持久化数据结构为什么要使用immutable在Rudux中因为深拷贝对性能的消耗太大了(用到了递归，逐层拷贝每个节点)。但当你使用imm...
2021-01-11 16:06:08
109
原创 Vue和React中diff算法区别
Vue和React中diff算法区别vue和react的diff算法，都是忽略跨级比较，只做同级比较。vue diff时调动patch函数，参数是vnode和oldVnode，分别代表新旧节点。1.vue对比节点。当节点元素相同，但是classname不同，认为是不同类型的元素，删除重建，而react认为是同类型节点，只是修改节点属性。2.vue的列表对比，采用的是两端到...
2021-01-08 22:58:13
1709
原创 Redux 和 Vuex 的设计思想
Redux 和 Vuex 的设计思想Flux的核心思想就是数据和逻辑永远单向流动，由三大部分组成dispatcher(负责分发事件),store(负责保存数据，同时响应事件并更新数据)和view(负责订阅store中的数据，并使用这些数据渲染相应的页面)，Redux和Vuex是flux思想的具体实现，都是用来做状态管理的工具，Redux主要在react中使用，Vue...
2020-12-18 19:08:57
560
原创 React
React一、概述官网：https://reactjs.org/中文网(个人翻译站)：https://react.docschina.org/1、介绍React起源于Facebook的内部项目，它是一个用于构建用户界面的javascript库，Facebook用它来架设公司的Instagram网站，并于2013年5月开源。React拥有较高的性能，代码逻辑非常简单，...
2020-11-06 08:19:28
340
原创 给网站添加PWA
给网站添加PWA PWA 是一种渐进式网页应用理念，全称为 Progressive Web App，效果就是使用 Google 或 Edge 等支持 PWA 的浏览器打开我网站后地址栏最右边有的个圆圈小加号，点击小加号就可以将网站像桌面应用一样安装成独立APP 这个应用不仅支持 pc 端，也可以在手机上体验，操作很简单，打开网站后将站点添加到主...
2020-10-22 13:09:00
508
原创 axios的简单封装
axios的封装// 使用axios用于对数据的请求import axios from 'axios'// 创建axios实例const instance = axios.create({ baseURL: baseURL + version, timeout: 5000})// 创建请求的拦截器instance.interceptors.request...
2020-10-18 07:04:38
66
原创 Webpack
WebPack一、概述官网：https://webpack.js.org中文网：https://www.webpackjs.com指令：npm run serve(启动开发服务器)npm run build(打包上线的代码)1、webpack是什么？webpack是一种前端资源构建(打包)工具(npm run build)，一个静态模块打包器。在webpa...
2020-10-14 05:27:02
108
原创 React 事件绑定原理
React 事件绑定原理一、react并没有使用原生的浏览器事件，而是在基于VirtualDOM的基础上实现了合成事件，采用小驼峰命名法，默认的事件传播方式是冒泡，如果想改为捕获的话，直接在事件名后面加上Capture即可；事件对象event也不是原生事件对象，而是合成对象，但通过nativeEvent属性可以访问原生事件对象；二、react合成事件主要分为以下三个过程...
2020-10-08 22:27:45
2691
原创 Git包管理工具
git包管理工具，加入一个项目组，正式开始开发，一般有以下几个步骤：1、git clone [email protected] ——使用git clone克隆远程项目到本地，克隆到本地后只有一个分支master2、git checkout -b test ——本地创建一个test分支并为测试环境代码分支并切换至test，这里根据原项目仓库的测试环境代码分支命名，有些使用dev，这...
2020-09-10 23:46:12
176
原创 微信小程序
微信小程序微信小程序原理微信小程序采用 JavaScript、WXML、WXSS 三种技术进行开发,本质就是一个单页面应用，所有的页面渲染和事件处理，都在一个页面内进行，但又可以通过微信客户端调用原生的各种接口微信的架构，是数据驱动的架构模式，它的 UI 和数据是分离的，所有的页面更新，都需要通过对数据的更改来实现小程序分为两个部分 webview 和 appServi...
2020-09-10 17:43:06
68
原创 Vue 等单页面应用的优缺点
Vue 等单页面应用的优缺点// 优点1、单页应用的内容的改变不需要重新加载整个页面，web应用更具响应性和更令人着迷。2、单页应用没有页面之间的切换，就不会出现“白屏现象”,也不会出现假死并有“闪烁”现象3、单页应用相对服务器压力小，服务器只用出数据就可以，不用管展示逻辑和页面合成，吞吐能力会提高几倍。4、良好的前后端分离。后端不再负责模板渲染、输出页面工作，后端API通用...
2020-08-13 13:47:34
650
原创 Vue响应式原理
你知道Vue响应式数据原理吗？Proxy 与 Object.defineProperty 优劣对比？// 响应式原理vue的响应式实现主要是利用了Object.defineProperty的方法里面的setter 与getter方法的观察者模式来实现。在组件初始化时会给每一个data属性注册getter和setter，然后再new 一个自己的Watcher对象，此时wat...
2020-07-05 11:19:00
355
原创 对MVC，MVP，MVVM的理解
对MVC，MVP，MVVM的理解mvc 和 mvvm 其实区别并不大。都是一种设计思想。主要就是 mvc 中 Controller 演变成 mvvm 中的 viewModel。mvvm 主要解决了 mvc 中大量的 DOM 操作使页面渲染性能降低，加载速度变慢，影响用户体验。和当 Model 频繁发生变化，开发者需要主动更新到 View 。MVVM 是 Model-View...
2020-06-11 05:07:05
80
原创 基于Vue和Element-ui组件库搭建的后台管理系统
1. 电商管理后台 API 接口文档说明前端：https://gitee.com/Cola163/system后台: https://gitee.com/Cola163/system-server1.1. API V1 接口说明接口基准地址：http://127.0.0.1:8888/api/private/v1/服务端已开启 CORS 跨域支持API V1 认...
2019-11-02 20:25:53
258
原创 基于Vue结合Vant组件库的仿电影APP
Vue综合案例Vue综合案例一、项目概要1、效果前瞻2、开发流程3、开发环境二、初始化及必要知识点1、初始化远程仓库2、创建项目3、路由规划4、反向代理配置5、网络请求封装6、vant组件配置三、功能实现(1)1、导航实现1.1、底部导航1.2、顶部导航2、电影模块2.1、正在热映列表2.2、即将上映列表2.3、电...
2019-10-08 16:54:28
1496
原创 Vue基础
vue全称Vue.js，是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，方便与第三方库或既有项目整合。安装方式下面是3种引用方式，开发环境表示js文件未压缩，方便开发时阅读源码，而生产环境代表js代码进...
2019-09-06 06:35:56
65
原创 Node05
跨域问题浏览器的同源策略限制了前端跨域请求数据同源策略：协议、域名、端口号三者必须相同，有一个不相同即为跨域跨域解决方案cors服务端代理请求jsonp res.send(mycb+'({"name":"zs","age":13})')前端本地服务器代理请求const express = require('express')const a...
2019-07-20 02:30:54
1683
原创 Node04
API文档地址：https://apidocjs.com/安装：npm install apidoc -g项目根目录创建 apidoc.json{ "name": "用户", "version": "0.1.0", "description": "用户登录、注册接口文档", "title": "接口文档", "url" : "http://127...
2019-07-16 17:23:15
53
原创 Node03
MongoDB 非关系型数据库1.下载安装包：https://www.mongodb.com/download-center/community2.安装流程：next勾选同意 -> next选择complete去掉Install MongoDB as a Service -> next去掉Install MongoDB Compass -> ne...
2019-07-15 16:36:11
501
原创 Node02
创建http客户端http.get()http.request()const https = require('https')let url = 'https://m.you.163.com/xhr/index.json?__timestamp=1600266481664'https.get(url,(res)=>{ let resData = '' ...
2019-07-13 03:35:39
54
原创 Node01
nodejs简介nodejs什么是?node.js 是一个基于 Chrome V8 引擎的 JavaScript runtime(运行环境)node.js官网node.js中文node.js社区为什么学nodejs?了解前后端交互流程能够自己写api接口防止甩锅，明确前后端职责范围为了更高的薪资nodejs的特点单线程非阻塞I/O(input...
2019-07-10 04:51:07
50
原创 设计模式
设计模式设计模式：针对特定问题的简洁而优雅的解决方案。这些优秀的解决方案经过了大量实际项目的验证。通俗一点说，设计模式就是给这些优秀的解决方案取个名字。设计模式最初是静态类型语言中的设计模式，但设计模式实际上是解决某些问题的一种思想，与具体使用的语言无关。类型设计模式分为三种类型，共23种。创建型模式：单例模式、抽象工厂模式、建造者模式、工厂模式、原型模式。结构...
2019-06-26 03:29:16
95
原创 jQuery扩展
jQuery扩展$.extend()方法jQuery.extend([boolean],target [，object1] [，objectN])[boolean] 表示是否深拷贝，默认false 浅拷贝当提供两个或多个对象参数时，其他对象的属性将合并到目标对象。var obj1 = {a: 1, b: 2, c: {d: 4, e: 5}};var obj2 = ...
2019-06-20 07:48:04
55
原创 jQuery事件
jQuery事件blur()focus()click()dblclick()keyup()keydown()mouseenter()mouseleave()mouseover()mouseout()mousedown()mousemove()mouseup()change()select()submit()scroll()resize()r...
2019-06-16 23:49:24
52
原创 jQuery
jQueryjQuery简介jQuery也就是JavaScript和查询(Query)即 辅助JavaScript开发的类库。jQuery是一个兼容多浏览器的javascript库。核心理念是 write less,do more (写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布，吸引了来自世界各地的众多Jav...
2019-06-12 02:46:33
56
原创 原型及原型链
原型及原型链JavaScript是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言。在所有语言中，JavaScript 几乎是独一无二的，也许是唯一的可以被称为“面向对象”的语言，因为可以根本没有类而直接创建对象的语言很少，而 JavaScript 就是其中之一。在 JavaScript 中，类不能(因为根本不存在类)描述对象可以做什么，对象可以直接定义它自己...
2019-05-08 00:30:59
258
原创 闭包
闭包(closure)闭包的概念官方对闭包的解释是：一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数)，因而这些变量也是该表达式的一部分。闭包是指有权访问另一个函数作用域中的变量(参数)的函数闭包就是能够读取其他函数内部变量(参数)的函数闭包可以理解成定义在一个函数内部的函数函数就是闭包当一个函数能够记住并访问到其所在的词法作用域及作用域链，特别强调...
2019-05-02 14:44:53
64
原创 Event Loop
事件循环机制(Event Loop)JavaScript引擎是单线程，也就是说每次只能执行一项任务，其他任务都得按照顺序排队等待被执行，只有当前的任务执行完成之后才会执行下一个任务。任务分为同步任务和异步任务同步任务：var t = Date.now();console.log('Hi');if (true){ console.log(123) } 异步...
2019-04-28 20:21:04
44
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人