interview

生活面试

Created At : 2024-07-11 16:02

Views 👀 :

Comment:

面试经过汇总
1. 2024.7.11: 字节跳动前端开发岗
  1. 面试问题:
  2. 算法题:

面试经过汇总

2024.7.11: 字节跳动前端开发岗

半年以来的第一次面试, hr很热情, 但是面试挂了, 没办法, 好久参与过面试了()

进度: 一面挂

面试问题:

http1.0, 1.1以及2.0是什么, 有什么区别

HTTP (Hypertext Transfer Protocol) 是Web上常用的应用层协议,经历了多个版本的发展,主要包括HTTP/1.0、HTTP/1.1和HTTP/2.0,它们之间存在一些重要的区别:

HTTP/1.0: * 发布于1996年,是最初的HTTP版本。 * 每个HTTP请求都需要建立一个新的TCP连接,请求完成后立即关闭连接。 * 只支持基本的GET和POST方法。 * 没有请求头的持久性,每次请求都需要重新传输。 * 没有host头部,无法在同一IP地址上支持多个网站。

HTTP/1.1: * 发布于1997年,是当前广泛使用的HTTP版本。 * 引入了持久连接(persistent connection),允许在同一个TCP连接上发送多个HTTP请求和响应,减少了连接建立和关闭的开销。 * 增加了更多的请求方法,如HEAD、PUT、DELETE等。 * 引入了请求头的持久性,可以在多个请求中重复使用。 * 增加了Host头部,支持在同一IP地址上托管多个网站。 * 支持管线化(pipelining),允许客户端在收到前一个响应之前就发送下一个请求。

HTTP/2.0: * 发布于2015年,是HTTP协议的最新版本。 * 采用二进制格式而非文本格式,提高了传输效率。 * 实现了请求/响应的多路复用,一个TCP连接上可以并行处理多个请求。 * 采用header compression,减少了传输overhead。 * 引入服务器推送(server push)功能,可以主动向客户端推送资源。 * 支持请求优先级,允许客户端指定请求的优先级。

总的来说,HTTP/1.1相比HTTP/1.0有了很大的改进,而HTTP/2.0则进一步优化了性能,减少了延迟,使Web应用的响应速度得到了显著提升。随着Web应用的日益复杂,HTTP/2.0的优势将越来越明显。

前端语义化

前端的语义化是指使用恰当的 HTML 标签来表达页面内容的含义和结构,而不仅仅是为了布局和显示效果。这包括以下几个方面:

结构语义化: 使用合适的语义化标签, 以反映内容的结构和意义。

内容语义化: 正确使用 h1 到 h6 标签来表示文章的层级结构。使用 p, em, strong, blockquote 等标签来表示文本的语义。

属性语义化: 正确使用 alt 属性来描述图像的内容。使用 title 属性来提供额外的信息提示。合理使用 aria-* 属性来增强页面的可访问性。

链接语义化: 使用 a 标签来创建超链接,而不是用 div 或 span 来模拟链接效果。确保链接文本能够准确描述链接的目的地。

表单语义化: 使用恰当的表单元素如 input, textarea, select 等,并给它们添加适当的 label。

语义化的好处包括:

增强页面的可访问性,方便残障用户使用辅助设备浏览页面。
提高页面的可读性和可维护性,使代码更易理解。
利于搜索引擎优化(SEO),帮助搜索引擎理解页面内容。
为未来的技术发展做好准备,如语音助手等新兴技术。

js的常用数组方法(问了reduce)

JavaScript 中常用的数组方法主要包括以下几类:

访问/搜索元素: * arr.indexOf(item) - 返回指定元素在数组中的索引位置。 * arr.lastIndexOf(item) - 返回指定元素在数组中最后一次出现的索引位置。 * arr.includes(item) - 检查数组是否包含指定的元素。

迭代方法:

arr.forEach(callback) - 对数组的每个元素执行指定的函数。
arr.map(callback) - 对数组的每个元素执行指定的函数,并返回一个新数组。
arr.filter(callback) - 创建一个新数组,其中包含通过所提供函数实现的测试的所有元素。
arr.reduce(callback, initialValue) - 通过执行一个提供的 reducer 函数(升序执行)来为每个元素计算单个值。
arr.some(callback) - 测试数组中是否至少有一个元素通过由提供的函数实现的测试。
arr.every(callback) - 测试数组的所有元素是否都通过由提供的函数实现的测试。

操作方法:

arr.concat(item1, item2, ...) - 合并两个或更多的数组,并返回一个新数组。
arr.slice(start, end) - 返回一个新的数组对象,这是一个由 start 和 end 决定的原数组的浅拷贝。
arr.splice(start, deleteCount, item1, item2, ...) - 通过删除或替换现有元素或者原地添加新的元素来修改数组。
arr.reverse() - 反转数组中元素的位置。
arr.sort([compareFunction]) - 对数组的元素进行排序。

其他方法:

arr.toString() - 把数组转换为字符串,并返回结果。
arr.join(separator) - 把数组的所有元素放入一个字符串。
arr.length - 获取数组的长度。

输入一个url以后会发生什么(浏览器是怎么渲染的)

浏览器根据请求的 URL 交给 DNS 域名解析，找到真实 IP ，向服务器发起请求；

服务器交给后台处理完成后返回数据，浏览器接收⽂件（ HTML、JS、CSS 、图象等）；

浏览器对加载到的资源（ HTML、JS、CSS 等）进⾏语法解析，建立相应的内部数据结构（如 HTML 的 DOM）；

载⼊解析到的资源⽂件，渲染页面，完成

浏览器的不同返回码是什么

简述一下js的事件队列

算法题:

比较版本号的大小, 在leetcode上可以找到这道题

https://leetcode.cn/problems/compare-version-numbers/description/

大致处理方法就是: 根据'.'将字符串进行拆分, 将其拆分为数组, 然后再进行比较. 但是这里会遇到一些边界情况, 比如1.1和1.1.0.0这样子, 如果是使用js, 可以根据js的数组的一个特性来解决

js的特性是如果访问的数组索引越界了, 会自动返回undefined, 我们通过函数将这个东西视为0, 然后就可以进行比较了

因此需要两个数组中相对较长的长度, 然后进行逐一比较, 具体代码如下图所示


const toArr=(str)=>{
  const arrStr=str.split('.');
  const arr=arrStr.map(item =>Number(item))
  return arr
}


//需要一个把undefined转化为0的情况
const undefinedToZero=(item)=>{
    if (item===undefined)
      return 0
    return item
}
const compare=(arr1, arr2)=>{
 const max_length=arr1.length>arr2.length?arr1.length:arr2.length;
 for(i=0;i<max_length;i++){
     
     if(undefinedToZero(arr1[i])<undefinedToZero(arr2[i]))
      return -1;
     else if(undefinedToZero(arr1[i])>undefinedToZero(arr2[i]))
      return 1;
 }
 return 0
}

var compareVersion = function(version1, version2) {
 return compare(toArr(version1),toArr(version2))
};

如果是别的语言, 则需要将两个数组补齐成一样的大小, 尾数用0进行追加, 一样的大小就可以进行比较了

转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论，也可以邮件至 xranudvilas@gmail.com