前端常见面试题(js,html,css)

1.闭包
(1)闭包就是一个函数,两个函数彼此嵌套,内部函数就是闭包形成闭包条件是内部函数需要通过return给返回出来
(2)①、闭包就是能够读取其他函数内部变量的函数。
   ②、将函数内部和函数外部连接起来的桥梁
2.localstorage,session,cookie的区别
1.cookie始终在同源的http请求中携带,即使不需要,cookie在浏览器和服务器中来回传递。而localStorage和sessionStora仅仅在本地存储,不会好服务器通信,也不会自动把数据发送给服务器。
2.存储大小不同,cookie为4kb左右;localStorage, sessionStorage可以达到5M
3.数据有效期不同,sessionStorage仅在同源窗口中有效,关闭窗口就消失了,cookie可以设置过期时间,localStorage长期有效
localStorage, sessionStorage有现成的API, cookie需要程序员手动封装

3.http常用状态码
100 Continue 继续,一般在发送post请求时,已发送了http header之后服务端将返回此信息,表示确认,之后发送具体参数信息
200 OK 正常返回信息
201 Created 请求成功并且服务器创建了新的资源
202 Accepted 服务器已接受请求,但尚未处理
301 Moved Permanently 请求的网页已永久移动到新位置。
302 Found 临时性重定向。
303 See Other 临时性重定向,且总是使用 GET 请求新的 URI。
304 Not Modified 自从上次请求后,请求的网页未修改过。
400 Bad Request 服务器无法理解请求的格式,客户端不应当尝试再次使用相同的内容发起请求。
401 Unauthorized 请求未授权。
403 Forbidden 禁止访问。
404 Not Found 找不到如何与 URI 相匹配的资源。
500 Internal Server Error 最常见的服务器端错误。
503 Service Unavailable 服务器端暂时无法处理请求(可能是过载或维护)。
4.从输入URL到页面加载发生了什么
1.DNS解析
2.TCP连接
3.发送HTTP请求
4.服务器处理请求并返回HTTP报文
5.浏览器解析渲染页面
6.连接结束
5. 如何进行网站性能优化
1.页面层:

  • 减少HTTP请求:合并文件、CSS精灵、inline Image
  • 减少DOM元素数量
  • 组件预加载
  • 非必须组件延迟加载
  • 减少DOM元素数量
  • 减少iframe数量
    2.serve层
  • 使用CDN
  • 添加Expires或者Cache-Control响应头
  • 对组件使用Gzip压缩
  • 避免空src的img标签
  • Ajax使用GET进行请求
  1. js, 图片层,css
  • 优化cookie
  • 减小cookie大小
  • 引入资源的域名不要包含cookie
  • js 1. 将脚本放到页面底部
      2. 将javascript和css从外部引入
      3. 压缩javascript和css
      4. 删除不需要的脚本
      5. 减少DOM访问
      6. 合理设计事件监听器
  • 优化图片:
  • 1.根据实际颜色需要选择色深、压缩
    1. 优化css精灵
      -  3. 不要在HTML中拉伸图片
      -  4. 保证favicon.ico小并且可缓存

6.介绍下重绘和回流(Repaint & Reflow),以及如何进行优化

  • 改变了背景颜色、边框、字体的颜色,浏览器重新绘制颜色的过程称为重绘
  • 当页面的元素发生变化的时候(宽、高、位置、创建元素),都会导致整个页面重排,浏览器会重新计算结构位置,重新渲染页面,称为DOM回流

回流必定会发生重绘,重绘不一定会引发回流

7.数据类型
1.判断数组
typeof 是不行的
二种方法: (1 instanceof (2)isArray
2.基本数据类型和引用数据类型
原始类型包括:boolean, null,undefined,number,string,symbol
引用数据类型:对象数组函数
防抖和节流的区别

  • 函数防抖
    当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定时间到来之前,又触发了事件,就重新开始延时。也就是说当一个用户一直触发这个函数,且每次触发函数的间隔小于既定时间,那么防抖的情况下只会执行一次
  • 函数节流
    当持续触发事件时,保证在一定时间内只调用一次事件处理函数,意思就是说,假设一个用户一直触发这个函数,且每次触发小于既定值,函数节流会每隔这个时间调用一次
    html5新特性
    1.新增的语义化标签
发布了27 篇原创文章 · 获赞 0 · 访问量 417

猜你喜欢

转载自blog.csdn.net/weixin_40542544/article/details/104649544