原生JS面试题及答案.docxVIP

原生JS面试题及答案

1.请解释原型、原型链的概念，并用代码举例说明instanceof的判断原理

答案：

原型（prototype）：每个函数创建时自带的属性，指向一个对象，该对象的属性和方法会被函数的实例继承。

原型链：实例对象通过__proto__指向其构造函数的原型，原型对象又通过__proto__指向更高层原型（如Object.prototype），最终指向null，这种链式结构就是原型链。

instanceof原理：判断右侧构造函数的prototype是否在左侧实例的原型链上。

代码示例：

//构造函数

functionPerson(name){

this.name=name;

}

//实例

constlily=newPerson(Lily);

//验证原型关系

console.log(lily.__proto__===Person.prototype);//true（实例__proto__指向构造函数原型）

console.log(Person.prototype.__proto__===Object.prototype);//true（原型链上层）

console.log(Object.prototype.__proto__);//null（原型链终点）

//instanceof原理验证

console.log(lilyinstanceofPerson);//true（Person.prototype在lily原型链上）

console.log(lilyinstanceofObject);//true（Object.prototype在lily原型链上）

2.什么是闭包？闭包有哪些实际应用场景？需要注意什么问题？

答案：

闭包定义：函数嵌套时，内层函数引用了外层函数的变量/参数，且内层函数被外层函数外的作用域引用，此时内层函数就是闭包，它能保留外层函数的作用域（即使外层函数已执行完毕）。

实际应用场景：

模块化封装：避免变量污染全局，如封装工具函数。

防抖节流：保存定时器ID，控制函数执行频率。

数据私有化：模拟类的私有属性。

注意问题：闭包会保留外层函数的作用域，若未及时释放引用，会导致内存泄漏（如DOM元素被闭包引用时，即使DOM删除，内存仍无法回收）。

代码示例（防抖函数）：

//闭包实现防抖：间隔1000ms内无新触发则执行函数

functiondebounce(fn,delay){

lettimer=null;//闭包保留timer变量

returnfunction(...args){

clearTimeout(timer);//每次触发清除之前的定时器

timer=setTimeout(()={

fn.apply(this,args);

},delay);

};

}

//使用：输入框有哪些信誉好的足球投注网站防抖

constinput=document.querySelector(input);

input.oninput=debounce((e)={

console.log(有哪些信誉好的足球投注网站内容：,e.target.value);

},1000);

3.请分析以下代码的执行顺序，并说明原因（事件循环相关）

console.log(1);

setTimeout(()={

console.log(2);

Promise.resolve().then(()=console.log(3));

},0);

Promise.resolve().then(()=console.log(4));

console.log(5);

答案：

执行顺序：1→5→4→2→3

原因（事件循环机制）：

同步代码优先执行：先打印1，再执行console.log(5)，打印5。

异步任务分两类：

微任务（Microtask）：Promise.then/catch/finally、async/await等，优先级高于宏任务。

宏任务（Macrotask）：setTimeout、setInterval、DOM事件等。

同步代码执行完后，先清空微任务队列：执行Promise.resolve().then(...)，打印4。

微任务清空后，执行宏任务队列：执行setTimeout回调，先打印2，再触发新的微任务Promise.resolve().then(...)，打印3。

4.原生JS中获取DOM元素的方法有哪些？它们的返回值和区别是什么？

答案：

常用方法及区别：

方法

返回值类型