如何为localStorage中客户端数组对象分配连续业务序号？

原代码存在的问题 #

1. 初始化客户端列表时错误使用|| {}，实际应为数组类型，需改为|| []
2. 循环逻辑冗余且错误：新增单个客户端无需遍历所有列表，且循环内重复写入localStorage会导致性能问题
3. 未声明clientNumber变量，会污染全局作用域
4. 序号计算错误：使用字符串拼接+ '1'会生成"11"这类无效序号，而非数字递增
5. 未处理空数组场景：当列表为空时，clients.slice(-1)["0"]会直接报错

解决方案 #

1. 新增单个客户端时自动分配序号

这个函数专门用于添加新客户端，自动计算并设置连续的业务序号：

function addNewClient(newClient) {
    // 从localStorage读取客户端数组，不存在则初始化为空数组
    let clients = JSON.parse(localStorage.getItem("Clients")) || [];
    
    // 计算新序号
    let newClientNumber;
    if (clients.length === 0) {
        // 空列表时，第一个序号为1
        newClientNumber = 1;
    } else {
        // 取最后一个客户端的序号，转数字后加1
        const lastNum = parseInt(clients[clients.length - 1].clientn, 10);
        // 兼容序号无效的情况， fallback到数组长度+1
        newClientNumber = isNaN(lastNum) ? clients.length + 1 : lastNum + 1;
    }
    
    // 给新客户端设置序号（转为字符串，和预期格式一致）
    newClient.clientn = newClientNumber.toString();
    
    // 存入数组并更新localStorage
    clients.push(newClient);
    localStorage.setItem("Clients", JSON.stringify(clients));
    
    return newClient;
}

2. 批量补全现有客户端的序号

如果之前的客户端clientn为空或不连续，可以用这个函数统一修正：

function fixAllClientNumbers() {
    let clients = JSON.parse(localStorage.getItem("Clients")) || [];
    
    // 遍历数组，索引+1即为业务序号
    clients.forEach((client, index) => {
        client.clientn = (index + 1).toString();
    });
    
    localStorage.setItem("Clients", JSON.stringify(clients));
}

使用示例 #

// 创建新客户端对象
const newClient = {
    id: "qece2345-cd9d-4898-fd18-3ded710a8063",
    hasPic: false,
    picId: 2,
    picSrc: "",
    picFile: [],
    createdOn: new Date().toISOString(),
    firstName: "New Client",
    job: "Designer",
    clientn: "" // 该字段会被自动赋值
};

// 添加到localStorage
addNewClient(newClient);

执行后，localStorage中的Clients会按预期生成连续的clientn：

"[{
    "id":"qece2345-cd9d-4898-fd18-3ded710a8062",
    "hasPic":false,
    "picId":2,
    "picSrc":"",
    "picFile":[],
    "createdOn":"2023-03-30T14:22:22.899Z",
    "firstName":"JND PLUS MASTER",
    "job":"Destroza avernos",
    "clientn":"1"
    },{
    "id":"qece2345-cd9d-4898-fd18-3ded710a8063",
    "hasPic":false,
    "picId":2,
    "picSrc":"",
    "picFile":[],
    "createdOn":"2024-05-20T10:15:30.123Z",
    "firstName":"New Client",
    "job":"Designer",
    "clientn":"2"
    }]"

内容的提问来源于stack exchange，提问作者SIMBIOSIS surl