JavaScript笔试题及答案.docxVIP

JavaScript笔试题及答案

一、基础语法题（每题8分，共24分）

请分析以下代码执行结果，并说明原因：

console.log(a);

vara=10;

console.log(b);

letb=20;

写出以下代码的输出结果，并解释数组方法的执行逻辑：

constarr=[1,2,3,4];

constresult=arr.map(item=item*2).filter(item=item5);

console.log(result);

console.log(arr);

分析以下函数的this指向，并修改代码让this始终指向window（至少两种方案）：

constobj={

name:test,

fn:function(){

console.log();

}

};

constnewFn=obj.fn;

newFn();

二、进阶理解题（每题12分，共36分）

请解释原型链的核心概念，并分析以下代码的执行结果：

functionPerson(name){

=name;

}

Ptotype.sayHi=function(){

console.log(`Hi,${}`);

};

constp1=newPerson(Tom);

constp2=Object.create(Ptotype);

=Jerry;

p1.sayHi();

p2.sayHi();

console.log(p1.__proto__===Ptotype);

console.log(p2instanceofPerson);

分析以下异步代码的执行顺序，写出输出结果并说明事件循环机制：

console.log(start);

setTimeout(()={

console.log(timeout1);

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

},0);

Promise.resolve().then(()={

console.log(promise2);

setTimeout(()=console.log(timeout2),0);

});

console.log(end);

实现一个防抖函数（debounce），要求：

频繁触发函数时，只在最后一次触发后延迟n毫秒执行

支持立即执行（第一次触发时直接执行，后续触发防抖）

支持取消功能（能手动取消防抖任务）

三、实战应用题（每题20分，共40分）

实现深拷贝函数deepClone，要求：

支持基本数据类型（Number、String、Boolean等）

支持引用类型（Object、Array）

处理循环引用问题

忽略函数类型属性

编写一个简易的TodoList功能，要求：

页面结构包含输入框、添加按钮、任务列表

输入内容后点击添加，将任务添加到列表（需做非空校验）

点击任务项可切换完成状态（添加删除线样式）

支持删除单个任务

利用localStorage实现数据持久化（刷新页面不丢失）

答案解析

一、基础语法题

执行结果：undefined、UncaughtReferenceError:Cannotaccessbbeforeinitialization

原因：

var声明存在变量提升，会在代码执行前创建变量a并初始化为undefined，所以第一个console输出undefined；

let声明存在块级作用域且有“暂时性死区”，在letb声明前访问b会报错，不会进行变量提升。

输出结果：[6,8]、[1,2,3,4]

执行逻辑：

map方法遍历数组，将每个元素乘以2生成新数组[2,4,6,8]（不改变原数组）；

filter方法过滤新数组中大于5的元素，得到[6,8]；

原数组arr未被修改，仍为初始值。

原this指向：window（newFn是全局作用域下调用，this指向全局对象）

修改方案：

//方案1：bind绑定

constnewFn=obj.fn.bind(window);

//方案2：箭头函数（利用词法作用域）

constnewFn=()=obj.fn();

二、进阶理解题

原型链核心概念：

每个对象都有__proto__属性（指向其原型对象），原型对象也有自己的原型，形成链式结构即原型链；当访问对象属性时，会先在自身查找，找不到则沿原型链向上查找，直到Oto（null）。

执行结果：Hi,Tom、Hi,Jerry