searchusermenu
  • 发布文章
  • 消息中心
点赞
收藏
评论
分享
原创

数组元素去重拓展

2024-07-02 09:55:29
11
0
 

简单数据类型去重

简单数据类型去重逻辑如下,相应的对比复杂数据类型只需要需改判断两个值是否相等逻辑即可

Set

使用 Set(),将创建一个唯一值的实例,隐式使用此实例将删除重复项

let charsArr = ['A', 'B', 'C', 'B', 'C']
let deduplicateArr = [...new Set(charsArr)]

console.log(deduplicateArr)
 

Output:

['A', 'B', 'C']
 

indexOf()和filter()

indexOf()方法返回数组中元素第一次出现的索引为了消除重复项,filter()方法用于仅包含其索引与其 indexOf 值匹配的元素,filer 方法会根据对其执行的操作返回一个新数组

let charsArr = ['A', 'B', 'C', 'B', 'C']
let deduplicateArr = charsArr.filter((element, index) => {
    return charsArr.indexOf(element) !== index
})

console.log(deduplicateArr)
 

Output:

['A', 'B', 'C']
 

includes()和forEach()

如果元素在数组中,则 include() 函数返回 true,如果元素不在数组中,则返回 false

let charsArr = ['A', 'B', 'C', 'B', 'C']

let deduplicateArr = []
charsArr.forEach((element) => {
    if (!deduplicateArr.includes(element)) {
        deduplicateArr.push(element)
    }
})

console.log(deduplicateArr)
 

Output:

['A', 'B', 'C']
 

vue响应式数据去重

在 Vue.js 中使用响应式数组,数组中的每个对象或者元素都会被包装成响应式对象,这意味着当对象的属性发生变化时,视图会自动更新

function uniqueArray(arr) {
    // 判断是否为响应式数组
    const isVueArray = Array.isArray(arr) && arr.__ob__

    // 去重函数
    function filterUnique(arr) {
        return arr.filter((item, index, self) =>
            index === self.findIndex((t) => (
                isVueArray ? JSON.stringify(t) === JSON.stringify(item) : t === item
            ))
        )
    }

    if (Array.isArray(arr)) {
        // 简单数据类型数组或非响应式对象数组
        if (!isVueArray) {
            return Array.from(new Set(arr))
        } else {
            // Vue.js 或类似框架的响应式数组
            return filterUnique(arr.slice())
        }
    } else {
        // 处理复杂对象数组的情况
        if (arr instanceof Object) {
            const keys = Object.keys(arr)
            const filteredKeys = filterUnique(keys)
            const result = {};
            filteredKeys.forEach(key => {
                result[key] = arr[key]
            });
            return result
        } else {
            return arr
        }
    }
}
 

海量数据数组去重

分块处理

分块处理方法适用于无法一次性加载所有数据到内存的情况,比如处理文件或者通过网络获取数据。

 

步骤:

1.将数据分块加载:将海量数据按照一定的块大小(例如每次处理1000条记录)逐块加载或者流式获取。

2.使用哈希表进行局部去重:对每个块内的数据使用哈希表进行去重。哈希表可以是 Map 或者普通对象。

function deduplicateChunk(chunk) {
    let seen = new Map()
    let uniqueChunk = []

    for (let item of chunk) {
        if (!seen.has(item)) {
            seen.set(item, true)
            uniqueChunk.push(item)
        }
    }

    return uniqueChunk
}
 

3.合并去重后的结果:将每个块去重后得到的结果合并起来。

function deduplicateLargeArray(arr, chunkSize) {
    let deduplicatedArray = []

    for (let i = 0; i < arr.length; i += chunkSize) {
        let chunk = arr.slice(i, i + chunkSize)
        let deduplicatedChunk = deduplicateChunk(chunk)
        deduplicatedArray.push(...deduplicatedChunk)
    }

    return deduplicatedArray
}
 

4.返回最终去重后的数组:将所有块处理完毕后得到的去重结果返回。

注意事项:

1.性能考虑:分块处理可以降低内存使用,并且使得每个块的去重操作的时间复杂度保持在合理范围内。

2.哈希冲突:当数据量非常巨大时,哈希冲突可能会增加。可以考虑使用更复杂的哈希函数或者结合其他方法来处理。

流式处理方法

流式处理方法适用于实时生成数据或者通过迭代器逐条获取数据的场景。该方法不需要一次性加载全部数据,而是边处理边输出结果。

示例伪代码

function* deduplicateStream(arr) {
    let seen = new Map()

    for (let item of arr) {
        if (!seen.has(item)) {
            seen.set(item, true)
            yield item
        }
    }
}
 

这种方法通过生成器函数(Generator)实现流式输出去重结果,可以有效处理大规模数据而不会导致内存溢出。当然也有很多上述只是其中一个

对于海量数据的复杂数组去重,分块处理或者流式处理是两种常用的方法。选择合适的方法取决于数据的来源和处理方式,通常需要根据实际情况来进行调整和优化,以确保内存使用和性能都能够达到预期的效果。

0条评论
0 / 1000
w****n
17文章数
1粉丝数
w****n
17 文章 | 1 粉丝
原创

数组元素去重拓展

2024-07-02 09:55:29
11
0
 

简单数据类型去重

简单数据类型去重逻辑如下,相应的对比复杂数据类型只需要需改判断两个值是否相等逻辑即可

Set

使用 Set(),将创建一个唯一值的实例,隐式使用此实例将删除重复项

let charsArr = ['A', 'B', 'C', 'B', 'C']
let deduplicateArr = [...new Set(charsArr)]

console.log(deduplicateArr)
 

Output:

['A', 'B', 'C']
 

indexOf()和filter()

indexOf()方法返回数组中元素第一次出现的索引为了消除重复项,filter()方法用于仅包含其索引与其 indexOf 值匹配的元素,filer 方法会根据对其执行的操作返回一个新数组

let charsArr = ['A', 'B', 'C', 'B', 'C']
let deduplicateArr = charsArr.filter((element, index) => {
    return charsArr.indexOf(element) !== index
})

console.log(deduplicateArr)
 

Output:

['A', 'B', 'C']
 

includes()和forEach()

如果元素在数组中,则 include() 函数返回 true,如果元素不在数组中,则返回 false

let charsArr = ['A', 'B', 'C', 'B', 'C']

let deduplicateArr = []
charsArr.forEach((element) => {
    if (!deduplicateArr.includes(element)) {
        deduplicateArr.push(element)
    }
})

console.log(deduplicateArr)
 

Output:

['A', 'B', 'C']
 

vue响应式数据去重

在 Vue.js 中使用响应式数组,数组中的每个对象或者元素都会被包装成响应式对象,这意味着当对象的属性发生变化时,视图会自动更新

function uniqueArray(arr) {
    // 判断是否为响应式数组
    const isVueArray = Array.isArray(arr) && arr.__ob__

    // 去重函数
    function filterUnique(arr) {
        return arr.filter((item, index, self) =>
            index === self.findIndex((t) => (
                isVueArray ? JSON.stringify(t) === JSON.stringify(item) : t === item
            ))
        )
    }

    if (Array.isArray(arr)) {
        // 简单数据类型数组或非响应式对象数组
        if (!isVueArray) {
            return Array.from(new Set(arr))
        } else {
            // Vue.js 或类似框架的响应式数组
            return filterUnique(arr.slice())
        }
    } else {
        // 处理复杂对象数组的情况
        if (arr instanceof Object) {
            const keys = Object.keys(arr)
            const filteredKeys = filterUnique(keys)
            const result = {};
            filteredKeys.forEach(key => {
                result[key] = arr[key]
            });
            return result
        } else {
            return arr
        }
    }
}
 

海量数据数组去重

分块处理

分块处理方法适用于无法一次性加载所有数据到内存的情况,比如处理文件或者通过网络获取数据。

 

步骤:

1.将数据分块加载:将海量数据按照一定的块大小(例如每次处理1000条记录)逐块加载或者流式获取。

2.使用哈希表进行局部去重:对每个块内的数据使用哈希表进行去重。哈希表可以是 Map 或者普通对象。

function deduplicateChunk(chunk) {
    let seen = new Map()
    let uniqueChunk = []

    for (let item of chunk) {
        if (!seen.has(item)) {
            seen.set(item, true)
            uniqueChunk.push(item)
        }
    }

    return uniqueChunk
}
 

3.合并去重后的结果:将每个块去重后得到的结果合并起来。

function deduplicateLargeArray(arr, chunkSize) {
    let deduplicatedArray = []

    for (let i = 0; i < arr.length; i += chunkSize) {
        let chunk = arr.slice(i, i + chunkSize)
        let deduplicatedChunk = deduplicateChunk(chunk)
        deduplicatedArray.push(...deduplicatedChunk)
    }

    return deduplicatedArray
}
 

4.返回最终去重后的数组:将所有块处理完毕后得到的去重结果返回。

注意事项:

1.性能考虑:分块处理可以降低内存使用,并且使得每个块的去重操作的时间复杂度保持在合理范围内。

2.哈希冲突:当数据量非常巨大时,哈希冲突可能会增加。可以考虑使用更复杂的哈希函数或者结合其他方法来处理。

流式处理方法

流式处理方法适用于实时生成数据或者通过迭代器逐条获取数据的场景。该方法不需要一次性加载全部数据,而是边处理边输出结果。

示例伪代码

function* deduplicateStream(arr) {
    let seen = new Map()

    for (let item of arr) {
        if (!seen.has(item)) {
            seen.set(item, true)
            yield item
        }
    }
}
 

这种方法通过生成器函数(Generator)实现流式输出去重结果,可以有效处理大规模数据而不会导致内存溢出。当然也有很多上述只是其中一个

对于海量数据的复杂数组去重,分块处理或者流式处理是两种常用的方法。选择合适的方法取决于数据的来源和处理方式,通常需要根据实际情况来进行调整和优化,以确保内存使用和性能都能够达到预期的效果。

文章来自个人专栏
Vue前端开发
17 文章 | 1 订阅
0条评论
0 / 1000
请输入你的评论
0
0