面试题：JavaScript数组方法兼容性测试及优化

Question

假设你需要在项目中频繁使用数组的flatMap方法，但项目要兼容IE浏览器。请设计一套方案，既要保证在支持该方法的浏览器中正常使用原生方法以获取最佳性能，又要在不支持的浏览器中通过polyfill实现该功能。详细说明实现思路和关键代码。

Answer 1

实现思路

1. 首先检查浏览器是否支持 Array.prototype.flatMap 方法。
2. 如果支持，直接使用原生方法，以获取最佳性能。
3. 如果不支持，通过 Object.defineProperty 给 Array.prototype 定义 flatMap 方法，模拟其功能。在模拟实现中，先对数组的每个元素应用回调函数，然后将结果展平。

关键代码

if (!Array.prototype.flatMap) {
    Object.defineProperty(Array.prototype, 'flatMap', {
        value: function(callback, thisArg) {
            return this.reduce((acc, val, index, array) => {
                const mapped = callback.call(thisArg, val, index, array);
                return acc.concat(Array.isArray(mapped)? mapped : [mapped]);
            }, []);
        },
        writable: true,
        configurable: true,
        enumerable: false
    });
}

在项目中使用 flatMap 时，无需额外处理，因为上述代码已确保无论浏览器是否支持原生 flatMap，都能正常使用该方法。例如：

const arr = [1, 2, 3];
const result = arr.flatMap(num => [num * 2]);
console.log(result);