2025年前端面试经典题目及答案.docxVIP

  • 2
  • 0
  • 约6.58千字
  • 约 15页
  • 2025-10-20 发布于四川
  • 举报

2025年前端面试经典题目及答案

如何理解JavaScript的原型链?

JavaScript中每个对象(除null外)都有一个内部属性`[[Prototype]]`,指向其原型对象。原型对象自身也有`[[Prototype]]`,形成链式结构,直到指向`Ototype`,其`[[Prototype]]`为null,至此原型链终止。原型链的核心作用是实现继承:当访问对象属性时,若对象自身无该属性,会沿原型链向上查找,直到找到或到达null。例如:

```javascript

constobj={};

console.log(obj.__proto__===Ototype);//true

console.log(Ototype.__proto__);//null

```

通过`Object.create()`可显式指定原型,`instanceof`操作符即通过检查原型链判断类型。

闭包的定义、形成条件及实际应用场景是什么?

闭包是函数与其词法环境的组合,允许函数访问其定义时所在作用域的变量,即使该函数在原作用域之外执行。形成闭包需满足两个条件:函数嵌套(内部函数引用外部函数的变量)、内部函数在外部函数执行后仍被保留(如作为返回值或事件回调)。

实际应用包括:

1.数据封装(如模块模式):

```javascript

functioncreateCounter(){

letcount=0;

return{

increment:()=count++,

get:()=count

};

}

constcounter=createCounter();

counter.increment();//count变为1

```

2.事件处理函数保留状态;

3.函数柯里化(将多参数函数转换为单参数函数链)。

需注意闭包可能导致内存泄漏,若长期保留不再使用的闭包,应手动释放引用。

浏览器事件循环中宏任务与微任务的执行顺序是怎样的?

事件循环(EventLoop)是浏览器协调异步任务执行的机制,核心规则是:执行完当前调用栈的同步代码后,优先处理微任务队列(MicrotaskQueue),再处理宏任务队列(MacrotaskQueue),重复此过程。

-微任务包括:`Promise.then()/catch()/finally()`、`MutationObserver`、`queueMicrotask()`;

-宏任务包括:`setTimeout`、`setInterval`、`setImmediate`(Node.js)、`I/O`、`UI渲染`、`MessageChannel`。

执行顺序示例:

```javascript

console.log(同步代码);//1

setTimeout(()={//宏任务

console.log(setTimeout);//4

},0);

Promise.resolve().then(()={//微任务

console.log(Promise);//3

queueMicrotask(()={

console.log(queueMicrotask);//3.5(仍属微任务队列)

});

});

console.log(同步代码结束);//2

```

输出顺序:同步代码→同步代码结束→Promise→queueMicrotask→setTimeout。

Vue3的响应式系统相比Vue2有哪些改进?

Vue2使用`Object.defineProperty`劫持对象属性的`getter`和`setter`,存在以下限制:

-无法检测对象新增属性或删除属性(需手动调用`Vue.set`/`Vue.delete`);

-数组通过重写部分方法(如`push`)实现响应式,但直接修改索引或长度无效;

-嵌套对象需递归遍历才能实现响应式,初始化性能受对象深度影响。

Vue3改用`Proxy`代理整个对象,优势如下:

1.支持拦截对象的所有操作(包括属性新增、删除、`has`、`ownKeys`等),无需手动处理边界情况;

2.数组通过`Proxy`拦截`set`操作,直接修改索引或长度可触发响应式;

3.依赖收集(Track)和触发更新(Trigger)更高效:使用`WeakMap`存储依赖(键为原始对象,值为`Map`存储属性与依赖的对应关系),避免递归遍历,减少内存占用;

4.支持`Ref`和`Reactive`两种响应式类型,`Ref`通过`value`

文档评论(0)

1亿VIP精品文档

相关文档