JavaScript删除数组中的指定值

AiWork开发文档

在官方文档的基础上，进行重新排版和优化。
一个优雅的文档，对于开发体验的提升，是效果显著的。
永久域名：aiwork.wiki

使用 splice() 方法来删除JavaScript数组中指定值的元素，并且包含详细的注释。

这个函数接受两个参数：原数组和要删除的数组成员值。

/**
 * 从数组中删除指定的元素值
 * 
 * @param {Array} array - 要处理的数组
 * @param {*} value - 要删除的元素值
 * @returns {Array} - 返回删除指定值后的新数组
 * @author 飞云
 * @wechat imfeiyun
 * @link  http://www.feiyunjs.com
 */
function removeByValue(array, value) {
    // 找到要删除的元素值的索引
    const index = array.indexOf(value);

    // 如果元素存在（即索引不为 -1），则进行删除
    if (index !== -1) {
        // 使用 splice() 方法从数组中删除该元素
        array.splice(index, 1);
    } else {
        console.log(`Value "${value}" not found in the array.`);
    }

    // 返回删除元素后的数组
    return array;
}

/**
 * 使用示例
 */
const myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log('Original array:', myArray);

// 删除数组中值为 4 的元素
const updatedArray = removeByValue(myArray, 4);
console.log('Updated array:', updatedArray);

// 删除一个不存在的值（例如 10）
const anotherUpdate = removeByValue(myArray, 10);
console.log('Another update (non-existent value):', anotherUpdate);

代码说明：

1. removeByValue 函数:

   • 函数接收两个参数：array（要处理的原数组）和 value（要删除的数组成员值）。
   • 函数内部首先使用 indexOf() 方法找到 value 在数组中的索引位置。
   • 如果该值存在（即索引不是 -1），使用 splice() 方法删除该元素。
   • 如果找不到该值，打印一条提示信息。

2. splice() 方法:

   • splice(index, 1) 会从指定的 index 位置开始删除 1 个元素。
   • 注意，splice() 方法会直接修改原数组，因此原数组中的元素会被改变。

3. 返回值:

   • 函数返回删除指定值后的数组。如果值未找到，返回的数组与原数组相同。

4. 使用示例:

   • 在示例中，我们定义了一个数组 myArray，然后调用 removeByValue 函数删除值为 4 的元素，最后打印删除后的数组。
   • 还演示了如果删除一个不存在的元素（如 10），函数会打印提示信息。

运行效果：

Original array: [1, 2, 3, 4, 5, 6, 7, 8, 9]
Updated array: [1, 2, 3, 5, 6, 7, 8, 9]
Value "10" not found in the array.
Another update (non-existent value): [1, 2, 3, 5, 6, 7, 8, 9]

这样，你就可以通过 removeByValue 函数轻松地从数组中删除指定值的元素，并且获得更灵活的功能。