腾讯课堂 IMWeb 七天前端求职提升营 Day 5

字数 2196阅读 235
Unsplash

本次的系列博文主要是针对 腾讯课堂七天前端求职提升营 课程中,所推送的面试题目及编程练习的一次汇总,期间还包括三次直播课的分享,均由腾讯导师给大家讲解,该系列博文的发布已得到 IMWeb 前端学院助教的许可

IMWeb 前端学院 授权转发

0. 课程目录

腾讯课堂 IMWeb 七天前端求职提升营 Day 1
腾讯课堂 IMWeb 七天前端求职提升营 Day 2
腾讯课堂 IMWeb 七天前端求职提升营 Day 3
腾讯课堂 IMWeb 七天前端求职提升营 Day 4
腾讯课堂 IMWeb 七天前端求职提升营 Day 5
腾讯课堂 IMWeb 七天前端求职提升营 Day 6
腾讯课堂 IMWeb 七天前端求职提升营 Day 7

1. 经典前端面试题

问题 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 在同行显示。

2. 前端常见题目个人思考题

1、前端安全方面有没有了解?CSRF 如何攻防?

2、 说说你对 SVG 理解?

3. 在线编程任务

内容节选自博客园,由博客主 echoVic 授权转发

echoVic 授权转发

—— 所有 AC 代码均在 JavaScript(V8 6.0.0)下提交通过 ——

题目 25:输入一个复杂链表(每个节点中有节点值,以及两个指针,一个指向下一个节点,另一个特殊指针指向任意一个节点),返回结果为复制后复杂链表的 head。(注意,输出结果中请不要返回参数中的节点引用,否则判题程序会直接返回空)

思路:
递归思想:把大问题转换为若干小问题。
将复杂链表分为头结点和剩余结点两部分,剩余部分采用递归方法。

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 结点之后,并返回尾结点;
⑤ 向左遍历返回的链表至头结点处,即为所求双向链表的首结点。

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 空对象,用来判断字符是否重复,若重复则跳过排序。

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,即为所求数字。

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 个数。

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 记录累计值;
③ 对于数组中的一个数 array[i],若其左边的累加和非负,那么加上 array[i];
④ 判断此时的 tempsum 是否大于 sum,若大于此时的 sum,则用 sum 记录下来。

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 ——

End of File

行文过程中出现错误或不妥之处在所难免,希望大家能够给予指正,以免误导更多人,最后,如果你觉得我的文章写的还不错,希望能够点一下喜欢关注,为了我能早日成为简书优秀作者献上一发助攻吧,谢谢!^ ^

推荐阅读更多精彩内容