写个js方法统计localStorage的使用空间和剩余空间

在前端开发中，由于安全限制，我们无法直接获取到localStorage的精确总空间大小或剩余空间大小。但是，我们可以通过一些方法间接地估计localStorage的使用空间。

以下是一个简单的JavaScript方法，用于估计localStorage中已使用空间的大小（以字节为单位）：

function getUsedSpaceInLocalStorage() {
    let totalSize = 0;
    for (let key in localStorage) {
        if (localStorage.hasOwnProperty(key)) {
            totalSize += key.length + localStorage.getItem(key).length;
        }
    }
    return totalSize;
}

这个函数遍历localStorage中的所有键值对，并累加它们的长度来估计已使用的空间。但请注意，这个方法只计算了键和值的字符长度，并没有考虑字符编码等因素，因此得到的结果可能并不完全准确。

由于无法直接获取localStorage的总空间大小，因此也无法直接计算剩余空间。不过，你可以通过尝试向localStorage中写入数据来检测是否还有剩余空间。以下是一个示例函数：

function checkRemainingSpaceInLocalStorage() {
    const testKey = 'testKeyForRemainingSpace';
    const testValueBase = 'x'.repeat(1024 * 1024); // 1MB of 'x' characters
    let testValue = '';
    let remainingSpaceEstimate = 0;

    try {
        while (true) {
            testValue += testValueBase; // Incrementally increase the test value size
            localStorage.setItem(testKey, testValue); // Try to store the value
            remainingSpaceEstimate += testValueBase.length; // If successful, update the estimate
            localStorage.removeItem(testKey); // Clean up after the test
        }
    } catch (e) {
        if (e.name === 'QuotaExceededError') {
            // When the quota is exceeded, we know we've reached the limit
            console.log('Estimated remaining space:', remainingSpaceEstimate, 'bytes');
            return remainingSpaceEstimate;
        } else {
            // Handle other errors as needed
            throw e;
        }
    }
}

这个函数通过尝试向localStorage中写入越来越大的数据来估计剩余空间。当写入操作引发QuotaExceededError异常时，说明已经达到了存储限制，此时函数会返回估计的剩余空间大小。但请注意，这个方法并不精确，并且可能会占用大量时间和资源。

总的来说，由于浏览器的限制和安全考虑，我们无法直接获取localStorage的精确空间使用情况。上述方法只能提供近似的估计值，并且在实际应用中可能需要根据具体情况进行调整和优化。