![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端面试
文章平均质量分 66
welnee
这个作者很懒,什么都没留下…
展开
-
JavaScript 中判断数据类型的几种方法及其特点
1、typeof对于基本数据类型,null不能准确判断,会显示为object对于引用类型,数组类型不能准确判断,会显示为object2、instanceof原理:通过原型链进行判断[] instanceof Array // true{} instanceof Object // truenew String('welnee') instanceof String // true实现:function myInstanceof(left, right) { left = l原创 2021-02-15 16:09:25 · 206 阅读 · 0 评论 -
better-scroll框架优化了什么
详见:如何在vue框架中better-scroll插件优点:体验像原生:滚动非常流畅,而且没有滚动条。记录当前路由滚动位置:在vue中通过路由切换页面时组件会自动滚动到顶部,需要监听滚动行为才能让滚动位置固定,better-scroll解决了这个问题。...原创 2020-12-02 16:18:49 · 270 阅读 · 0 评论 -
浏览器Web安全相关知识
1、常见六大Web安全攻防解析2、web安全:CSRF攻击原理以及防御完成 CSRF 攻击必须要有三个条件:1、用户已经登录了站点 A,并在本地记录了 cookie2、在用户没有登出站点 A 的情况下(也就是 cookie 生效的情况下),访问了恶意攻击者提供的引诱危险站点 B (B 站点要求访问站点A)。3、站点 A 没有做任何 CSRF防御...原创 2020-11-08 02:20:15 · 149 阅读 · 0 评论 -
说说 keep-alive 的实现原理
keep-alive如何实现缓存?1、Vue keep-alive的实现原理2、浅析Vue中keep-alive实现原理以及LRU缓存算法3、聊聊keep-alive组件的使用及其实现原理4、keep-alive实现原理原创 2020-10-24 01:40:06 · 923 阅读 · 0 评论 -
前端模块化相关
1、模块化开发2、ES6的 module 和 CommonJS 的差异:1、CommonJS模块输出的是一个值的拷贝, ES6 module 模块输出的是值的引用。● CommonJS旦输出一个值,模块内部的变化就影响不到这个值。● ES6的 import 只是产生一个只读引用,原始值改变后,import加载的值也会发生变化。2、CommonJS 模块是运行时加载, ES6 module 模块是编译时输出接口。运行时加载: CommonJS 模块就是对象;即在输入时是先加载整个模块,生成一个原创 2020-10-24 01:01:32 · 84 阅读 · 1 评论 -
Webpack相关面试题汇总
1、Webpack是什么2、Webpack篇3、再来一打 Webpack 面试题4、Loader 和 Plugin 有什么区别Loader 和 Plugin 的区别loader & plugin5、说说Webpack构建流程Webpack 构建流程简单说一下Webpack的构建流程及原理Webpack构建流程:Webpack在启动后,会从Entry开始,递归解析Entry依赖的所有Module,每找到一个Module,就会根据Module.rules里配置的Loader原创 2020-10-23 00:25:45 · 324 阅读 · 0 评论 -
说说图片懒加载原理
详见:懒加载和预加载原创 2020-10-22 22:02:42 · 165 阅读 · 0 评论 -
说说你知道的前端优化有哪些?
1、前端性能优化2、CSS渲染优化3、前端性能优化之雅虎35条军规原创 2020-10-22 00:51:25 · 198 阅读 · 0 评论 -
说说DOM事件机制
1、DOM事件机制2、event事件属性:e.target与事件委托简例原创 2020-10-21 23:31:39 · 343 阅读 · 0 评论 -
说说回流和重绘
详见:重绘和重排如何减少回流和重绘?使用 transform 替代 top使用 visibility 替换 display: none。因为前者只会引起重绘,后者会引发回流(改变了布局)不要把节点的属性值放在一个循环里当成循环里的变量不要使用 table 布局,可能很小的一个小改动会造成整个 table 的重新布局动画实现的速度的选择,动画速度越快,回流次数越多,也可以选择使用requestAnimationFrameCSS 选择符从右往左匹配查找,避免节点层级过多...原创 2020-10-21 10:42:23 · 148 阅读 · 0 评论 -
说说 TCP 为什么是三次握手,而不是两次或四次?
详见:TCP 为什么是三次握手,而不是两次或四次?原创 2020-10-19 00:26:04 · 167 阅读 · 0 评论 -
前端Vue面试题汇总(持续更新...)
1、前端面试之 vue 篇2、vue 生命周期钩子函数有哪些,分别什么时候触发?3、vue 中 computed 和 watch 的区别,以及适用场景4、vue 的父组件和子组件生命周期钩子执行顺序5、vue 的响应式原理:Vue源码解读一:Vue数据响应式原理Vue响应式原理Observer、Dep、Watcher理解vue源码分析之响应式原理(Watcher、Observer、Dep)过程:1、使用Object.defineProperty将data数据变成响应式对象,通过Obs原创 2020-10-18 00:43:49 · 355 阅读 · 1 评论 -
CSS实现元素水平垂直居中有哪些?
详见:css垂直水平居中实现的方式原创 2020-10-17 15:11:12 · 110 阅读 · 0 评论 -
说说rem是如何实现自适应布局的
详见:rem是如何实现自适应布局的?原创 2020-10-17 00:32:55 · 191 阅读 · 0 评论 -
说说ES6新特性
详见:ES6中常用的10个新特性讲解原创 2020-10-16 22:45:49 · 149 阅读 · 0 评论 -
说说事件委托(代理),这个是通过什么原理,应用场景有哪些
1、前端面试必考:事件委托2、事件委托在哪些场景中使用,该如何使用,及其实现原理?原创 2020-10-14 00:51:25 · 539 阅读 · 0 评论 -
position:absolute相对哪个元素定位,那个元素要满足什么条件
1、position: absolute的元素会脱离页面中的文档流,相对于 static 定位以外的第一个父元素进行定位,父元素也要有定位position:relative或position:absolute原创 2020-10-13 23:50:22 · 1167 阅读 · 0 评论 -
ES6的class中的static方法和普通方法的区别
什么是静态(static)方法?类相当于实例的原型,所有在类中定义的方法,都会被实例继承。如果在一个方法前,加上static关键字,就表示该方法不会被实例继承,而是直接通过类来调用,这就称为“静态方法”。class Foo { static classMethod() { return 'hello'; }}Foo.classMethod() // 'hello'var foo = new Foo();foo.classMethod()// TypeError: foo.原创 2020-09-28 16:30:12 · 2633 阅读 · 1 评论 -
CSS渲染优化策略
优化策略1、尽量避免使用后代选择器,使用 id selector 非常的高效2、减少CSS文档体积值为 0 不需要单位使用缩写属性值为浮动小数 0.xx,可以省略小数点之前的 03、不滥用浮动4、让属性尽可能多的去继承参考1、CSS 渲染原理以及优化策略2、CSS渲染速度改善的十个方法与建议...原创 2020-09-26 23:51:28 · 207 阅读 · 0 评论 -
说说箭头函数与普通函数的区别
箭头函数与普通函数的区别1、函数体内的 this 对象,就是定义时所在的对象,而不是使用时所在的对象。2、不可以使用 arguments 对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。3、不可以使用 yield 命令,因此箭头函数不能用作 Generator 函数。4、不可以使用 new 命令,因为:没有自己的 this,无法调用 call,apply。没有 prototype 属性 ,而 new 命令在执行时需要将构造函数的 prototype 赋值给新的对象的 _.原创 2020-09-23 11:27:49 · 261 阅读 · 0 评论 -
说说HTTP1.0 和 HTTP1.1 的区别 && HTTP1.x 和 HTTP2 的区别
HTTP的历史早在 HTTP 建立之初,主要就是为了将超文本标记语言(HTML)文档从Web服务器传送到客户端的浏览器。也是说对于前端来说,我们所写的HTML页面将要放在我们的 web 服务器上,用户端通过浏览器访问url地址来获取网页的显示内容,但是到了 WEB2.0 以来,我们的页面变得复杂,不仅仅单纯的是一些简单的文字和图片,同时我们的 HTML 页面有了 CSS,Javascript,来丰富我们的页面展示,当 ajax 的出现,我们又多了一种向服务器端获取数据的方法,这些其实都是基于 HTTP.原创 2020-09-22 17:36:46 · 348 阅读 · 0 评论 -
谈谈浏览器的跨域问题
说说什么是跨域?浏览器有基源策略。当协议、域名、端口至少有一个不一致时就会发生跨域,ajax请求会失败。跨域并不是请求发不出去,请求能发出去,服务端能收到请求并正常返回结果,只是结果被浏览器拦截了。这也说明了跨域并不能完全阻止 CSRF攻击,因为请求毕竟是发出去了。允许跨域加载资源的标签:<img src=xxx><script src=xxx><link href=xxx>有哪些方法解决跨域?1、JSONP利用<script>标.原创 2020-09-22 16:10:33 · 237 阅读 · 0 评论 -
谈谈JS的内存泄漏
什么是内存泄漏?字面上的意思,申请的内存没有及时回收掉,被泄漏了为什么会发生内存泄漏?虽然JS有垃圾回收机制,但当某块无用的内存,却无法被垃圾回收机制认为是垃圾时,也就发生内存泄漏了。而垃圾回收机制通常是使用标志清除策略,简单说,也就是引用从根节点开始是否可达来判定是否是垃圾。上面是发生内存泄漏的根本原因,直接原因则是,当不同生命周期的两个东西相互通信时,一方生命到期该回收了,却被另一方还持有时,也就发生内存泄漏了。哪些情况会造成内存泄漏?1、意外的全局变量全局变量的生命周期最长,.原创 2020-09-22 15:30:12 · 940 阅读 · 0 评论 -
说说JS垃圾回收机制的两种策略
垃圾收集器通常有两种策略收集内存中无用的变量:1、标记清除:JavaScript中最常用的垃圾收集方式是标记清除垃圾收集器在运行的时候会给存储在内存中的所有变量都加上标记,然后,它会去掉环境中的变量以及被环境中的变量引用的变量的标记。而在此之后再被加上标记的变量将被视为准备删除的变量,原因是环境中的变量已经无法访问到这些变量了。最后,垃圾收集器完成内存清除工作,销毁那些带标记的值并回收它们所占用的内存空间。2、引用计数:另一种不太常见的垃圾收集策略叫做引用计数另一种不太常见的垃圾收集策略叫做原创 2020-09-21 23:03:36 · 635 阅读 · 0 评论 -
JS函数防抖和节流及其应用场景
函数防抖:在事件被触发n秒后再执行回调,如果在这n秒内又被触发,则重新计时。通俗来讲就是:假设一个按钮在2000毫秒内被点击100次,等到最后一次触发该函数开始计时,过了delay毫秒后才会触发一次函数。 // 1.防抖 function debounce(fn, wait) { let timer; return function() { if (timer) clearTimeout(timer); timer = s.原创 2020-09-20 01:04:10 · 1040 阅读 · 1 评论 -
说说var 和 let、const 区别
var 定义变量会提升,let、const 不会,let、const有暂时性死区var可以重复声明,let、const不可以,声明const必须赋初值var是函数作用域,let、const是块级作用域全局作用域下:使用 var 声明的变量会被挂载到 window 上使用 let 和 const 声明的变量,不会被挂载到 window 上...原创 2020-09-20 00:21:10 · 83 阅读 · 0 评论 -
HTTP 和 HTTPS 的区别以及 HTTPS 握手过程
HTTP 明文传输,数据都是未加密的,安全性较差,HTTPS(SSL+HTTP) 数据传输过程是加密的,安全性较好。使用 HTTPS 协议需要到 CA(数字证书认证机构) 申请证书。HTTP 页面响应速度比 HTTPS 快,主要是因为 HTTP 使用 TCP 三次握手建立连接,客户端和服务器需要交换 3 个包,而 HTTPS除了 TCP 的三个包,还要加上 ssl 握手需要的 9 个包,所以一共是 12 个包。http 和 https 使用的是完全不同的连接方式,用的端口也不一样,前者是 80,后者.原创 2020-09-16 13:20:12 · 556 阅读 · 0 评论