- 博客(132)
- 收藏
- 关注
RSS订阅
原创 前端开发必会的网络硬知识
网络基础是一劳永逸的东西。什么是TCP/IP协议？什么是HTTP协议？TCP/IP协议分为四层：应用层（DNS 域名系统,HTTP协议，FTP 文件传输协议）、传输层（TCP 传输控制协议,UDP用户数据报协议）、网络层（IP协议 一条传输路线）、链路层（处理连接网络的硬件部分）发送端=》每通过一层，就增加首部应用层： http数据传输层：tcp首部+http数据网络层：i...
2020-04-13 23:19:12
1044
2
原创 前端开发必会的JavaScript硬知识
参考：https://blog.csdn.net/zhaolandelong/article/details/88564665**JS = ES + DOM(文档对象类型) + BOM(浏览器对象类型)**知识点1. js数据类型及判断2. 闭包与作用域3. this与执行上下文4. 原型链与继承（原型、构造函数、实例）5. 异步任务6. ES6+常用特...
2020-03-30 17:40:38
375
原创 前端开发必会的HTML/CSS硬知识
知识点盒模型 选择器优先级 水平垂直居中 浮动与清除浮动 flex布局 H5新特性 CSS动画 CSS预处理器（Autoprefixer）真题请说出3个H5新增的块元素，并介绍他们的应用场景aside:表示article元素内容之外，与article元素内容相关的辅助信息。（当前文章的其他引用， 备注，侧边栏，广告等有别于主要内容的部分）figure:代表一个...
2020-03-28 23:29:24
360
原创 JS单线程之eventloop
EventLoop是什么？前言： eventloop即事件循环，是指浏览器或Node的一种解决JAVASCRIPT单线程运行时不会堵塞的一种机制，也就是我们经常使用异步的原理。简短：异步解决方案。浏览器的实现：根据html5规范明确定义。node的实现：libuv实现（恐龙头像）–thread pool (关键)google和node都是用v8引擎，但是处理不一样。EventLoop是...
2020-03-08 15:56:04
207
原创 Webpack学习笔记
为什么要使用构建工具？转换ES6语法(浏览器的兼容)转换JSXcss前缀补全/预处理器压缩混淆图片压缩webpack的脚本const path = require('path')module.exports = { mode: 'production', entry: './src/index.js', output: { filename: 'bundle.js',...
2020-03-04 16:22:48
322
原创 接口容灾~
> yes -> 读数据-> end。-> yes -> 有缓存tag?-> no -> 有缓存？接口容灾本意是预防发生接口服务挂了的场景，我们不会很被动。原来是P0的故障，能被它降低为 P2、P3，甚至在某些场景下都不会有用户反馈。-yes->（构建标识cdnUrl）数据正常?请求-> cdn白名单？2. 线下indexdb缓存。1. 线上cdn缓存。
2023-11-29 22:57:12
478
原创 前端性能优化
输入URL到整个页面经历了什么过程？加载慢，交互卡web性能：打开速度，动画效果，表单提交，列表滚动，页面切换定义：客观度量和可感知的用户体验减少整体加载时间：减少文件体积 减少http请求 使用预加载 使网站尽快可用：仅加载首屏内容，其他内容懒加载 平滑和交互性：css代替js 减少ui重绘 感知表现：加载动画，滚动条，骨架屏等提示信息 性能测定： 性能指标、性能测定、性能监控持续优化如何优化？性能指标 - 多快算快？ 专业的工具可量化地评估出网站或应用的性能表现 立足网
2022-03-01 21:05:39
702
1
原创 Vue3快速上手
一、认识Vue1.了解相关信息vue3 2020年9月发布 开发两年多 vue3支持vue2大多数特性 更好地支持ts2.性能提升打包大小减少41% 初次渲染快55% 更新渲染快133% 内存减少54% 使用proxy代替defineProperty实现数据响应式 重写虚拟DOM的实现和Tree-Shaking3.新增特性Composition(组合)API setup 1. ref和reactive 2.computed和watch 3.新的生命周期函数 4.p
2022-01-28 15:48:44
794
原创 typescript
一、 ts的简单认识认识+深入理解+熟练使用vue3支持tsts是微软开发的开源、跨平台编程语言。在2012年发布。作者是安德斯.海尔斯伯格（C#首席架构师）。TS => { {ES} + interfaces + strongly types + generic(泛型)}ES => { {JS} + proto types + dynamic types + constructor functions }TS comfiles to JS ( brower can't
2022-01-28 13:52:42
1328
原创 Promise的实现
const PENDING = 'pending'const FULFILLED = 'fulfilled'const REJECTED = 'rejected'function Promise(executor){ let self = this self.state = PENDING self.value = null self.reason = null self.onFulfilledCallbacks = [] self.onReject.
2020-05-13 09:17:30
257
原创 腾讯音乐一面
2020/05/11自我介绍 小程序页面监控怎么做？怎么监控视频加载延迟问题？直播视频用的是什么协议？用的是什么函数？用什么标签？同层渲染问题？ react的生命周期？react16.3前后的变化？ vue的生命周期？key的作用？ promise的实现？与async的区别 缓存，html的缓存时间如何设置？js、和css怎么设置缓存？ http2.0的优点？说一下与http1.0的区别，如何用在项目上？（多路复用）...
2020-05-12 08:53:20
419
1
原创 静态资源分域的原因
启用新的域名，每次请求浏览器不携带cookie。（对cookie内容大，流量大的网站来说，节省了不少宽带费用） 动静分离(动态内容和静态资源分离)，有利于部署cdn HTTP对同一域名的并发数为6。（优化速度） 静态资源独立部署，为全局产品服务 有利于最大利用客户端缓存（比如访问taobao.com，缓存了tbcdn.cn上的某个js文件，之后再访问tmll.com时，也用到此js文件，不必再从tbcdn.cn上下载，直接用客户端缓存即可。）...
2020-05-11 19:00:18
215
原创 区别：window-onload和document-ready
document.readyDom树加载完执行window.onload页面资源（比如图片、媒体资源,加载速度远慢于dom加载速度）加载完执行document.ready比window.onload先执行
2020-05-11 18:44:16
167
原创 js闭包的题目
letgo=(function(){letv='go'returnfunction(val){v+=valif(val==='l')returnvreturngo}}())console.log(go('l'))console.log(go('o')('l'))console.log(go('o')('o')('l'))golg...
2020-05-11 08:28:10
307
原创 js的小题目
let user = { cnt: 1, u: { g() { return this.cnt } }}let o = user.u.gsetTimeout(function(){ console.log('2', user.u.g()) },0)console.log('1', o())1 undefined2 undefined
2020-05-08 18:06:59
141
原创 JS的链式调用
function Man(name) { let that = this this.task = [] let fn = ()=>{ console.log(name) that.next() } this.task.push(fn) setTimeout(function(){ that.ne...
2020-05-08 07:59:53
131
原创 金额千分位隔开
functionchange(money){letarr=[]letrest=''money=String(money)letindex=money.indexOf('.')if(index){rest=money.substring(index)money=mon...
2020-04-28 23:28:36
216
原创 快速排序算法
function quicksort(arr, l, r) { if(l >= r) return let left = l, right = r, pivot = arr[left] while(left < right) { while(left < right && arr[right] >= ...
2020-04-27 17:49:40
112
转载 「前端进阶」高性能渲染十万条数据(时间分片)
使用 requestAnimationFrame 与setTimeout相比，requestAnimationFrame最大的优势是由系统来决定回调函数的执行时机。如果屏幕刷新率是60Hz,那么回调函数就每16.7ms被执行一次，如果刷新率是75Hz，那么这个时间间隔就变成了1000/75=13.3ms，换句话说就是，requestAnimationFrame的步伐跟着系统的刷新步...
2020-04-24 12:23:39
421
原创 js变量声明和定义的区别
变量声明不开辟内存，只是告诉编译器，要声明的部分存在，要预留部分的空间。变量定义开辟内存。函数的定义1.函数的定义是一个完整的函数单元，包含函数类型、函数名、形参及形参类型、函数体等。2.在程序中，函数的定义只能有一次3.函数首部与花括号间不加分号函数的声明1.函数声明只是对编译系统的一个说明，是对定义的函数的返回值的类型说明，以通知系统在本函数中所调用的函数是什么类型。2...
2020-04-23 22:18:58
1748
原创 timer=null和clearInterval(timer) 不得不说的区别
typeof timer === 'number' => trueclearInterval(timer) 将定时器暂停，但是timer变量本身仍然存在.。达到保留对象的目的，以便再次使用 var timer=setInterval(function(){},1000);$("div").mouseenter(function(){ //鼠标放上去关闭，离开再次启动...
2020-04-23 18:35:55
2866
原创 bell 前端笔试题
1. relative、absolute、static、fixed的作用，相对谁定位？relative:相对元素在文档中的初始位置定位absolute:相对于定位元素定位，最顶级是bodystatic:文档流fixed:相对于窗口定位2. 如何实现一个div垂直水平居中？1）父元素设置display: flex;justify-content: center;...
2020-04-23 12:41:46
378
原创 Webpack经典题目 --- 精髓
1、webpack与grunt、gulp的不同？webpack是模块打包器，grunt是任务运行工具,gulp是流式任务运行工具webpack通过entry入口，识别模块依赖列表，通过loaders转换器转换模块，通过plugins监听，最后输出打包文件。grunt和gulp通过run()转换文件。grunt未处理完的放.tmp/,两者处理完的放dest(本地磁盘)。2、与w...
2020-04-23 09:42:32
429
转载 「前端进阶」高性能渲染十万条数据(虚拟列表)
转载：https://www.cnblogs.com/caominjie/p/11802501.html前言在工作中，有时会遇到需要一些不能使用分页方式来加载列表数据的业务情况，对于此，我们称这种列表叫做长列表。比如，在一些外汇交易系统中，前端会实时的展示用户的持仓情况(收益、亏损、手数等)，此时对于用户的持仓列表一般是不能分页的。在高性能渲染十万条数据(时间分片)一文中，提到了可以使用...
2020-04-20 10:03:41
1736
原创 请你说一下web Quality （无障碍）
能够被残障人士使用的网站才能称得上一个易用的（易访问的）网站。残障人士指的是那些带有残疾或者身体不健康的用户。使用alt属性，浏览器至少可以显示或读出有关图像的描述。例如：<img src="person.jpg" alt="this is a person"/>有时候浏览器会无法显示图像。具体的原因有：l 用户关闭了图像显示l 浏览器是不支持图形显示的迷...
2020-04-13 23:40:21
1072
原创 请你讲一下js监听对象属性的改变具体是怎么实现的，它们各自有什么特点？
(1)在ES5中可以通过Object.defineProperty来实现已有属性的监听Object.defineProperty(user,'name',{ set：function(key,value){ } })缺点：如果id不在user对象中，则不能监听id的变化(2)在ES6中可以通过Proxy来实现var user = new Proxy({}，{ set：func...
2020-04-13 23:38:40
630
原创 JAVASCRIPT经典设计模式
##设计模式开篇程序设计六大原则单一原则：降低代码耦合度里氏替换原则依赖倒置原则接口隔离原则迪米特法则开闭原则总结：1、在设计程序的时候，职责要尽可能的独立、单一，不要混在一起，混在一起的话，耦合度太高，不安全。2、如果一些功能用到了很多次，尽可能的用继承，但是继承不能够去覆写父类的内容。3、为了让我们的代码更...
2020-04-13 22:44:51
114
原创 总结五种题型
前端页面加载流程，TCP请求到页面交互前端框架对比，react、vue的区别理解函数式组件的产生背景和优势，理解js class组件被react、vue抛弃的原因js基础知识，结合实际业务应用场景优化方案，建议从TCP请求到接口请求到页面绘制今晚附上答案...
2020-03-27 08:02:41
158
原创 简述Vue的响应式原理
data的属性被转换成getter和setter,并且记录相应的依赖。当它被改动时，会通知相应的依赖。所有的组件实例都有相应的watcher实例，而watcher实例会依赖相应的setter。当数据变化的时候，会调用setter，而setter会通知watcher实例，watcher会更新相应的视图图：data 属性 - > { getter， setter }组件 -...
2020-03-27 07:56:03
730
原创 进程、线程基础知识
转：https://www.cnblogs.com/qianqiannian/p/7010909.html硬知识：计算机的核心是CPU，承担计算机的所有计算任务; 计算机的管理者是操作系统，负责任务的调度，资源的分配和管理，统领整个计算机硬件；应用程序是具有某种功能的程序，程序运行在操作系统上。大部分操作系统的任务调度是采用时间片轮转的抢占式调度方式CPU执行效率高，时间片段，在各个任务之间...
2020-03-26 16:54:24
471
原创 客串三七互娱
1、var cfunction Test() { var a = 0 c = function () { a++ }}Test()c()c()Uncaught ReferenceError: a is not defined 这个不是闭包2、
2020-03-25 22:36:06
206
原创 0324错题总结
1、css解析： link和@import的区别1）link是xhtml标签，无兼容性问题；@import在css2.1提出，低版本浏览器不支持。2）link可以加载css，js；@import只能加载js3）link加载的内容是与页面同时加载；@import需要页面网页完全载入以后加载4）link方式样式的权重高于@import的。用法：1）link的写法( r...
2020-03-24 15:28:11
178
原创 面试经典题目--原生ajax
ajax是一种异步请求数据的技术，对用户体验和程序性能有帮助新建一个ajax对象var xmlhttpif(window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest() }else { xmlhttp = new ActiveXObject()}连接服务器open(method[GET, POST], url (服务器的地址，相...
2020-03-24 14:37:57
138
原创 [,1,,2,,3]
```javascriptlet array = [,1,,2,,3];array = array.map((i) => ++i)ES5orEach(), filter(), reduce(), every() 和some()都会跳过空位。map()会跳过空位，但会保留这个值join()和toString()会将空位视为undefined，而undefined和null会被...
2020-03-23 17:55:38
295
原创 五大浏览器四大内核
IE ( Trident )Chrome ( Blink )safari ( webkit )firefox ( Gecko )opera ( Blink )
2020-03-23 17:15:04
182
转载 npm ERR!无法安装任何包的解决办法
转：https://blog.csdn.net/weng423811758/article/details/51537594PS F:\LargeFrontEnd\vue-admin> npm installnpm ERR! code ENOTFOUNDnpm ERR! errno ENOTFOUNDnpm ERR! network request to http://registr...
2020-03-19 15:15:27
4815
3
原创 Jquery的load加载本地文件出现跨域错误的解决方案
转载：https://www.cnblogs.com/jing-tian/p/10820839.html如果用原生的AJAX是加载本地文件就不会出现错误。当然，这个jquery的load放在服务器上通过http加载还是支持的。也有例外比如在firefox和ie浏览器使用$.ajax加载本地html或txt文件时,不会报错。当其他浏览器控制台弹出下面报错，表明这个不支持跨域浏览本地文件：Acc...
2020-03-11 11:58:56
2777
1
原创 node最基本的读写文件api
var fs = require(‘fs’)1、写 --同步写 有返回值判断写入是否成功var res = fs.writeFileSync('./www/w1.txt', '第一个文件', 'utf8')console.log(res) //undefinedconsole.log(111)2–异步写fs.writeFile('./www/t1.txt', '111111...
2020-03-10 15:45:56
200
原创 最简单的node服务
准备：node环境。1、shell命令： mkdir NodeTest 新建NodeTest文件夹2、cd NodeTest 进入文件夹3、touch app.js 新建app.js文件4、编写app.js文件，先开启服务const http = require('http')const myServer = http.createServer(function(req, res)...
2020-03-10 15:38:25
864
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人