十道前端面试题（7）

冷不防 2023-05-31 10:13 92阅读 0赞
  1. 常见的请求方式
  2. CSS选择器有哪些，优先级呢？
  3. URL长度限制
  4. 实现三栏布局，中间自适应有几种方法
  5. 递归
  6. float和position的区别
  7. 如何获取当前日期
  8. cookie与localStorage, sessionStorage的区别？
  9. Linux命令
  10. 闭包内存泄露如何解决

1. 常见的请求方式

  1. ajax（点击了解更多>>）
  2. axios（点击了解更多>>）
  3. fetch（点击了解更多>>）

常用请求方法：

  1. get

    • GET方法用于使用给定的URI从给定服务器中检索信息，即从指定资源中请求数据。
    • 使用GET方法的请求应该只是检索数据，并且不应对数据产生其他影响。
    • GET请求是可以缓存的，我们可以从浏览器历史记录中查找到GET请求，还可以把它收藏到书签中；
    • 且GET请求有长度限制，仅用于请求数据（不修改）。

  2. post

    • POST方法用于将数据发送到服务器以创建或更新资源，它要求服务器确认请求中包含的内容作为由URI区分的Web资源的另一个下属。
    • POST请求永远不会被缓存，且对数据长度没有限制；我们无法从浏览器历史记录中查找到POST请求。

  3. head

    • HEAD方法与GET方法相同，但没有响应体，仅传输状态行和标题部分。这对于恢复相应头部编写的元数据非常有用，而无需传输整个内容。

  4. put

    • PUT方法用于将数据发送到服务器以创建或更新资源，它可以用上传的内容替换目标资源中的所有当前内容。
    • 它会将包含的元素放在所提供的URI下，如果URI指示的是当前资源，则会被改变。如果URI未指示当前资源，则服务器可以使用该URI创建资源。

  5. delete

    • DELETE方法用来删除指定的资源，它会删除URI给出的目标资源的所有当前内容。

  6. connect

    • CONNECT方法用来建立到给定URI标识的服务器的隧道；它通过简单的TCP / IP隧道更改请求连接，通常实使用解码的HTTP代理来进行SSL编码的通信（HTTPS）。

  7. options

    • OPTIONS方法用来描述了目标资源的通信选项，会返回服务器支持预定义URL的HTTP策略。

  8. trace

    • TRACE方法用于沿着目标资源的路径执行消息环回测试；它回应收到的请求，以便客户可以看到中间服务器进行了哪些（假设任何）进度或增量。

点击查看GET请求和POST请求区别>>

2. CSS选择器有哪些，优先级呢？

  1. 标签选择器(如：body,div,p,ul,li)
  2. 类选择器(如：class=“head”,class=“head_logo”)
  3. ID选择器(如：id=“name”,id=“name_txt”)
  4. 全局选择器(如：*号)
  5. 组合选择器(如：.head .head_logo,注意两选择器用空格键分开)
  6. 后代选择器 (如：#head .nav ul li 从父集到子孙集的选择器)
  7. 群组选择器 div,span,img {color:Red} 即具有相同样式的标签分组显示
  8. 继承选择器(如：div p,注意两选择器用空格键分开)
  9. ==伪类选择器(==如：就是链接样式,a元素的伪类，4种不同的状态：link、visited、active、hover。)
  10. 字符串匹配的属性选择符(^ $ *三种，分别对应开始、结尾、包含)
  11. 子选择器 (如：div>p ,带大于号>)
  12. CSS 相邻兄弟选择器 (如：h1+p,带加号+)

优先级：
!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性

3. URL长度限制

在GET请求中URL是有长度限制的。

浏览器对URL的限制：

  1. IE： 对URL对限制为2083字节，如果超过这个限制，会自动截断。
  2. firefox： 限制65536字节，但是实际上有效的URL最大长度不少于100 000个字符
  3. chrome：限制8182字节。超过返回状态码414（点击了解更多HTTP状态码>>）
  4. Safari: 限制80 000 字节
  5. Opera： 限制190 000字节

服务器对URL的限制：

  1. Apache： 限制8 192 字节
  2. IIS ： 限制16 384字节
  3. Perl HTTP::Daemon： 限制8000字节
  4. ngnix： 默认的限制是4K或者8K，这是根据服务器的硬件配置有关的，一般为内存一页的大小，目前大部分为4K，即4096字节

4. 实现三栏布局，中间自适应有几种方法（点击查看）

圣杯布局，双飞翼布局。。

5. 递归

理解递归：

递归就是在函数内部调用函数本身

⚠️使用递归的时候一定得注意，处理不当就会陷入死循环

点击了解更多>>

6. float和position的区别

二者设置后，对应的模块都会脱离文档流。
但是，position相应的块级元素会覆盖下面的内容（文字，），而float只会覆盖块级元素，里面的文字会脱离出来

点击了解position属性对应值及意义>>

7. 如何获取当前日期

  1. const myDate = new Date();
  2. myDate.getYear();        //获取当前年份(2位)
  3. myDate.getFullYear();    //获取完整的年份(4位,1970-????)
  4. myDate.getMonth();       //获取当前月份(0-11,0代表1月)
  5. myDate.getDate();        //获取当前日(1-31)
  6. myDate.getDay();         //获取当前星期X(0-6,0代表星期天)
  7. myDate.getTime();        //获取当前时间(从1970.1.1开始的毫秒数)
  8. myDate.getHours();       //获取当前小时数(0-23)
  9. myDate.getMinutes();     //获取当前分钟数(0-59)
  10. myDate.getSeconds();     //获取当前秒数(0-59)
  11. myDate.getMilliseconds();    //获取当前毫秒数(0-999)
  12. myDate.toLocaleDateString();     //获取当前日期
  13. const mytime=myDate.toLocaleTimeString();     //获取当前时间
  14. myDate.toLocaleString( );        //获取日期与时间

8. cookie与localStorage, sessionStorage的区别？

主要区别体现在4个方面

  1. 数据的生命周期

    • cookie：一般由服务器生成，可以设置有效时间。如果在浏览器端生成cookie，那么浏览器关闭后cookie就会失效。
    • localStorage： 除非被清除，否则会永久保存。
    • sessionStorage： 仅仅在当前会话有效关闭页面或浏览器后sessionStorage就会失效

  2. 存放数据大小

    • cookie： 4k左右
    • localStorage、sessionStorage：一般为5MB

  3. 与服务器通信

    • cookie： 每次都会被携带在请求头中，如果cookie保存过多数据，会影响性能
    • localStorage、sessionStorage：仅仅在客户端即浏览器中储存，不参与和服务器的通信

  4. 易用性

    • cookie： 需要程序员自己封装，原生的Cookie接口并不友好
    • 原生接口可以接受，也可以进行封装

9. Linux命令

常用的20个Linux命令：

  1. cd 切换当前目录
  2. ls 查看文件与目录
  3. grep 分析一行信息
  4. find 查找
  5. cp 复制文件
  6. mv 移动文件、目录或更名
  7. rm 删除文件或目录
  8. ps 将某个时间点的进程运行情况选取下来并输出
  9. kill 向某个工作（%jobnumber）或者是某个PID（数字）传送一个信号，它通常与ps和jobs命令一起使用
  10. killall 向一个命令启动的进程发送一个信号
  11. file 判断接在file命令后的文件的基本数据
  12. tar 对文件进行打包，默认情况并不会压缩，如果指定了相应的参数，它还会调用相应的压缩程序（如gzip和bzip等）进行压缩和解压
  13. cat 查看文本文件的内容，后接要查看的文件名
  14. chgrp 改变文件所属用户组
  15. chown 改变文件的所有者，与chgrp命令的使用方法相同，只是修改的文件属性不同
  16. chmod 改变文件的权限
  17. vim 文本编辑，它接一个或多个文件名作为参数，如果文件存在就打开，如果文件不存在就以该文件名创建一个文件
  18. gcc 把C语言的源程序文件，编译成可执行程序
  19. time 测算一个命令（即程序）的执行时间
  20. tree 显示树形的层级目录结构

10. 闭包内存泄露如何解决

  • 理解什么是内存泄漏：

指的是一块被分配的内存既不能使用，也不能被回收。会影响性能，甚至会导致程序崩溃。

  • 常见内存泄漏：
  1. 意外的全局变量
  2. 被遗忘的计时器或回调函数
  3. 脱离DOM的引用

  4. 闭包

    • 常用的闭包内存泄漏解决办法
      在JavaScript代码段运行完之时将形成循环引用的JavaScript对象手动设置为空，切断引用。

举个?

  1. function example(){
  2.     var ele = document.getElementById('id');
  3.     ele.onclick = () => console.log(1);
  4.     ele = null;     //  手动置空
  5. }

发表评论

表情：
评论列表 （有 0 条评论，92人围观）

还没有评论，来说两句吧...

相关阅读