1.为什么面试官要我写 instanceof
2.爆肝干货面试官：你能实现一下call()的面试面试源码嘛？今天我们就来搞懂call()源码instanceof源码和类型转换
3.一道面试题，解锁JavaScript中的源码Event-Loop事件循环机制(面试必考)
4.面试官：请你动手实现一个简单的发布-订阅模式
5.前端面试：我又又又换工作了（含前端面试题及答案）
6.3年工作经验的前端工程师都会出错的面试题，js是编程弱类型语言，那么什么是面试面试隐式转换

为什么面试官要我写 instanceof

       在前端面试中，instanceof 是源码一个常见的问题。面试官通常会要求面试者手写 instanceof 的编程冰冻精灵源码实现，以测试他们对 JavaScript 类型系统和原型链的面试面试理解。

       在 JavaScript 中数据分为基本类型和引用类型。源码

       在实际工作中，编程我们常常需要判断一个变量的面试面试类型。对于基本类型(null 除外) 和 Function 我们可以使用 typeof 进行判断。源码对于引用类型我们则需要使用 instanceof 进行判断。编程

       MDN 定义:instanceof 是面试面试 JavaScript 的一个二元操作符，用于测试构造函数的源码 prototype 属性是否出现在对象的原型链中的任何位置。换句话说，编程instanceof 可以用于判断一个对象是否由某个构造函数创建的。

       在这个例子中，auto 是 Car 的一个实例，所以auto instanceof Car 返回 true。

       注意：左侧可以是任意类型，而右侧必须是一个函数的实例。参数错误时会报错。

       每个对象都有一个__proto__ 属性。在对象创建的时候会将 __proto__ 属性指向它的构造函数的 prototype 属性上。并且构造函数的 prototype 属性本身也是一个对象。它也有自己的 __proto__ 属性。通过 __proto__ -> prototype 这样串联形成一个链条，这个链条就是原型链。原型链的终点是 Object，Object.prototype.__proto__ 的值为 null。

       每个对象的构造函数都可以在原型链上找到，因此instanceof 通过原型链可以判断对象是否由某个构造函数创建。

       下面是一个简易的 instanceof 实现：

       当传入的参数是对象时，如果操作成功Reflect.getPrototypeOf(target) 返回对象的原型，如果操作失败（比如，目标不是对象）则返回 false。

       本文介绍了 JavaScript 类型判断的hessdroid 源码方法。对instanceof 的概念、用法和实现进行了说明。

爆肝干货面试官：你能实现一下call()的源码嘛？今天我们就来搞懂call()源码instanceof源码和类型转换

       前言

       面试官提问：你能实现一下 call() 源码吗？

       今天，我们将深入学习 JavaScript 类型转换、call() 方法源码以及 instanceof 操作符。

       学习目标：

       总结 JavaScript 数据类型

       理解 typeof() 方法与引用类型判断

       掌握 instanceof 的原理与使用

       实现 call() 方法的源码

       JavaScript 数据类型概览

       JavaScript 中的数据类型包括基本类型和引用类型。基本类型有：Number、String、Boolean、Null、Undefined、Symbol 和 BigInt。引用类型包括：Object 和函数。

       类型转换案例

       了解如何通过 typeof() 方法判断基本类型与引用类型（除函数外）。注意，typeof() 方法对原始数据类型（如 null）存在局限性。

       实例演示

       通过实例，展示如何使用 typeof() 方法判断变量类型。

       类型转换案例分析

       探讨原始数据类型如何被识别为 Object，以及 instanceof 操作符在不同场景下的作用。

       instanceof 原理与应用

       instanceof 是基于原型链进行类型检测的。它会从对象的原型链逐级向上查找，直到找到匹配的构造函数原型。

       实现 instanceof 源码

       介绍如何构建实现 instanceof 的源码，包含参数处理与原型链查找过程。

       Array.isArray() 方法

       了解 JavaScript 内置的 Array.isArray() 方法，专门用于判断一个对象是否为数组。

       判断数组实例

       通过案例验证 instanceof 和 Array.isArray() 方法的正确性。

       call() 方法源码实现

       解释 call() 方法的原理，包括隐式绑定与函数执行过程。

       实现 call() 源码

       展示 call() 方法的源码实现，包括参数传递与 this 指向处理。

       案例验证

       通过代码案例验证实现的 call() 方法源码。

       总结与问答

       整理今天学习的重点，鼓励提问和讨论，期待读者的roycms 源码反馈与建议。

       感谢阅读，期待您的反馈与支持。

一道面试题，解锁JavaScript中的Event-Loop事件循环机制(面试必考)

       一道常见的面试题要求你理解JavaScript中的Event-Loop事件循环机制。让我们一步步分析这个问题：

       首先，面试题是关于打开一个网页并输入URL的过程。这个过程涉及多个步骤：浏览器新开进程，启动渲染线程、HTTP请求进程和JS引擎线程。JS引擎是单线程的，这影响了代码执行的顺序。

       在事件循环机制中，关键概念是宏任务和微任务。宏任务包括setTimeout和DOM操作，微任务则如Promise的.then处理。事件循环遵循固定的步骤：执行同步代码、放入宏/微任务队列、执行微任务、渲染页面、再执行宏任务，如此循环直到所有任务完成。

       在提供的案例中，当调用async函数时，事件循环的顺序导致了输出结果的特定顺序。例如，`async1`函数中的`await async2()`会立即执行`async2`，其结果和随后的console.log语句被放入微任务队列。而`async2`执行完后，`async1 end`和`promise`相关的`then`回调也按顺序执行。

       最终，整个事件循环的输出结果会按照事件循环机制的顺序逐一出现。这道题目的关键在于理解事件循环的工作原理和如何影响JavaScript代码的执行流程。

面试官：请你动手实现一个简单的发布-订阅模式

       订阅发布模式在JavaScript开发中是一种常见且强大的设计模式，它允许对象之间进行松散耦合的通信，从而提高了代码的可维护性和可扩展性。本文将深入探讨订阅发布模式的reportmachine 源码原理、用途以及如何在JavaScript中实现。

       订阅发布（Publish-Subscribe）模式的基本思想是解耦发布者和订阅者之间的关系。发布者不需要直接知道订阅者的存在，订阅者也不需要直接知道发布者的存在。它们通过一个中介（通常是一个事件总线或事件管理器）进行通信。通过一个图辅助理解，我们可以直观地看到订阅发布模式的运作流程。

       在订阅发布模式中，发布者将事件发送到事件总线或事件管理器中，然后订阅者订阅感兴趣的事件。当事件发生时，事件总线或事件管理器会通知所有订阅了该事件的订阅者，并调用它们预先注册的回调函数，从而实现了一种松耦合的通信方式。

       订阅发布模式提供了一种松散耦合的通信方式，让对象之间的关联更加灵活。它的主要优点包括：降低耦合度、提高代码的可读性和可维护性、支持异步通信等。

       在JavaScript中，我们可以使用以下方式来实现订阅发布模式。接下来，我们将通过几个简单的实例来演示如何实现订阅发布模式。

       示例一：下面是一个简单的JavaScript实现一个简单的事件触发和订阅机制。

       代码具体来说，在这个例子中，订阅了onSell事件，并添加了两个回调函数。当onSell事件被触发时，这两个回调函数都会被执行，分别输出信息"hello"和"world"。

       示例二：在示例一的基础上新增一个取消订阅的功能。

       在这段代码中，首先订阅了两个回调函数wan和wu到事件'onSell'上。然后取消了回调函数wan的订阅。最后，gmsv源码触发了事件'onSell'。因此，最终的输出将是：因为触发事件'onSell'时，只有回调函数wu仍然订阅着，所以只会执行回调函数wu。

       通过上述方法，用户可以灵活地管理事件和对应的回调函数，实现事件的订阅和触发。示例三：根据上面两段实例我们接下来实现仅订阅一次事件。尽管我们上面多次使用once方法订阅事件，但是回调函数只会执行一次，所以输出一次"hello world"。通过上述方法，我们可以实现基本的事件订阅、发布和取消订阅功能。一次方法尤其适用于只需要执行一次回调函数的场景，避免了重复订阅导致多次执行的问题。

       订阅发布模式是一种非常有用的设计模式，它提供了一种松散耦合的通信方式，可以帮助我们构建更加灵活和可扩展的应用程序。通过深入理解订阅发布模式的原理和实现方式，我们可以更好地利用它来提高代码的质量和可维护性。

前端面试：我又又又换工作了（含前端面试题及答案）

       在年，前端领域经历了一波最新面试浪潮，有幸已经收到offer。面试内容覆盖了JavaScript基础、ES6、浏览器原理、HTTP、Webpack、框架技术、算法和项目实战等多个方面。以下是对面试题及答案的整理，仅供个人参考，欢迎留言补充和指正。

       面试初期，投递简历时，面试官常会关注的基本点包括：项目经历、技术栈、解决问题的能力等。在这些方面，面试者需要准备清晰且具体的事例，展示自己的能力和经验。

       面试题一：JS继承的多种方式及优缺点。如原型链、构造函数、类、ES6的class和Reflect.apply()等。优点在于代码的复用性高，结构清晰；缺点在于原型链查找机制可能导致性能问题，类继承可能导致代码难以维护。

       面试题二：事件代理的实现原理、优缺点及使用场景。事件代理是指将事件绑定到目标元素的父元素上，利用冒泡机制触发该事件。优点在于减少事件监听的数量，提高性能；缺点是使用不当会造成事件在不应该触发时触发。通常在有大量子元素且事件类型固定的情况下使用事件代理。

       面试题三：Event Loop（事件循环）机制的理解与应用。Event Loop是JavaScript运行机制的核心，包括宏任务队列和微任务队列的执行过程。理解Event Loop机制对于合理安排异步代码执行顺序至关重要。

       面试题四：ES6模块化使用方法及AMD、CMD、CommonJS的区别。ES6模块化通过import和export实现，提供更严格的模块隔离和更好的加载效率。AMD（异步模块定义）和CMD（通用模块定义）则更多地用于客户端，分别提供了独立加载和模块加载的机制，而CommonJS则主要用于服务器端，如Node.js。

       面试题五：手写一个Promise。Promise是处理异步操作的标准API，了解其基本结构、状态（pending、fulfilled、rejected）以及如何使用.then、catch和.then方法进行链式调用。

       面试题六：浏览器垃圾回收机制。浏览器的垃圾回收机制主要有标记清除和引用计数两种方式，目前主要使用标记清除机制，用于自动管理内存。

       面试题七：浏览器加载过程及优化。浏览器加载过程涉及DNS解析、TCP连接、HTML解析、CSS加载、JavaScript执行、渲染等步骤。优化加载速度的策略包括压缩代码、缓存资源、利用CDN、懒加载等。

       面试题八：HTTP状态码的含义及使用场景。HTTP状态码由三位数字组成，用于描述请求的结果。常见的状态码包括（成功）、（未找到）、（服务器错误）等。

       面试题九：axios实例封装。封装axios实例通常包括请求拦截、响应拦截、全局token封装及错误提示等功能，以提高代码的复用性和安全性。

       面试题十：webpack的使用及loader与plugin的区别。webpack用于构建JavaScript应用程序，loader负责处理各种文件（如JSX、Scss、vue等），而plugin则作用于整个构建流程，提供更高级的定制化功能。

       面试题十一：Vue CLI配置webpack、计算属性缓存原理、vuex数据刷新及Vue组件间通信方式。

       面试题十二：数据结构与算法题。如在整数数组中查找两个数的差绝对值和下标差绝对值均小于等于给定值的元素，以及求解爬楼梯问题等。

       面试题十三：项目实战经验分享。重点介绍项目亮点、遇到的问题及解决方案，展示项目管理、团队协作、技术选型等能力。

       面试总结：面试不仅是为了获得offer，更是对自我技术水平和知识结构的检验。在准备面试的过程中，更重要的是深入理解技术原理和应用，而非单纯记忆答案。保持学习态度，持续提升技术能力，是前端工程师成长的关键。

3年工作经验的前端工程师都会出错的面试题，js是弱类型语言，那么什么是隐式转换

       面试题：在JavaScript运行中，''+3-3的结果是什么？

       答案是：C.

       这似乎违背了我们的直觉，但请跟随我一起了解JavaScript的隐式转换。

       JavaScript是一种弱类型语言，支持以下基本类型：Number, Boolean, String, Null, Undefined, Symbol, BigInt（新引入但暂不讨论）。引用类型则是Object，包括Function、Array等。

       隐式转换指的是在执行某些操作时，JavaScript自动将不同类型的值转换为同一类型。转换规则主要分为几类：

       1. **转原始值**：对象类型转换为原始值时，遵循特定规则。例如，数组会转为字符串，逗号分隔，空数组转为''，null或undefined视为''，函数转换为字符串形式，对象返回'[object Object]'。

       2. **转字符串**：其他类型转为字符串的规则如下。以'5' + '4'为例，结果会是''。

       3. **转数字**：布尔值转数字为false，其他转为true。具体转法遵循各类型转数字的规则。

       4. **转布尔值**：非空值转为true，空值转为false。

       隐式转换发生于以下场景：相等比较（==）、算术运算（+、-、*、/）、比较运算（>、=、<=）、if判断、while循环、取非等。

       例如：在'' + 3 - 3中，''与整数3相加前，会先将字符串''转换为数字，结果为。

       了解隐式转换规则对于解决JavaScript面试题至关重要。希望这能帮助你更好地理解JavaScript的运作机制。

面试官：请你讲讲 js 中 Bind

       面试官询问关于 JavaScript 中的 Bind 方法时，我们需要了解它如何帮助我们在函数调用时明确 this 的指向。Bind 方法是 JavaScript 中实现函数内部 this 指向指定对象的关键工具。它允许我们在函数或方法被调用时，轻松地绑定 this 到预设的对象上，这对于避免因 this 指向问题导致的错误至关重要。

       例如，当你试图在按钮点击事件中更改文本输入框的内容时，可能会遇到 this 指向错误。原本的 clickHandler() 方法中，this 指向的是按钮的 HTML 元素。为了解决这个问题，可以使用 bind() 函数将事件绑定到 user 对象上，如 $("button").click(user.clickHandler.bind(user))。

       Bind 方法在 ES5 标准中引入，可能不被所有旧浏览器支持。为兼容性考虑，可以使用polyfill。当将包含 this 的方法赋值给变量时，this 的指向会随之改变，这时可以借助 bind() 来确保在全局上下文中执行的函数指向正确的对象，比如在全局函数 showDataVar() 中绑定到 user 对象。

       在 JavaScript 中，bind 还有助于函数的借用和柯里化。函数借用时，通过 bind 可以避免意外覆盖已有方法。柯里化则允许函数接收部分参数后返回一个新函数，以处理剩余参数。以 greet() 函数为例，可以使用 bind 来实现参数传递的灵活性。

       总的来说，JavaScript 的 Bind 方法是实现函数灵活性和控制 this 指向的关键，它在现代 JavaScript 开发中不可或缺。理解并熟练运用 bind，可以提升代码的可读性和可维护性。