什么是 Nginx

Nginx（发音为"engine-x"）是一个高性能的 HTTP 和反向代理服务器，也是一个 IMAP/POP3/SMTP 服务器。它以其高并发、低内存消耗和高稳定性而闻名。

Nginx 的主要特点

1. 高并发处理能力

• 采用事件驱动的异步非阻塞架构
• 单个进程可以处理数千个并发连接
• 内存消耗极低

2. 模块化设计

• 核心模块 + 功能模块的架构
• 支持动态模块加载
• 丰富的第三方模块

什么是 Monorepo

Monorepo（单体仓库）是一种将多个相关项目存储在单一代码仓库中的开发策略。与传统的多仓库（Multi-repo）相比，Monorepo 将所有相关代码集中管理。

Monorepo vs Multi-repo

Monorepo 结构：
project/
├── packages/
│   ├── shared-utils/
│   ├── web-app/
│   ├── mobile-app/
│   └── api-server/
├── tools/
├── docs/
└── package.json

Multi-repo 结构：
├── shared-utils-repo/
├── web-app-repo/
├── mobile-app-repo/
└── api-server-repo/

什么是拷贝

在 JavaScript 中，当我们需要复制一个变量时，根据复制的深度不同，可以分为浅拷贝和深拷贝。理解这两种拷贝方式的区别对于避免程序中的意外行为至关重要。

数据类型回顾

基本数据类型（值类型）

• number
• string
• boolean
• null
• undefined
• symbol
• bigint

前言

在 JavaScript 开发中，遍历是最常见的操作之一。本文将详细介绍各种遍历方法，包括它们的用法、特点和适用场景。

数组遍历方法

1. for 循环

最基础的遍历方法：

const arr = [1, 2, 3, 4, 5];

for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]); // 1, 2, 3, 4, 5
}

什么是闭包

闭包（Closure）是 JavaScript 中一个重要且强大的概念。简单来说，闭包是指一个函数能够访问其外部作用域中变量的能力，即使在其外部函数已经执行完毕之后。

官方定义

闭包是由函数以及声明该函数的词法环境组合而成的。该环境包含了这个闭包创建时作用域内的任何局部变量。

作用域和作用域链

作用域类型

// 全局作用域
var globalVar = 'I am global';

function outerFunction() {
  // 函数作用域
  var outerVar = 'I am outer';
  
  function innerFunction() {
    // 函数作用域（内层）
    var innerVar = 'I am inner';
    
    // 可以访问所有外层作用域的变量
    console.log(globalVar); // 'I am global'
    console.log(outerVar);  // 'I am outer'
    console.log(innerVar);  // 'I am inner'
  }
  
  return innerFunction;
}

什么是 HTTP

HTTP（HyperText Transfer Protocol，超文本传输协议）是互联网上应用最为广泛的一种网络协议，用于从 Web 服务器传输超文本到本地浏览器的传输协议。

什么是 HTTPS

HTTPS（HyperText Transfer Protocol Secure，安全超文本传输协议）是 HTTP 的安全版本，在 HTTP 下加入 SSL/TLS 协议层，为数据传输提供安全保障。

核心区别对比

1. 安全性

HTTP：

问题描述

在前端开发中，我们经常遇到这样的问题：当我们将图片放在一个容器中时，图片底部总是莫名其妙地出现一些间距，即使我们设置了 margin: 0 和 padding: 0，这个间距依然存在。

<div class="container">
  <img src="example.jpg" alt="示例图片">
</div>

什么是 Flexbox

Flexbox（弹性盒子布局）是 CSS3 中的一种布局方式，它提供了一种更有效的方式来排列、分布和对齐容器中的项目，即使它们的大小未知或是动态变化的。

基本概念

Flex 容器和 Flex 项目

• Flex 容器（Flex Container）：设置了 display: flex 或 display: inline-flex 的元素
• Flex 项目（Flex Items）：Flex 容器的直接子元素