javascript如何实现数组事务回滚

let originalUsers = [
    { id: 1, name: 'Alice', status: 'active' },
    { id: 2, name: 'Bob', status: 'inactive' },
    { id: 3, name: 'Charlie', status: 'active' }
];

// 1. 创建一个数组的副本作为回滚点
// 对于简单数组（元素都是基本类型），浅拷贝通常就够了
// 但如果数组元素是对象，为了避免原数组对象被修改，通常需要深拷贝
let snapshotUsers = JSON.parse(JSON.stringify(originalUsers)); // 简单粗暴的深拷贝方法

console.log("原始数组：", originalUsers);

// 2. 尝试进行一系列操作
try {
    // 假设我们要激活Bob，并删除Charlie
    originalUsers[1].status = 'active'; // 修改Bob的状态
    originalUsers.pop(); // 删除Charlie

    // 模拟一个可能出错的业务逻辑，比如，如果剩余用户数量少于2，就认为操作失败
    if (originalUsers.length < 2) {
        throw new Error("用户数量过少，操作失败！");
    }

    // 模拟另一个修改，比如添加一个新用户
    originalUsers.push({ id: 4, name: 'David', status: 'pending' });

    console.log("操作后数组：", originalUsers);

    // 假设所有操作都成功了，这时候可以考虑更新 snapshotUsers 或者直接清除它
    // snapshotUsers = JSON.parse(JSON.stringify(originalUsers)); // 如果需要新的回滚点
    console.log("操作成功，数组状态已更新。");

} catch (error) {
    console.error("操作过程中发生错误：", error.message);
    // 3. 发生错误时，用快照恢复数组
    originalUsers = JSON.parse(JSON.stringify(snapshotUsers)); // 恢复到快照状态
    console.log("数组已回滚到：", originalUsers);
}

// 最终数组状态
console.log("最终数组状态：", originalUsers);

JSON.parse(JSON.stringify(originalUsers))

undefined

Symbol

let arr1 = [{ id: 1, name: 'A' }, { id: 2, name: 'B' }];
let arr2 = arr1.slice(); // 浅拷贝

arr2[0].name = 'New A'; // 修改了arr2的第一个元素

console.log(arr1[0].name); // 输出 'New A'，因为arr1和arr2的第一个元素指向的是同一个对象

slice()

[...arr]

JSON.parse(JSON.stringify())

_.cloneDeep()

JSON.parse(JSON.stringify())

class Command {
    constructor(targetArray, operation, ...args) {
        this.targetArray = targetArray;
        this.operation = operation;
        this.args = args;
        this.prevState = JSON.parse(JSON.stringify(targetArray)); // 每次操作前都记录状态
    }

    execute() {
        // 执行操作，这里简化为直接调用数组方法
        // 实际中可能需要更复杂的逻辑来模拟操作
        switch (this.operation) {
            case 'push':
                this.targetArray.push(...this.args);
                break;
            case 'pop':
                this.targetArray.pop();
                break;
            // ... 其他操作
        }
    }

    undo() {
        // 恢复到操作前的状态
        // 这是一个简化的回滚，更严谨的undo需要记录反向操作
        // 对于数组整体回滚，直接恢复到prevState更简单
        this.targetArray.splice(0, this.targetArray.length, ...JSON.parse(JSON.stringify(this.prevState)));
    }
}

class TransactionManager {
    constructor(initialArray) {
        this.currentArray = initialArray;
        this.history = []; // 记录执行过的命令
        this.initialState = JSON.parse(JSON.stringify(initialArray)); // 事务开始的初始状态
    }

    executeCommand(operation, ...args) {
        let command = new Command(this.currentArray, operation, ...args);
        command.execute();
        this.history.push(command);
        console.log(`执行操作: ${operation}`, this.currentArray);
    }

    rollback() {
        console.log("执行回滚操作...");
        // 直接恢复到事务开始的初始状态
        this.currentArray.splice(0, this.currentArray.length, ...JSON.parse(JSON.stringify(this.initialState)));
        this.history = []; // 清空历史
        console.log("回滚完成，数组恢复到初始状态：", this.currentArray);
    }

    commit() {
        console.log("事务提交，当前状态成为新的初始状态。");
        this.initialState = JSON.parse(JSON.stringify(this.currentArray));
        this.history = []; // 清空历史
    }

    getCurrentState() {
        return this.currentArray;
    }
}

// 示例使用
let myData = [{ id: 1, value: 'A' }, { id: 2, value: 'B' }];
let tm = new TransactionManager(myData);

tm.executeCommand('push', { id: 3, value: 'C' });
tm.executeCommand('pop'); // 移除C
tm.executeCommand('push', { id: 4, value: 'D' });

// 假设这里发生了一个错误，或者用户取消了
// tm.rollback();

// 假设操作成功
tm.commit();

console.log("最终数据：", tm.getCurrentState());

// 再次操作，并回滚
tm.executeCommand('push', { id: 5, value: 'E' });
tm.rollback();
console.log("再次回滚后数据：", tm.getCurrentState()); // 应该回到 {id: 1, value: 'A'}, {id: 2, value: 'B'}, {id: 4, value: 'D'}

TransactionManager

currentArray

initialState

try-catch