本次的系列博文主要是针对 腾讯课堂七天前端求职提升营 课程中,所推送的面试题目及编程练习的一次汇总,期间还包括三次直播课的分享,均由腾讯导师给大家讲解,该系列博文的发布已得到 IMWeb 前端学院助教的许可
课程目录
腾讯课堂 IMWeb 七天前端求职提升营 Day 1
腾讯课堂 IMWeb 七天前端求职提升营 Day 2
腾讯课堂 IMWeb 七天前端求职提升营 Day 3
腾讯课堂 IMWeb 七天前端求职提升营 Day 4
腾讯课堂 IMWeb 七天前端求职提升营 Day 5
腾讯课堂 IMWeb 七天前端求职提升营 Day 6
腾讯课堂 IMWeb 七天前端求职提升营 Day 7
经典前端面试题
问题 1: Ajax 的优缺点都有什么?
① 页面无刷新,用户体验非常好。
② 使用异步方式与服务器通信,具有更加迅速的响应能力。
③ 可以把一些服务器负担的工作转到客户端,利用客户端闲置的能力来处理,减轻服务器负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax的原则是“按需取数据”,可以最大程度的减少冗余请求和响应对服务器造成的负担。
④ 基于标准化并被广泛支持的技术,不需要下载插件或者小程序。
Ajax 的缺点:
① Ajax 不支持浏览器 back 按钮。
② 安全问题, Ajax暴露了与服务器交互的细节。
③ 对搜索引擎的支持比较弱。
④ 破坏了程序的异常机制。
⑤ 不容易调试。
问题 2: 简述一下 Ajax 的工作原理
Ajax 的核心是 JavaScript 对象 XmlHttpRequest。该对象在Internet Explorer 5 中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest 使您可以使用 JavaScript 向服务器提出请求并处理响应,而不阻塞用户。
问题 3: CSS DIV 开发 Web 页面的优势有哪些?
① CSS DIV,这个网页设计模式中,DIV 承担了网页的内容,CSS 承担了网页的样式。这样就使网页的内容和样式的分离开来。有利于页面的维护升级。
② 有助于提高搜索引擎亲和力(快速找到需要的数据,而不是像在 TABLE 中一层层的查找)
③ 有助于页面的重构(换皮肤如 blog,直接套用另外一套样式就可以实现,而不用改动网页脚本)
问题 4: 简述 DIV 元素和 SPAN 元素的区别
DIV 默认情况下是分行显示,SPAN 在同行显示。
前端常见题目个人思考题
1、前端安全方面有没有了解?CSRF 如何攻防?
2、 说说你对 SVG 理解?
在线编程任务
内容节选自博客园,由博客主 echoVic 授权转发
—— 所有 AC 代码均在 JavaScript(V8 6.0.0)下提交通过 ——
题目 25:输入一个复杂链表(每个节点中有节点值,以及两个指针,一个指向下一个节点,另一个特殊指针指向任意一个节点),返回结果为复制后复杂链表的 head。(注意,输出结果中请不要返回参数中的节点引用,否则判题程序会直接返回空)
思路:
递归思想:把大问题转换为若干小问题。
将复杂链表分为头结点和剩余结点两部分,剩余部分采用递归方法。
代码语言:javascript复制function RandomListNode(x) {
this.label = x;
this.next = null;
this.random = null;
}
function Clone(pHead) {
if (!pHead) {
return null;
}
// 复制头结点
var node = new RandomListNode(pHead.label);
node.random = pHead.random;
// 递归其他节点
node.next = Clone(pHead.next);
return node;
}
题目 26:输入一棵二叉搜索树,将该二叉搜索树转换成一个排序的双向链表。要求不能创建任何新的结点,只能调整树中结点指针的指向。
思路:
① 递归思想:把大问题转换为若干小问题;
② 由于 JavaScript 中并没有链表或者 Tree 这样的原生数据结构,都是通过对象模拟的,因此最终要返回的是指向双向链表首结点的指针;
③ 将左子树构成双向链表,返回的是左子树的尾结点,将其连接到 root 的左边;
④ 将右子树构成双向链表,将其追加到 root 结点之后,并返回尾结点;
⑤ 向左遍历返回的链表至头结点处,即为所求双向链表的首结点。
代码语言:javascript复制function Convert(pRootOfTree) {
if (!pRootOfTree) {
return null;
}
var lastNode = null;
lastNode = ConvertNode(pRootOfTree, lastNode);
var head = lastNode;
while (head && head.left) {
head = head.left;
}
return head;
}
function ConvertNode(node, lastNode) {
if (!node) {
return;
}
if (node.left) {
lastNode = ConvertNode(node.left, lastNode);
}
node.left = lastNode;
if (lastNode) {
lastNode.right = node;
}
lastNode = node;
if (node.right) {
lastNode = ConvertNode(node.right, lastNode);
}
return lastNode;
}
题目 27:输入一个字符串,按字典序打印出该字符串中字符的所有排列。例如输入字符串 abc,则打印出由字符 a, b, c 所能排列出来的所有字符串 abc, acb, bac, bca, cab 和 cba。
输入描述:输入一个字符串,长度不超过 9 (可能有字符重复),字符只包括大小写字母。
思路:
① 递归思想:把大问题转换为若干小问题;
② n 个元素的全排列 = (n-1) 个元素全排列 一个元素作为前缀。
③ 递归的出口:只有一个元素的全排列,此时排序完成,输出数组。
④ 遍历字符串,将每个字符放在第一个元素作为前缀,并将其余元素继续全排列。
⑤ 新建一个 isRepeat 空对象,用来判断字符是否重复,若重复则跳过排序。
代码语言:javascript复制function Permutation(str) {
var result = [];
if (str.length <= 0) {
return [];
}
var sortTemp= "";
var arr = str.split("");
result = sortString(arr, sortTemp, []);
return result;
}
function sortString(arr, sortTemp, res) {
if (arr.length == 0) {
res.push(sortTemp);
} else {
var isRepeat = {};
for (var i = 0; i < arr.length; i ) {
if (!isRepeat[arr[i]]) {
var temp = arr.splice(i, 1)[0]; // 取出第i个字符
sortTemp = temp; // 第i个字符设为前缀
sortString(arr, sortTemp, res);
arr.splice(i, 0, temp); // 补全取出的元素,恢复原字符串
sortTemp= sortTemp.slice(0, sortTemp.length - 1); // 清空sortTemp
isRepeat[temp] = true;
}
}
}
return res;
}
题目 28:数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字。例如输入一个长度为 9 的数组 {1,2,3,2,2,2,5,4,2}。由于数字 2 在数组中出现了 5 次,超过数组长度的一半,因此输出 2。如果不存在则输出 0。
思路:
① 新建一个空对象 obj 保存数组中数字出现的次数;
② 遍历数组,如果该数字出现过,则 obj 中以该数字为 key 的 value 加 1;
③ 若该数字未出现过,则 obj 中以该数字为 key 的 value 设为 1;
④ 遍历 obj 对象,返回 value 大于数组长度一半的 key,即为所求数字。
代码语言:javascript复制function MoreThanHalfNum_Solution(numbers)
{
var obj = {};
var length = numbers.length;
numbers.forEach(function(d) {
if (obj[d]) {
obj[d] ;
} else {
obj[d] = 1;
}
})
for (var i in obj) {
if (obj[i] > Math.floor(length / 2)) {
return i;
}
}
return 0;
}
题目 29:输入 n 个整数,找出其中最小的 k 个数。例如输入 4, 5, 1, 6, 2, 7, 3, 8 这 8 个数字,则最小的 4 个数字是 1, 2, 3, 4。
思路:使用 JavaScript 的 Array 对象的 sort() 方法进行自小到大排序,然后输出最小的 k 个数。
代码语言:javascript复制function GetLeastNumbers_Solution(input, k)
{
if(input.length < k) return false;
input.sort(function(a,b){return a-b;});
return input.slice(0,k);
}
题目 30:HZ 偶尔会拿些专业问题来忽悠那些非计算机专业的同学。今天测试组开完会后,他又发话了:在古老的一维模式识别中,常常需要计算连续子向量的最大和,当向量全为正数的时候,问题很好解决。但是,如果向量中包含负数,是否应该包含某个负数,并期望旁边的正数会弥补它呢?例如:{ 6, -3, -2, 7, -15, 1, 2, 2},连续子向量的最大和为 8 (从第 0 个开始,到第 3 个为止)。你会不会被他忽悠住?(子向量的长度至少是 1)
思路:
① 遍历数组,遇到负的和则放弃之前的结果,重新积累,这期间保留最大值;
② 用 sum 记录最终返回的最大和,用 tempsum 记录累计值;
③ 对于数组中的一个数 arrayi,若其左边的累加和非负,那么加上 arrayi;
④ 判断此时的 tempsum 是否大于 sum,若大于此时的 sum,则用 sum 记录下来。
代码语言:javascript复制function FindGreatestSumOfSubArray(array)
{
if (array.length < 0)
return 0;
var sum = array[0],
tempsum = array[0]; //注意初始值 不能设为0 防止只有负数
for (var i = 1; i < array.length; i ) {
tempsum = (tempsum < 0) ? array[i] : tempsum array[i];
sum = (tempsum > sum) ? tempsum : sum;
}
return sum;
}
—— 题目来源 剑指 offer ——