面试官:怎么实现一个对象过滤器?😅

假如你面前的是B站面试官

问:怎么实现一个函数能按指定类型过滤出数组中的对象?

我:?

一、基础实现

核心需求 :实现函数filterByType(arr, type),从数组中筛选出指定类型的元素

typescript 复制代码
function filterByType(arr, type) {
    return arr.filter(item => {
        if (type === 'array') return Array.isArray(item)
        return typeof item === type
    })
}

关键缺陷

  1. 无法正确处理nulltypeof null === 'object'
  2. 对象类型包含数组等特殊类型
  3. 缺少对现代JS类型(如Symbol)的支持

二、类型深度解析

JavaScript类型判断的复杂性体现在:

  • 原始类型undefined, boolean, number, string, bigint, symbol
  • 对象类型object, function, array, Date
  • 特殊值null(伪对象类型)

类型判断方法对比

方法 优点 缺点
typeof 快速判断原始类型 无法区分null/array
instanceof 判断构造函数 跨iframe失效
Object.prototype.toString 精确判断所有类型 需要处理返回字符串
Array.isArray 专用数组判断 仅适用于数组

什么叫跨iframe失效

在 JavaScript 中,​跨执行环境失效 特指 instanceof 等类型判断方法在不同全局作用域(如 iframe、Web Worker、Node.js 的 vm 模块等)中失效的现象。其本质原因是:​不同执行环境拥有独立的内置构造函数,导致原型链无法匹配。

三、进阶实现

typescript 复制代码
function filterByType(arr, type) {
    return arr.filter(item => {
        if (type === 'array') {
            return Array.isArray(item);
        } else if (type === 'null') {
            return item === null;
        } else if (type === 'object') {
            return item !== null && typeof item === 'object' && !Array.isArray(item);
        } else {
            return typeof item === type;
        }
    });
}

四、总结

希望能给各位大佬以后面B站的时候一点点点点点小启发

相关推荐
二哈喇子!1 小时前
Vue3生命周期
前端·javascript·vue.js
22:30Plane-Moon3 小时前
跨域解决方案
javascript
上单带刀不带妹4 小时前
Node.js 中的 fs 模块详解:文件系统操作全掌握
开发语言·javascript·node.js·fs模块
二哈喇子!7 小时前
Vue3 组合式API
前端·javascript·vue.js
二哈喇子!8 小时前
Vue 组件化开发
前端·javascript·vue.js
C4程序员9 小时前
北京JAVA基础面试30天打卡03
java·开发语言·面试
chxii9 小时前
2.9 插槽
前端·javascript·vue.js
姑苏洛言10 小时前
扫码点餐小程序产品需求分析与功能梳理
前端·javascript·后端
Freedom风间10 小时前
前端必学-完美组件封装原则
前端·javascript·设计模式
Java技术小馆10 小时前
PromptPilot打造高效AI提示词
java·后端·面试