面试题：JavaScript数组元素添加删除兼容性优化之复杂场景

Question

假设你需要在一个项目中频繁向数组头部添加元素，并且要兼容IE8及以上浏览器。已知IE8不支持数组的unshift方法，你会如何优化实现该功能，确保代码在现代浏览器和IE8及以上浏览器都能高效且稳定地运行？请写出具体的代码实现及思路。

Answer 1

思路

1. 由于IE8不支持unshift方法，所以需要提供兼容方案。
2. 对于现代浏览器，直接使用unshift方法，因为其性能最优。
3. 对于IE8及类似不支持unshift的浏览器，手动实现类似功能，通过遍历数组，将每个元素向后移动一位，然后在数组开头添加新元素。

代码实现

function addToHead(arr, value) {
    if (typeof Array.prototype.unshift === 'function') {
        // 现代浏览器直接使用unshift
        arr.unshift(value);
    } else {
        // IE8及以下手动实现
        for (let i = arr.length; i > 0; i--) {
            arr[i] = arr[i - 1];
        }
        arr[0] = value;
    }
    return arr;
}

你可以这样调用该函数：

let myArray = [1, 2, 3];
let newArray = addToHead(myArray, 0);
console.log(newArray);