小红书日常实习前端一面

1.http1.0和http2.0的区别

HTTP/1.0 和 HTTP/2.0 是两个不同版本的 HTTP 协议，在性能、安全性和功能上有许多区别。

性能提升：
- HTTP/2.0 使用了多路复用（Multiplexing）技术，可以在同一个连接上同时发送多个请求和响应，解决了 HTTP/1.x 中的队头阻塞问题，提高了性能和效率。
- HTTP/2.0 还支持头部压缩（Header Compression），减少了传输的数据量，进一步提升了性能。
服务器推送：
- HTTP/2.0 支持服务器推送（Server Push），服务器可以在客户端请求资源的同时主动推送其他相关资源，加速页面加载速度。
请求优先级：
- HTTP/2.0 允许客户端指定请求的优先级，确保关键资源的优先加载，提高了页面的渲染速度。
单个连接多路复用：
- HTTP/2.0 允许多个请求和响应在同一个 TCP 连接上进行，减少了建立连接的开销，降低了延迟。
二进制传输：
- HTTP/2.0 使用二进制格式传输数据，取代了 HTTP/1.x 中的文本格式，减少了传输的开销和数据大小。
安全性：
- HTTP/2.0 强制要求使用 TLS（Transport Layer Security）加密协议，提高了数据的安全性和隐私保护。

总的来说，HTTP/2.0 相比于 HTTP/1.0 在性能、安全性和功能方面有了显著的提升，能够更好地满足现代 Web 应用对高性能和高安全性的需求。

2.多个连接一定比单个连接好吗（因为前面答了多路复用）

在某些情况下，使用多个连接可能比单个连接更合适，但并不总是如此。虽然 HTTP/2.0 引入了多路复用技术，允许在单个连接上同时处理多个请求和响应，但是在某些场景下，使用多个连接可能会更有效。

以下是一些情况下使用多个连接可能更合适的场景：

跨域资源加载：如果网站需要加载来自不同域名的资源（例如图片、脚本、样式表等），使用多个连接可以更有效地并行加载这些资源，加快页面加载速度。
连接复用限制：虽然 HTTP/2.0 支持多路复用，但是在某些情况下，服务器或代理可能会限制单个连接上并行处理的请求数量。在这种情况下，使用多个连接可以避免性能瓶颈。
资源分组：如果网站的资源可以根据类型或优先级进行分组，使用多个连接可以更好地控制资源加载顺序，确保关键资源的优先加载。
错误恢复：在某些情况下，如果单个连接出现问题（例如连接中断或超时），会影响所有正在处理的请求。使用多个连接可以降低这种风险，使得网站更具有鲁棒性。

综上所述，虽然 HTTP/2.0 引入了多路复用技术，但在某些特定场景下，使用多个连接仍然可以更有效地管理资源加载和处理请求，从而提高性能和用户体验。因此，在设计和优化网站时，需要根据具体情况来选择适当的连接策略。

3.静态方法，原型方法，实例方法是什么，写一个列子（没写清楚）

在面向对象编程中，静态方法（Static Method）、原型方法（Prototype Method）和实例方法（Instance Method）是三种不同类型的方法。

静态方法（Static Method）：静态方法属于类本身，而不是类的实例。它们可以直接通过类名调用，而无需创建类的实例。静态方法通常用于执行与类相关的操作，而不需要访问类的实例属性或方法。

示例：
```
class MathUtils {
  static add(a, b) {
    return a + b;
  }
}

console.log(MathUtils.add(2, 3)); // 输出: 5
```
原型方法（Prototype Method）：原型方法是定义在类的原型对象上的方法，它们可以被类的所有实例共享。当调用实例方法时，JavaScript 引擎会首先在实例本身查找该方法，如果找不到，则会去原型对象中查找。

示例：
```
class Person {
  sayHello() {
    console.log("Hello!");
  }
}

const person1 = new Person();
const person2 = new Person();

person1.sayHello(); // 输出: Hello!
person2.sayHello(); // 输出: Hello!
```

实例方法（Instance Method）：实例方法是定义在类的实例上的方法，它们只能通过类的实例调用。实例方法通常用于操作实例的属性或执行与实例相关的操作。

示例：

class Counter {
  constructor() {
    this.count = 0;
  }

  increment() {
    this.count++;
  }

  getCount() {
    return this.count;
  }
}

const counter = new Counter();
counter.increment();
console.log(counter.getCount()); // 输出: 1

总的来说，静态方法属于类本身，原型方法属于类的原型对象，而实例方法属于类的实例。根据使用场景和需求，可以选择适当的方法类型来定义类的方法。

5.flex：1是什么的缩写，以及每个属性的意思

flex: 1 是 flex-grow, flex-shrink, 和 flex-basis 属性的缩写。

具体各个属性的意思如下：

flex-grow：
- 定义了项目的放大比例，默认值为 0。
- 如果所有项目的 flex-grow 属性都为 1，则它们将等分剩余空间（如果有的话）。
- 如果一个项目的 flex-grow 属性为 2，而其他项目的为 1，则前者占据的剩余空间将是后者的两倍。
flex-shrink：
- 定义了项目的缩小比例，默认值为 1。
- 如果所有项目的 flex-shrink 属性都为 1，则当空间不足时，它们将等比例缩小。
- 如果一个项目的 flex-shrink 属性为 0，其他项目为 1，则空间不足时，前者不缩小。
flex-basis：
- 定义了在分配多余空间之前，项目占据的主轴空间（main size）。
- 它可以是一个长度（如 20% 或 100px），也可以是关键字 auto，表示项目的本来大小。

综上所述，flex: 1 表示项目会等比例地分配剩余空间，并且项目不会缩小到比其本来的大小还要小。

4.js的基本数据类型和引用数据类型

5.为什么会将这些数据类型作为引用数据类型，比如一个很长的string，为什么他不是引用数据类型（只想到了储存在堆栈中空间更大，然后方便查找）

在 JavaScript 中，数据类型分为原始数据类型和引用数据类型。原始数据类型包括数字、字符串、布尔值、undefined 和 null，它们是直接存储在栈内存中的简单数据，每个变量都有自己的存储空间。

而引用数据类型（对象、数组、函数等）存储的是值的引用（内存地址），而不是实际的值。这些引用数据类型的值存储在堆内存中，而变量则保存对该内存地址的引用。

原始数据类型的存储方式决定了它们在内存中的使用方式。例如，对于一个很长的字符串，虽然它的长度可能很大，但它仍然是一个简单的数据单元，可以完整地存储在栈内存中。即使它的值非常长，它仍然是一个原始数据类型，因为它没有内部结构，不需要引用其他的内存地址。

另一方面，引用数据类型的值通常具有内部结构，可能包含多个属性或元素。由于这些值的大小和结构不固定，无法直接存储在栈内存中。因此，它们被存储在堆内存中，并通过引用（指针）的方式在栈内存中进行访问和操作。这种存储方式允许我们动态地分配内存，并有效地管理复杂的数据结构。

总的来说，引用数据类型之所以被称为引用数据类型，是因为变量存储的是对实际值的引用（内存地址），而不是实际的值本身。而原始数据类型则直接存储在栈内存中，没有引用的概念。

6.括号匹配（ac）

括号匹配是指在一个字符串中的括号是否成对出现且正确嵌套。常见的括号包括圆括号 ()，方括号 [] 和花括号 {}。括号匹配的问题可以通过使用栈来解决。

下面是一个简单的 JavaScript 实现，用于检查字符串中的括号是否匹配：

function isBracketMatch(str) {
    const stack = [];
    const map = {
        '(': ')',
        '[': ']',
        '{': '}'
    };

    for (let char of str) {
        // 如果是左括号，则入栈
        if (char === '(' || char === '[' || char === '{') {
            stack.push(char);
        }
        // 如果是右括号
        else {
            // 如果栈为空，或者栈顶元素与当前右括号不匹配，则返回 false
            if (stack.length === 0 || map[stack.pop()] !== char) {
                return false;
            }
        }
    }

    // 如果栈不为空，则说明有左括号没有被匹配到右括号，返回 false
    return stack.length === 0;
}

// 示例测试
console.log(isBracketMatch("()")); // 输出: true
console.log(isBracketMatch("()[]{}")); // 输出: true
console.log(isBracketMatch("(]")); // 输出: false
console.log(isBracketMatch("([)]")); // 输出: false
console.log(isBracketMatch("{[]}")); // 输出: true

以上代码通过使用栈来遍历字符串中的每个字符，当遇到左括号时将其压入栈中，遇到右括号时将其与栈顶的左括号进行匹配。如果匹配成功，则将栈顶的左括号出栈，继续遍历。最后，如果栈为空，则说明所有的括号都匹配成功，返回 true；否则返回 false。

7.事件循环题（ac）记不太清楚了，不太难

一共就半个小时，感觉有点kpi

#我的实习求职记录#

前端面试题详解整理54|括号匹配js基本引用数据类型，flex：1是什么的缩写http1.0和http2.0区别,静态方法，原型方法，实例方法,