面试笔记
amasne
这个作者很懒,什么都没留下…
展开
-
前端性能优化
性能优化原则多使用内存,缓存或其他方法减少CPU计算量,减少网络加载耗时(适用于所有百年城性能优化,空间换时间)让加载更快减少资源体积:压缩代码减少访问次数:合并代码,SSR服务端渲染缓存使用更快的网络:CDN让渲染更快CSS放在head中,JS放在body最下面尽早开始执行JS,用DOMContentLoaded触发懒加载(图片懒加载,上滑加载更多)对DOM查询进行缓存频繁DOM操作,合并到一起插入DOM结构节流throttle,防抖debounce thrott原创 2020-11-07 11:11:11 · 169 阅读 · 0 评论 -
浏览器的渲染过程
浏览器的渲染过程根据HTML代码生成DOM Tree根据CSS代码生成CSSOMDOM Tree和CSSOM整合行程Render Tree根据Render Tree渲染页面遇到<script>则暂停渲染,优先加载并执行JS代码,完成再继续直至把Render Tree渲染完成优秀博文请查看:https://www.jianshu.com/p/e6252dc9be32...原创 2020-11-07 10:56:54 · 121 阅读 · 0 评论 -
前端优化总结
资源合并// 未合并<script src="a.js"></script><script src="b.js"></script><script src="c.js"></script>// 合并之后,可以减少请求<script src="abc.js"></script>缓存[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ur7aGgCN-1604557969原创 2020-11-05 14:33:20 · 124 阅读 · 0 评论 -
Restful API
现在的methodsget:获取数据post:新建数据patch/put:更新数据delete:删除数据Restful API一种新的API设计方法传统API设计:把每个url当做一个功能Restful API设计:把每个url当做唯一的资源如何设计成一个资源尽量不用url参数用method表示操作类型例如:传统API设计:/api/list?pageIndex=2Restful API设计:/api/list/2用method表示操作类型(传统API设计)原创 2020-11-04 11:50:35 · 89 阅读 · 0 评论 -
HTTP常见状态码
状态码分类1xx:服务器收到请求2xx:请求成功,如2003xx:重定向,如3024xx:客户端错误,如4045xx:服务端错误,如500常见状态码200:请求成功301:永久重定向302:临时重定向304:资源未被修改403:没有权限,例如 未登录,没有用户权限404:资源未找到500:服务器错误504:网关超时...原创 2020-11-04 11:27:46 · 85 阅读 · 0 评论 -
浏览器的同源策略
浏览器的同源策略ajax请求时,浏览器要求当前网页和server必须同源(安全)同源:协议,域名,端口,三者必须一致例: client:http://taobao.com:8080 server:https://alibaba.com:443/api/加载图片css js 可以无视同源策略<link rel="stylesheet" href="">可使用CDN,CDN一般都是外域<script src=""></script>可实现JSO原创 2020-11-03 16:54:44 · 214 阅读 · 0 评论 -
手写简易的ajax请求
### 手写简易的ajax// 第一步需要new一个XMLHttpRequest对象 const xhr = new XMLHttpRequest() // 第二步使用传入请求方式,请求路径,同步还是异步 // 最后的一个参数,true是代表异步请求,false是代表同步请求,默认是异步 xhr.open('GET', '/api', true) // 当状态改变的时候发送请求 xhr.onreadystat原创 2020-11-03 15:16:53 · 553 阅读 · 0 评论 -
事件绑定与事件监听
编写一个通用的事件监听函数function bindEvent(elem, type, selector, fn) { if (fn == null){ fn = selector selector = null } elem.addEventListener(type, event => { const target = eve..原创 2020-11-03 15:15:28 · 137 阅读 · 0 评论 -
JavaScript中的异步
JS如何执行?从前到后,一行一行执行如果某一行执行报错,则停止下面代码的执行先把同步代码执行完,再执行异步宏任务与微任务event loop 浏览器总结event loop过程同步代码,一行一行的放在Call Stack执行遇到异步,会先‘记录’下,等待时机(定时,网络请求等)时机到了,就移动到Callback Queue如果Call Stack为空(即同步代码执行完)Event Loop开始工作轮询查找Callback Queue,如有则移动到Call Stack执行然后原创 2020-11-02 14:00:29 · 119 阅读 · 0 评论 -
闭包与this
闭包作为返回值,在程序中返回的函数,由外面的变量引用了,所以不会销毁,从而形成了闭包,help得到的是一个函数,当函数执行的时候,函数会去找执行上下文中的a,即函数app中的afunction app() { let a = 10010; return function () { console.log(a); } } const help = app(); let a = 10086; hel原创 2020-10-31 21:10:06 · 94 阅读 · 0 评论 -
深克隆与原型原型链
乞版深克隆<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body><script&原创 2020-10-31 12:13:29 · 165 阅读 · 0 评论 -
JS作用域和闭包核心面试题
说一下对变量提升的理解JavaScript 中,函数及变量的声明都将被提升到函数的最顶部。JavaScript 中,变量可以在使用后声明,也就是变量可以先使用再声明。说明this几种不同的使用场景第一种情况: 全局下thisfunction fn1 (){ return this}console.log(fn1()) //window注意: 在严格模式下 “use strict” this是undefined第二种情况:构造函数当函数作为构造函数调用时,t..原创 2020-08-26 10:25:54 · 225 阅读 · 0 评论 -
js变量类型和原型
变量类型和计算js中使用typeof能得到的哪些类型typeof undefined //undefinedtypeof “abc” //stringtypeof 123 //numbertypeof true //booleantypeof {} //objecttypeof null //objecttypeof [] //objecttypeof console.log //function何时使用===原创 2020-08-25 14:01:02 · 265 阅读 · 0 评论 -
HTML和CSS面试题总结
HTML面试题如何理解HTML语义化?让人更容易读懂(增加代码的可读性)让搜索引擎更容易读懂(利于SEO)默认情况下,哪些HTML标签是块级元素,哪些是内联元素?display: block/table; 有div h1-h5 table ul ol p等display: inline/inline-block; 有 a b em strong i span img input button等CSS面试题布局 盒模型宽度计算:<!DOCTYPE html><原创 2020-08-24 21:03:29 · 233 阅读 · 0 评论