gaofan_long的博客

原创 生日一点记录

后来，公司说不给报学费了，我也是非常沮丧，但是我还是战胜自己，去参加考试了，考完之后，一下解放了，最近每晚和沈耀龙看三国。今天是我的生日，我现在坐在中关村互联网创新中心，国科量子通信网络有限公司5层的办公室里，天气寒冷，但是阳光不错，我坐在这里能看到联想的楼，百度的楼，坐在这里，仿佛过去的就在眼前。个人成长上来说，今年6月份开始考研考试，七月份准备北大的面试，也是准备的很用心，我记得从看到，总体来说，还是一直在坚持，但是没有用心，在这个过程中，确实能看到自己的心态在其中的变化。我们的测试真无聊，真恶心。

原创 啥是React Fiber？

react-fiber

原创 React 常问问题

react面试题总结

转载 vue常问面试题

Vue组件的渲染更新原理解析 - ming1025 - 博客园

原创 图森-面试题

vue的渲染原理？Domdiff的过程是怎么比较的？广度优先怎么构建父子关系？先渲染子组建，再渲染fu组建？广度优先怎么比较？？原型链的组合挤成？$nexttick的的原理？举例说明vuex的原理？怎么把store挂载在每一个组建上，它内部做了什么事情？t s的泛型工具有哪些？<T>是什么泛型工具？es5是怎么继承，比较完美的继承方法是什么，达到和es6一样的继承，手写一个组合继承。原型链上也需要实现继承，原型链的指向？git使用的多的，如果修改message信息。如

原创 浏览器线程有哪些

浏览器中包含什么？三个常驻线程？浏览器基础结构主要包含七个部分：用户界面：用户所看到的内容和与之交互的功能组件，比如按钮、表单等等 浏览器引擎：负责控制和管理下一级的渲染引擎 渲染引擎：解析用户请求的内容并返回 网络：负责处理网关相关事宜，比如http服务 UI后端：负责绘制一些提示框等UI组件，底层使用的是操作系统的用户接口 js解析器：负责解析和执行js代码 数据存储：负责存储数据如cookie等浏览器是多线程的，js是单线程的，浏览器至少包含三个常驻线程：js引擎线程：基于事

原创 防抖和节流

防抖的代码： 节流的代码：

原创 【无标题】问题记录—— （掌阅）

为什么选择用fis3， fi3解决什么问题？vue2中怎么检测数组？使用了函数劫持的方式，重写了数组的方法，Vue将data中的数组进行了原型链重写，指向了自己定义的数组原型方法。这样当调用数组api时，可以通知依赖更新。如果数组中包含着引用类型，会对数组中的引用类型再次递归遍历进行监控。这样就实现了监测数组变化。vue的生命周期？创建和挂载有什么？ 发一个异步的请求，适合放在哪个生命周期？vue2中怎么实现deep: true， 怎么实现的？当用户指定了watch中的deep属性为t.

原创 vue2.0和vue3.0的区别（加油）

1.重构响应式系统，使用Proxy替换Object.defineProperty，使用Proxy优势：•可直接监听数组类型的数据变化•监听的目标为对象本身，不需要像Object.defineProperty一样遍历每个属性，有一定的性能提升•可拦截apply、ownKeys、has等13种方法，而Object.defineProperty不行•直接实现对象属性的新增/删除2.新增Composition API，更好的逻辑复用和代码组织3.重构 Virtual DOM•模板编译时的优化，

原创 vue响应式数据流学习

原创 函数式编程、面向对象编程、面向过程编程

函数式编程：它属于"结构化编程"的一种，主要思想是把运算过程尽量写成一系列嵌套的函数调用。举例来说，现在有这样一个数学表达式。1. 代码简洁，开发快速函数式编程大量使用函数，减少了代码的重复，因此程序比较短，开发速度较快。2. 接近自然语言，易于理解函数式编程的自由度很高，可以写出很接近自然语言的代码。前文曾经将表达式(1 + 2) * 3 - 4，写成函数式语言：　　subtract(multiply(add(1,2), 3), 4)对它进行变形，不难得到另一种写法：

原创 日常问题记录

面试问题记录

原创 观察者模式和发布订阅模式的区别

观察者模式是只有两个参与者，消息发布者和订阅者，是松耦合的编程方式。订阅者必须要知道发布消息的是谁。发布订阅模式是有三个参与者,发布者， 代理中心， 订阅者， vue和react使用了发布订阅模式...

原创 微前端知识的学习

【微前端】single-spa 到底是个什么鬼_波哥在路上-CSDN博客1. 为什么要使用微前端？微前端的演化和后端微服务有一样的地方，主要是为了拆分业务模块，每一部门业务模块都可以单独构建部署，能够提高复用性。微前端中的每个应用可以使用单独的技术框架，可以根据开发人员的技术栈选择不同的技术，提高了开发效率对大型，复杂的项目，做了拆分，能够简化业务，减少耦合，提高程序的健壮性对时间较久的项目，在进行新增需求时， 可以单独使用新技术开发。有利于项目长久发展。(1) 若多个应用之间公用一

原创 nodejs

nodejs中的异步Io操作nodejs中事件循环的队列

转载 webpack中的chunk

Webpack 理解 Chunk - 掘金Webpack 理解 Chunk期望希望读过本篇文章，你在看Webpack配置的时候，能在脑中形成Chunk的生成过程。ChunkChunk不同于entry、 output、module这样的概念，它们对应着Webpack配置对象中的一个字段，Chunk没有单独的配置字段，但是这个词出现在CommonsChunkPlugin（Webpack3以前）、optimization.splitChunks（Webpack4以后）这样的名称之中。Chu

原创 白龙马运行科技

1. 浏览器的事件模型。2. promise可以中断吗？为什么？ 如何模拟promise的阻断？3. async和await ？实现原理？await后面跟一个什么？ 执行出错怎么办？ 异步操作，解决回调地狱4. 导致内存泄漏有哪些情况？ 怎么解决内存泄漏？5. 浏览器和node的事件循环？eventloop6. 同步任务执行完成之后，微任务和宏任务的执行？你知道微任务有哪些？网络请求是微任务还是宏任务？ setTimeout和promise.then是怎么执行的？7...

原创 flex布局

flex最常用的语法：（熟练掌握）flex-direction:主轴的方向（可横向可纵向）justify-content：主轴对齐方式（开始对齐、两边对齐...）align-items:交叉轴对齐方式（和主轴垂直的轴）flex-wrap:什么时候换行align-self：子元素在交叉轴的对齐方式（开始对齐、居中对齐...）实现一个三点的骰子：.box{display:flex;//flex布局justify-content:space-between;//两端对齐}.item{/..

原创 浏览器输入一个url开始

　　从用户在浏览器输入域名开始，到web页面加载完毕，这是一个说复杂不复杂，说简单不简单的过程，下文暂且把这个过程称作网页加载过程。下面我将依靠自己的经验，总结一下整个过程。如有错漏，欢迎指正。　　阅读本文需要读者已有一定的计算机知识，了解TCP、DNS等。2、分析　　众所周知，打开一个网页的过程中，浏览器会因页面上的css/js/image等静态资源会多次发起连接请求，所以我们暂且把这个网页加载过程分成两部分：html(jsp/php/aspx) 页面加载(假设存在简单的Nginx负载均衡

原创 cookie、session、localStrorage、sessionStrorage

前端面试常问cookie、session、localStrorage、sessionStrorage区别以及应用场景置顶 欢少的成长之路 2021-02-21 20:44:05 44 收藏分类专栏： 转型后原理底层讲解 文章标签： 前端面试 session localStrorage sessionStrorage cookie版权简介：以上文章讲述的是【线上系统打如何正确打日志】接下来我总结一下【前端面试常问sessionStrorage、localStrorage、cookie、sessi..

原创 React常见考点

React1.event是SyntheticEvent（合成事件），模拟出来DOM事件所有能力2.event.nativeEvent是原生事件对象3.所有的事件，都被挂载到document上4.和DOM事件不一样，和Vue事件也不一样event.nativeEvent.target指向当前元素，即当前元素触发event.nativeEvent.currentTarget指向document!Vue1.event是原生的2.事件被挂载到当前元素和DOM事件一样...

原创 vue_高级特性

怎么理解MVVM模型：M - model 数据V - view 视图VM - viewModel 视图模型组件化、、数据驱动视图、使开发人员不再关注具体DOM的渲染，而将精力放到对数据的处理上。view - 视图model - vue组件中的dataviewModel - 让数据的更改同步到DOM的渲染，视图上监听事件将变化同步到数据中...

原创 Vue常用面试题（二）

Vuev-show 和 v-if 的区别？为何 v-for 中要用 key？描述 Vue 组件生命周期（有父组件的情况）？Vue 组件如何通讯？描述组件渲染和更新的过程？双向数据绑定 v-model 的实现原理？ReactReact 组件如何通讯？JSX 本质是什么？context 是什么，有何用途?shouldComponentUpdate 的用途（SCU）？描述 redux 单项数据流？setState 是同步还是异步？webpack 前端代码为何要进行构建和打包？.

原创 Vue常用面试题

条件渲染1.v-if只会渲染出符合条件的节点，v-show都会渲染，只是将不符合条件的隐藏2.如何选择？判断为一次性的或者更新并不频繁的选择v-if,频繁的选择v-show如果更新频繁用v-if会涉及到节点的不断销毁和渲染,影响性能考点：beforeDestroy中要可能要做什么？解除绑定，销毁子组件以及事件监听器。自定义事件的绑定要解除；比如setTimeout定时任务要销毁；自己绑定的window或document的事件要销毁；该销毁的不要遗留在内存中考点：父子组件 crea.

原创 前端性能优化

前端性能优化：前端性能优化原则： 多用内存，缓存，减少网络耗时和cpu计算（用空间换时间）让加载更快1. 减少资源体积，压缩代码，比如：webpack生产环境打包代码；服务器端进行gzip压缩，能把代码压缩到1/3左右2. 减少访问次数：合并代码（css代码可以合并，图片可以通过雪碧图合并），SSR服务器端渲染，缓存3. 使用 更快的网络：CDN（根据区域获取最近的资源）让渲染更快1. css放在head，JS放在body最下面2. 尽量早开始执行JS，用DOMContentLoa

原创 浏览器加载过程

浏览器加载过程： 加载过程：1. DNS解析 ：把域名变成IP地址，大型网站不同地区IP地址是不一样的2. 浏览器根据IP地址向服务器发起Http请求 （包括三次握手）3. 服务器处理http请求，并返回给浏览器渲染过程1. 浏览器根据HTML代码生成DOM树2. 浏览器根据css代码生成CSSOM3. 将DOM树和CSSOM整合形成Render 树（渲染树），只有DOM树是无法渲染的，因为有些标签的css属性是在CSSOM中的4. 浏览器根据render 树渲染页面5. 如果遇到.

原创 永辉面试题

目录1. css写一个三角形，写一个梯形？2. js的宏任务和微任务的执行顺序？输出下面的值的顺序？3. new 的过程是怎么样？4. 数组的常用方法，map和filter手写一下实现？5. call 和apply ,bind 的区别？6. 箭头函数了解吗？7. 一个url从访问到浏览器绘制的过程？再往深说一下，涉及到缓存相关的，怎么处理？8. script标签有defer和async这两个标签是什么意思？9. vue和react有什么区别？10. vue是如何实现数

原创 京东物流——前端面试题

目录1. 地图用到什么技术？2. canvas 和svg?1.什么是Canvas？Canvas 是H5新出来的标签Canvas画布，利用JavaScript在网页绘制图像在标签中给上宽高： 不用加单位如果在css中给宽高 会对图像造成拉伸 （默认宽高300px*150px）通过过去绘制工具 .getContext(“2d”) 来在画布中绘制图形2.什么是SVG？SVG 可缩放矢量图形（Scalable Vector Graphics），基于可扩展标记语言XML 出来的

原创 JS异步

event looppromise 进阶async/await微任务/宏任务问答题：请描述event loop（事件循环/事件轮询）的机制，可画图什么是宏任务、微任务，两者有什么区别Promise有哪三种状态，如何变化场景题：promise then和catch的连接（常考且实用）async/await语法promise和setTimeout的顺序（常考）外加async/await的顺序问题（好题，综合深入）1. event loopJS如何执行？1.从前到后，..

原创 DOM和BOM

从 JS 基础知识到 JS Web API：1. JS基础知识，规定语法（ECMA 262 标准）2. JS Web API， 网页操作的API（W3C标准）3.前者是后者的基础，两者结合才能真正实际JS Web APIDOM：操作网页上的DOM元素怒BOM：操作浏览器上的一些事情，导航，宽高等事件绑定：绑定时间，监听点击之类ajax：发送网络请求存储：浏览器暂存数据vue和react框架应用广泛，封装了DOM操作题目：DOM是哪种数据结构DOM操作的常用APIatt.

原创 http知识点

参考链接：https://segmentfault.com/a/11900000159693

原创 JS基础面试题

1.js作用域作用域：变量的合法使用范围全局作用域：在全局可以使用函数作用域：只能在函数块中使用块级作用域（ES6新增）：let，const定义的变量有块级作用域{}内部使用自由变量：1.一个变量在当前作用域没有定义，但是被使用了2.向上级作用域，一层一层一次寻找，知到找到为止3.如果到全局作用域都没找到，则报错：xxx is not define2. 闭包闭包：作用域应用的特殊情况，有两种表现：1.函数作为返回值2.函数作为参数闭包：所有自由变量的查找，是在函数定

原创 HTML+CSS 面试题

1.vh 和vWrem的弊端：具有 阶梯性 ，就是不太连贯吧。网页视口尺寸：1. window.screen.height // 屏幕高度2. window.innerHeight // 网页视口高度3. document.body.clientHeight // body 高度vh 网页视口高度的 1 / 100vw 网页视口宽度的 1 / 100vmax 取两者最大值；vmin 取两者最小值1.html语义化,增加代码可读性,让搜索引擎更容易读懂(seo)2.块状.

原创 360面试题

1. css固定左右，中间宽度自适应，如何写？ 考察知识：通过position左右固定, 中间代码设置margin, 不设置宽度2. 原型链，两个function， 实现继承。 三种方式：1. 利用call和apply//原型继承// 原型继承// 1. 利用call, apply继承function Person(name, age) { this.name = name; this.age = age; this.sayName = ...

原创 TypeScript常见面试题

http://www.srcmini.com/3507.html

原创 前端面试————DOM 和BOM

https://blog.csdn.net/qq_41800649/article/details/108983069

原创 ES6语法学习

ES6语法学习

原创 JS基础--es5基础知识

es5基础知识

原创 UML类图的画法

类图的中常见的关系有：泛化、实现、组合、聚合、关联、依赖泛化：是一种继承关系，表示一般和特殊的关系，子类特殊化父类的所有行为和特征，比如：老虎是动物的一种，既有老虎的特性又有动物的特性。实现：类和接口的关系，类是接口的所有特征和行为的实现关联：是一种拥有关系，它使一个类知道一个类的属性和方法，比如老师和学生，丈夫和妻子聚合：是整体和部分的关系，部分脱离整体是可以单独存在的，比如：公...

转载 手把手教你用vue-cli搭建vue项目

本篇主要是利用vue-cli来搭建vue项目，其中前提是node和npm已经安装好，文章结尾将会简单提到一个简单的例子。使用vue-cli搭建项目最开始我也是看网上的教程一步步搭下来，所以其中的一些步骤说法为了表达正确会进行一定参考。一、 项目使用技术、框架简单介绍我们使用vue-cli来搭建整个项目，vue-cli就是一个脚手架，步骤很简单，输入几个命令之后就会生成整个项目，里面包...