本次的系列博文主要是针对 腾讯课堂七天前端求职提升营 课程中,所推送的面试题目及编程练习的一次汇总,期间还包括三次直播课的分享,均由腾讯导师给大家讲解,该系列博文的发布已得到 IMWeb 前端学院助教的许可
课程目录
腾讯课堂 IMWeb 七天前端求职提升营 Day 1
腾讯课堂 IMWeb 七天前端求职提升营 Day 2
腾讯课堂 IMWeb 七天前端求职提升营 Day 3
腾讯课堂 IMWeb 七天前端求职提升营 Day 4
腾讯课堂 IMWeb 七天前端求职提升营 Day 5
腾讯课堂 IMWeb 七天前端求职提升营 Day 6
腾讯课堂 IMWeb 七天前端求职提升营 Day 7
经典前端面试题
问题 1: 清除浮动的几种方式,各自的优缺点
① 使用空标签清除浮动 clear:both
(理论上能清楚任何标签,增加无意义的标签)
② 使用 overflow:auto
(空标签元素清除浮动而不得不增加无意代码的弊端,使用 zoom:1
用于兼容 IE)
③ 使用 after
伪元素清除浮动(用于非 IE 浏览器)
问题 2: call 和 apply 的区别
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
问题 3: <img>
标签上 title 与 alt 属性的区别是什么?
当图片不显示时,用文字代表
title 为该属性提供信息
问题 4: 什么是语义化的 HTML?
直观的认识标签,对于搜索引擎的抓取有好处
前端常见题目个人思考题
1、 请说出三种减少页面加载时间的方法。(加载时间指感知的时间或者实际加载时间)
2、 描述下reset.css 文件的作用和使用它的好处。
在线编程任务
内容节选自博客园,由博客主 echoVic 授权转发
—— 所有 AC 代码均在 JavaScript(V8 6.0.0)下提交通过 ——
题目 19:输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下矩阵:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则依次打印出数字 1, 2, 3, 4, 8, 12, 16, 15, 14, 13, 9, 5, 6, 7, 11, 10.
① 选坐标为 (0, 0),(1, 1)...的点记为 (start, start),作为开始坐标,下一圈开始坐标为 (start 1, start 1);
② 判断是否进入下一圈(即是否打印完成)的条件是 rows > start * 2 && cols > start * 2;
③ 打印一圈的左上角坐标为 (start,start),右下角的坐标为 (cols - start - 1, rows - start - 1)
④ 根据一圈左上角和右下角坐标判断“从左到右”,“从上到下”,“从右到左”,“从下到上”需要打印的点
代码语言:javascript复制function printMatrix(matrix) {
if (matrix == null || matrix.length == 0) {
return;
}
var rows = matrix.length;
var cols = matrix[0].length;
var start = 0;
var result = [];
while (cols > start * 2 && rows > start * 2) {
var endX = cols - 1 - start;
var endY = rows - 1 - start;
//从左到右打印一行
for (var i = start; i <= endX; i ) {
result.push(matrix[start][i]);
}
//从上到下打印一行
if (start < endY) {
for (var i = start 1; i <= endY; i ) {
result.push(matrix[i][endX]);
}
}
//从右到左打印一行
if (start < endX && start < endY) {
for (var i = endX - 1; i >= start; i--) {
result.push(matrix[endY][i]);
}
}
//从下到上打印一行
if (start < endX && start < endY - 1) {
for (var i = endY - 1; i >= start 1; i--) {
result.push(matrix[i][start]);
}
}
start ;
}
return result
题目 20:定义栈的数据结构,请在该类型中实现一个能够得到栈最小元素的 min 函数。
代码语言:javascript复制var stack = [];
function push(node) {
stack.push(node);
}
function pop() {
return stack.pop();
}
function top() {
return stack[0];
}
function min() {
return Math.min.apply(this, stack);
}
题目 21:输入两个整数序列,第一个序列表示栈的压入顺序,请判断第二个序列是否为该栈的弹出顺序。假设压入栈的所有数字均不相等。例如序列 1, 2, 3, 4, 5 是某栈的压入顺序,序列 4, 5, 3, 2, 1 是该压栈序列对应的一个弹出序列,但 4, 3, 5, 1, 2 就不可能是该压栈序列的弹出序列。(注意:这两个序列的长度是相等的)
① 借用一个辅助的栈,将原数列依次压入辅助栈,栈顶元素与所给的出栈队列相比,如果相同则出栈;
② 如果不同则继续压栈,知道原数列中所有的数字压栈完毕;
③ 检测辅助栈中是否为空, 若空,则该序列是压栈序列对应的一个弹出序列。否则,说明序列不是该栈的弹出序列。
举例:
入栈:1,2,3,4,5
出栈:4,5,3,2,1
① 1 入辅助栈,此时 1 ≠ 4;
② 2 入辅助栈,此时 2 ≠ 4;
③ 3 入辅助栈,此时 3 ≠ 4;
④ 4 入辅助栈,此时 4=4,辅助栈出栈,剩下 1,2,3;同时,弹出序列向后一位,为 5;此时 3 ≠ 5,继续压栈;
⑤ 5 入辅助栈,此时 5 = 5,辅助栈出栈,剩下 1,2,3;同时,弹出序列向后一位,为 3;
⑥ 此时 3 = 3,辅助栈出栈,剩下 1,2;同时弹出序列向后一位,为 2;
⑦ 此时 2 = 2,辅助栈出栈,剩下 1;同时弹出序列向后一位,为 1;
⑧ 此时 1 = 1,辅助栈出栈,为空,所以该序列是压栈序列对应的一个弹出序列
代码语言:javascript复制function IsPopOrder(pushV, popV)
{
if(pushV.length === 0 || popV.length === 0){
return;
}
var temp = [];
var popIndex = 0;
for(var i=0;i<pushV.length;i ){
temp.unshift(pushV[i]);
while(temp.length && temp[0] === popV[popIndex]){
temp.shift();
popIndex ;
}
}
return (temp.length === 0);
}
题目 22:从上往下打印出二叉树的每个节点,同层节点从左至右打印。
① 借助两个辅助队列,一个用来存放结点,一个用来存放结点值;
② 先将根节点加入到队列中,然后遍历队列中的元素,遍历过程中,访问该元素的左右节点,再将左右子节点加入到队列中来。
代码语言:javascript复制function PrintFromTopToBottom(root) {
var queue = [];
queue.push(root);
var result = [];
if (root == null) {
return result;
}
while (queue.length) {
var temp = queue.shift();
result.push(temp.val);
if (temp.left) {
queue.push(temp.left);
}
if (temp.right) {
queue.push(temp.right);
}
}
return result;
}
题目 23:输入一个整数数组,判断该数组是不是某二叉搜索树的后序遍历的结果。如果是则输出 Yes,否则输出 No。假设输入的数组的任意两个数字都互不相同。
相关知识:
二叉查找树 (Binary Search Tree),(又:二叉搜索树,二叉排序树) 它或者是一棵空树,或者是具有下列性质的二叉树: 若它的左子树不空,则左子树上所有结点的值均小于它的根结点的值; 若它的右子树不空,则右子树上所有结点的值均大于它的根结点的值; 它的左、右子树也分别为二叉排序树。
① 根据二叉搜索树的特点,序列的最后一个元素是根结点,其左子树全都比根结点小,右子树全都比根节点大。
② 将根结点前面的数组分为左右连个部分,左侧部分都小,右侧部分都大;
③ 如果右侧部分有比根节点小的元素,那么就不是后序遍历,如此递归进行。
代码语言:javascript复制function adjustSequence(sequence, start, end) {
if (start >= end) {
return true;
}
var i = end;
while (i > start && sequence[i - 1] > sequence[end]) {
--i;
}
for (var j = i - 1; j >= start; --j) {
if (sequence[j] > sequence[end]) {
return false;
}
}
return adjustSequence(sequence, start, i - 1) && (adjustSequence(sequence, i, end - 1));
}
function VerifySquenceOfBST(sequence) {
if (!sequence.length) {
return false;
}
return adjustSequence(sequence, 0, sequence.length - 1);
}
题目 24:输入一颗二叉树和一个整数,打印出二叉树中结点值的和为输入整数的所有路径。路径定义为从树的根结点开始往下一直到叶结点所经过的结点形成一条路径。
① 前序遍历二叉树,每次更新当前路径的和 curtSum;
② 判断当前结点是否是叶子结点,以及 curtSum 是否等于 expectNumber。如果是,把当前路径保存在 res 结果中;
③ 若不符合条件,则弹出此结点。
代码语言:javascript复制function FindPath(root, expectNumber) {
var result = [];
if (root === null) {
return result;
}
dfsFind(root, expectNumber, [], 0, result);
return result;
}
function dfsFind(root, expectNumber, path, currentSum, result) {
currentSum = root.val;
path.push(root.val);
if (currentSum == expectNumber && root.left == null && root.right == null) {
result.push(path.slice(0));
}
if (root.left != null) {
dfsFind(root.left, expectNumber, path, currentSum, result);
}
if (root.right != null) {
dfsFind(root.right, expectNumber, path, currentSum, result);
}
path.pop();
}
—— 题目来源 剑指 offer ——