前端也需要了解如何CRUD

来点vc
374 阅读7分钟

image.png

问个问题，测试同学和你是不是在自测，提测，复现流程场景bug等过程中求助过后端同学帮忙创建、修复、mock或查看确认数据？我相信回答是肯定的，这是开发过程中最常见的场景。

下面总结了几个前端需要了解SQL操作和基本的CRUD（创建、读取、更新、删除）操作的更有说服力的理由。

    1. 理解应用全貌 更好地理解整个应用程序是如何工作的，包括数据是如何流动和被处理的。这种全面的理解可以帮助前端开发者在设计和实现用户界面时做出更明智的决定。
    1. 提升开发效率 当后端尚未实现或正在进行维修时，自行处理数据，就可以继续开发而无需等待。这样可以减少项目的横向依赖，加快开发速度。
    1. 编写和测试数据驱动的界面 前端开发中的许多功能都是数据驱动的。如果前端开发者能够自己创建和操作这些数据，他们就能更有效地测试这些功能。这包括能够创建满足特定条件的数据集，从而测试边界情况和错误处理。
    1. 与后端的沟通 了解数据库和CRUD操作可以帮助前端开发者更有效地与后端同事沟通。他们将能够更准确地描述问题，提出建议，并理解后端的限制和挑战。
    1. Mock数据的局限性 本地mock数据是前端开发中常用的实践，但它有一些局限性：
    • 数据真实性：Mock数据可能无法完全模拟真实的数据库行为，特别是在复杂的查询和事务操作中。
    • 数据同步：随着后端模型的变化，维护和更新mock数据可能会变得困难和耗时。
    • 边界情况：Mock数据可能没有涵盖所有的边界情况，导致在实际数据库中可能出现的问题在前端测试中被忽略。
    • 性能问题：Mock数据无法模拟数据库的性能瓶颈，因此可能无法揭示在处理大量数据时的性能问题。
    • 并发和安全性：Mock数据通常无法模拟多用户并发访问和安全性相关的问题。

安装 MySQL Workbench

在 Windows 上安装

  1. 访问 MySQL Workbench 的官方下载页面。
  2. 选择适合你的Windows系统的版本，点击 "Download"。
  3. 如果不想注册Oracle账户，可以点击 "No thanks, just start my download"。
  4. 下载完成后，双击安装包进行安装。
  5. 在安装过程中，选择 "Typical" 安装类型，然后继续按提示完成安装。

在 Mac 上安装

  1. 同样访问 MySQL Workbench 的官方下载页面。
  2. 选择适合你的Mac系统的版本，点击 "Download"。
  3. 同Windows安装一样，你可以选择直接下载而不注册账号。
  4. 下载完成后，打开 .dmg 文件并拖动MySQL Workbench到“应用程序”文件夹。

连接数据库

  1. 打开MySQL Workbench。
  2. 在初始屏幕中，点击 "MySQL Connections" 下的 “+” 创建新连接。

image.png 3. 在 "Setup New Connection" 对话框中，输入你的数据库信息，包括连接名称、主机名（通常是localhost）、端口（默认是3306）和用户名（通常是root）。

image.png 4. 点击 "Test Connection" 来测试连接，如果它要求密码，输入你的数据库用户密码。

image.png 5. 测试成功后，点击 "OK" 保存连接。

SQL基本语法操作

SQL语法包括一系列的指令，用于执行特定的操作，如查询、更新或定义数据。这里是一些基本的SQL语法：

  • SELECT 用于从数据库中检索数据。
  • UPDATE 用于更新数据库中的数据。
  • DELETE 用于从数据库中删除数据。
  • INSERT INTO 用于向数据库中插入新数据。
  • CREATE DATABASE 用于创建新数据库。
  • CREATE TABLE 用于创建新表。
  • ALTER TABLE 用于修改数据库表结构。

基本的SQL CRUD

image.png

创建 (Create)

创建新数据库和表：

CREATE DATABASE example_db;
USE example_db;

CREATE TABLE users (
  id INT AUTO_INCREMENT PRIMARY KEY,
  username VARCHAR(50) NOT NULL,
  email VARCHAR(50) NOT NULL,
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

读取 (Read)

查询表中的数据：

SELECT * FROM users;
SELECT username, email FROM users WHERE id = 1;

更新 (Update)

修改表中的数据：

UPDATE users SET email = 'update@example.com' WHERE id = 1;

删除 (Delete)

从表中删除数据：

DELETE FROM users WHERE id = 1;

插入 (Insert)

向表中插入新数据：

INSERT INTO users (username, email) VALUES ('newuser', 'newuser@example.com');

常用的SQL优化技巧

SQL优化是数据库管理和应用开发中的一个重要方面，目的是确保查询运行得尽可能快，资源利用得尽可能高效。一般来说，上面的CRUD基本满足前端操作表测试数据了，但是对于全栈的web开发者，应该了解学习下。

1. 使用正确的数据类型

错误的选择：

CREATE TABLE users (
  id VARCHAR(10), -- 错误的数据类型选择
  age VARCHAR(3)
);

正确的选择：

CREATE TABLE users (
  id INT AUTO_INCREMENT, -- 更合适的数据类型
  age TINYINT
);

2. 使用索引

创建索引：

CREATE INDEX idx_username ON users(username);

创建复合索引：

CREATE INDEX idx_user_email ON users(username, email);

3. 优化查询语句

选择需要的列而不是使用SELECT *：

-- 不推荐
SELECT * FROM users;

-- 推荐
SELECT id, username, email FROM users;

使用JOIN代替子查询：

-- 不推荐
SELECT username, (SELECT email FROM emails WHERE emails.user_id = users.id) as email FROM users;

-- 推荐
SELECT users.username, emails.email FROM users JOIN emails ON users.id = emails.user_id;

使用WHERE子句减少数据行数：

SELECT username FROM users WHERE last_login < '2023-01-01';

4. 避免使用SELECT DISTINCT

-- 可能慢
SELECT DISTINCT username FROM users;

-- 更快的替代方案，如果可以的话
SELECT username FROM users GROUP BY username;

5. 使用LIMIT

SELECT username FROM users LIMIT 10;

6. 利用查询缓存

尽量避免在查询中使用随机或当前时间函数，这些查询不能被缓存：

-- 可能无法利用缓存
SELECT * FROM users WHERE last_login = NOW();

-- 可以利用缓存
SELECT * FROM users WHERE last_login = '2023-01-01';

7. 避免在列上使用函数或运算符

-- 不推荐
SELECT * FROM users WHERE YEAR(birthday) = 1990;

-- 推荐
SELECT * FROM users WHERE birthday BETWEEN '1990-01-01' AND '1990-12-31';

8. 优化JOIN

确保JOIN条件上有索引，并且使用合适的JOIN类型：

SELECT * FROM orders
JOIN customers ON orders.customer_id = customers.id
WHERE customers.last_name = 'Smith';

9. 分析和优化慢查询

EXPLAIN SELECT * FROM users WHERE last_name = 'Smith';

10. 使用批处理

-- 不推荐
INSERT INTO users (username) VALUES ('user1');
INSERT INTO users (username) VALUES ('user2');
INSERT INTO users (username) VALUES ('user3');

-- 推荐
INSERT INTO users (username) VALUES ('user1'), ('user2'), ('user3');

11. 正确使用事务

BEGIN;
UPDATE accounts SET balance = balance - 100 WHERE id = 1;
UPDATE accounts SET balance = balance + 100 WHERE id = 2;
COMMIT;

12. 避免数据类型转换

-- 不推荐，可能会导致隐式转换
SELECT * FROM users WHERE id = '123';

-- 推荐
SELECT * FROM users WHERE id = 123;

13. 优化表结构

归一化设计：

CREATE TABLE students (
  student_id INT,
  student_name VARCHAR(100),
  address_id INT
);

CREATE TABLE addresses (
  address_id INT,
  street_name VARCHAR(100),
  city_name VARCHAR(100)
);

反归一化设计（适度）：

CREATE TABLE students (
  student_id INT,
  student_name VARCHAR(100),
  street_name VARCHAR(100),
  city_name VARCHAR(100)
);

结语

掌握SQL不仅能帮助你更好地与后端开发者沟通，还能让你对数据的流动有更深入的理解。通过学习如何进行基本的CRUD操作，你将能够确保你的应用能够高效地处理数据，为用户提供更丰富和响应式的体验。最后要注意进行任何数据操作时都要注意安全和数据保护。

avatar
文章
阅读
粉丝