JS面试题汇总（五），2024年最新web前端开发工程师面试自我介绍

3. 使用新对象调用函数，函数中的 this 被指向新实例对象

Test.call(obj)

4. 将初始化完毕的新对象地址，保存到等号左边的变量中

46. call() 和 apply() 的含义和区别？

参考答案：

首先说明两个方法的含义：

• call：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B. call(A, args1, args2); 即 A 对象调用 B 对象的方法。

• apply：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B. apply(A, arguments); 即 A 对象应用 B 对象的方法。

call 与 apply 的相同点：

• 方法的含义是一样的，即方法功能是一样的；

• 第一个参数的作用是一样的；

call 与 apply 的不同点：两者传入的列表形式不一样

• call 可以传入多个参数；

• apply 只能传入两个参数，所以其第二个参数往往是作为数组形式传入

想一想哪个性能更好一些呢？

47. sort 排序原理

参考答案：

冒泡排序法

解析：

冒泡排序法的原理：

• 比较相邻的元素。如果第一个比第二个大，就交换他们两个。

• 对每一对相邻元素做同样的工作，从开始第一对到结尾的最后一对。在这一点，最后的元素应该会是最大的数。

• 针对所有的元素重复以上的步骤，除了最后一个。

• 持续每次对越来越少的元素重复上面的步骤，直到没有任何一对数字需要比较。

示例：

var arr = [1, 5, 4, 2];

// sort()方法的比较逻辑为：

// 第一轮：1和5比，1和4比，1和2比

// 第二轮：5和4比，5和2比

// 第三轮：4和2比

// 一.sort排序规则 return大于0则交换数组相邻2个元素的位置

// 二.arr.sort(function (a,b) {})中

// a -->代表每一次执行匿名函时候，找到的数组中的当前项；

// b -->代表当前项的后一项；

// 1.升序

var apple = [45, 42, 10, 147, 7, 65, -74];

// ①默认法,缺点:只根据首位排序

console.log(apple.sort());

// ②指定排序规则法,return可返回任何值

console.log(

apple.sort(function(a, b) {

return a - b; //若return返回值大于0(即a＞b),则a,b交换位置

})

);

//2.降序

var arr = [45, 42, 10, 111, 7, 65, -74];

console.log(

apple.sort(function(a, b) {

return b - a; //若return返回值大于零(即b＞a),则a,b交换位置

})

);

参考 1、参考 2

48. Zepto 的点透问题如何解决？

参考答案：

方案一：来得很直接 github 上有个 fastclick 可以完美解决https://github.com/ftlabs/fastclick

引入 fastclick. js，因为 fastclick 源码不依赖其他库所以你可以在原生的 js 前直接加上

window.addEventListener(

“load”,

function() {

FastClick.attach(document.body);

},

false

);

或者有 zepto 或者 jqm 的 js 里面加上

$(function() {

FastClick.attach(document.body);

});

当然 require 的话就这样：

var FastClick = require(“fastclick”);

FastClick.attach(document.body, options);

方案二：用 touchend 代替 tap 事件并阻止掉 touchend 的默认行为 preventDefault()

$(“#cbFinish”).on(“touchend”, function(event) {

//很多处理比如隐藏什么的

event.preventDefault();

});

方案三：延迟一定的时间(300ms+)来处理事件

$(“#cbFinish”).on(“tap”, function(event) {

setTimeout(function() {

//很多处理比如隐藏什么的

}, 320);

});

这种方法其实很好，可以和 fadeInIn/fadeOut 等动画结合使用，可以做出过渡效果

理论上上面的方法可以完美的解决 tap 的点透问题，如果真的不行，用 click

解析：

1、“点透”是什么？

你可能碰到过在列表页面上创建一个弹出层，弹出层有个关闭的按钮，你点了这个按钮关闭弹出层后后，这个按钮正下方的内容也会执行点击事件（或打开链接）。这个被定义为这是一个“点透”现象。

2、为什么会出现点透呢？

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则几千的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上前端开发知识点，真正体系化！

由于文件比较大，这里只是将部分目录大纲截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且后续会持续更新

如果你觉得这些内容对你有帮助，可以添加V获取：vip1024c （备注前端）

最后

面试一面会问很多基础问题，而这些基础问题基本上在网上搜索，面试题都会很多很多。最好把准备一下常见的面试问题，毕竟面试也相当与一次考试，所以找工作面试的准备千万别偷懒。面试就跟考试一样的，时间长了不复习，现场表现肯定不会太好。表现的不好面试官不可能说，我猜他没发挥好，我录用他吧。

96道前端面试题：

• 

常用算法面试题：

• 

前端基础面试题：
内容主要包括HTML，CSS，JavaScript，浏览器，性能优化

• 

一个人可以走的很快，但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎扫码加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

中…(img-uqQVYHrN-1712917952500)]

常用算法面试题：

• [外链图片转存中…(img-tLO7TqDB-1712917952500)]

前端基础面试题：
内容主要包括HTML，CSS，JavaScript，浏览器，性能优化

• [外链图片转存中…(img-gEjsPOne-1712917952500)]

一个人可以走的很快，但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎扫码加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！
[外链图片转存中…(img-Y3Z5ANIx-1712917952501)]