Unsplash本次的系列博文主要是针对 腾讯课堂七天前端求职提升营 课程中，所推送的面试题目及编程练习的一次汇总，期间还包括三次直播课的分享，均由腾讯导师给大家讲解，该系列博文的发布已得到 IMWeb 前端学院助教的许可
IMWeb 前端学院 授权转发课程目录
腾讯课堂 IMWeb 七天前端求职提升营 Day 1
腾讯课堂 IMWeb 七天前端求职提升营 Day 2
腾讯课堂 IMWeb 七天前端求职提升营 Day 3
腾讯课堂 IMWeb 七天前端求职提升营 Day 4
腾讯课堂 IMWeb 七天前端求职提升营 Day 5
腾讯课堂 IMWeb 七天前端求职提升营 Day 6
腾讯课堂 IMWeb 七天前端求职提升营 Day 7
经典前端面试题
问题 1: 简单说一下浏览器本地存储是怎样的
在较高版本的浏览器中，JS 提供了 sessionStorage 和 globalStorage。在 HTML5 中提供了 localStorage 来取代 globalStorage。
HTML5 中的 Web Storage 包括了两种存储方式：sessionStorage 和 localStorage。
sessionStorage 用于本地存储一个会话 (session) 中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此 sessionStorage 不是一种持久化的本地存储，仅仅是会话级别的存储。
而 localStorage 用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。
问题 2: 在 JavaScript 脚本中，isNaN 的作用是什么？
isNaN 的作用是判断值是否为数字
问题 3: 编写 JavaScript 脚本生成 1 - 6 之间的整数？
代码语言：javascript复制var NowFrame;
NowFrame = Math.random( )*6 1 //随机生成一个 1 - 6 之间的小数
NowFrame = parseInt(NowFrame) //把 1 - 6 之间的小数转化为整数问题 4: CSS 规范中，**.**（点）后面跟一个名称代表什么含义？**#**（井号）后面跟一个名称代表什么含义？如果要对一个元素设置 CSS 样式（内嵌样式），应将 CSS 样式写在它的什么属性内？
① .（点）后面跟一个名称表示文档中所有 class 属性值包含这个名称的应用其样式
② #（井号）后面跟个名称表示文档中 ID 为此名称的元素应用其样式
③ CSS 样式写在 style 属性内
前端常见题目个人思考题
1、请你谈谈 Cookie 的弊端。
2、对 BFC 规范的理解？
在线编程任务
内容节选自博客园，由博客主 echoVic 授权转发
echoVic 授权转发—— 所有 AC 代码均在 JavaScript（V8 6.0.0）下提交通过 ——
题目 31: 求出 1~13 的整数中 1 出现的次数，并算出 100~1300 的整数中1出现的次数？为此他特别数了一下 1~13 中包含 1 的数字有 1、10、11、12、13 因此共出现 6 次，但是对于后面问题他就没辙了。ACMer 希望你们帮帮他，并把问题更加普遍化，可以很快的求出任意非负整数区间中 1 出现的次数。
思路：
① 设 n = abcde，自右至左，从 1 开始标号。
② 如果第 i 位上的数字为 0，则第 i 位可能出现 1 的次数由其高位决定，若没有高位，则视为 0，此时第 i 位可能出现 1 的次数为：其高位数 * 10 ^ (i - 1)，例如若 c 为 0，则次数为 ab * 10 ^ 2;
③ 如果第 i 位上的数字为 1，则第 i 位上可能出现 1 的次数受其高位和低位影响，若没有，则视为 0，此时第 i 位可能出现 1 的次数：其高位数 * 10 ^ (i - 1) （低位数 1），例如若 c 为 1，则次数为 ab * 10 ^ 2 (de 1);
④ 如果第 i 位上的数字大于 1，则第 i 位上可能出现 1 的次数受其高位影响，若没有，则视为 0，此时第 i 位可能出现 1 的次数：（其高位数 1）* 10 ^ (i - 1)，例如若 c 大于 1，则次数为（ab 1）* 10 ^ 2;
代码语言：javascript复制function NumberOf1Between1AndN_Solution(n) {
if (n < 0) return 0;
var high, low, cur, temp, i = 1;
high = n;
var count = 0;
while (high !== 0) {
high = parseInt(n / Math.pow(10, i)); // 第i位数的高位
temp = n % Math.pow(10, i);
cur = parseInt(temp / Math.pow(10, i - 1)); // 第i位数
low = temp % Math.pow(10, i - 1); // 第i位数的低位
if (cur === 1) {
count = high * Math.pow(10, i - 1) low 1;
} else if (cur < 1) {
count = high * Math.pow(10, i - 1);
} else {
count = (high 1) * Math.pow(10, i - 1);
}
i ;
}
return count;
}题目 32: 输入一个正整数数组，把数组里所有数字拼接起来排成一个数，打印能拼接出的所有数字中最小的一个。例如输入数组 {3, 32, 321}，则打印出这三个数字能排成的最小数字为 321323。
思路：
① 本题关键点是制定排序规则，设计比较器；
② 排序规则如下：
- 若ab > ba 则 a > b，
- 若ab < ba 则 a < b，
- 若ab = ba 则 a = b；
1.例如：比较 3 和 31 时，'331' > '313'，所以返回结果是 '3' > '31'。
2.根据指定排序规则对数组进行排序，然后从小到大拼接即为所求结果。
代码语言：javascript复制function Comparator(a, b) {
var s1 = a "" b;
var s2 = b "" a;
for (var i = 0; i < s1.length; i ) {
if (s1.charAt(i) > s2.charAt(i)) {
return 1;
}
if (s1.charAt(i) < s2.charAt(i)) {
return -1;
}
}
return 1;
}
function PrintMinNumber(numbers) {
numbers.sort(Comparator);
var result = "";
for (var i = 0; i < numbers.length; i ) {
result = result numbers[i];
}
return result;
}题目 33: 把只包含因子 2、3 和 5 的数称作丑数（Ugly Number）。例如 6、8 都是丑数，但 14 不是，因为它包含因子 7。 习惯上我们把 1 当做是第一个丑数。求按从小到大的顺序的第 N 个丑数。
思路：
① 按顺序将丑数保存在数组中，然后求下一个丑数；
② 下一个丑数是由数组中某个丑数 A * 2，B * 3，C * 5 中的最小值得来的。
③ 按照题目规定，第一个丑数是 1，存入数组中；
④ 第二个丑数为 1 * 2，1 * 3，1 * 5 三个中的最小值；
⑤ 第三个丑数为 2 * 2，1 * 3，1 * 5 三个中的最小值，依次类推，求出第 N 个数组。
代码语言：javascript复制function GetUglyNumber_Solution(index) {
if (index === 0) return 0;
var uglyNum = [1];
var factor2 = 0,
factor3 = 0,
factor5 = 0;
for (var i = 1; i < index; i ) {
uglyNum[i] = Math.min(uglyNum[factor2] * 2, uglyNum[factor3] * 3, uglyNum[factor5] * 5);
if (uglyNum[i] === uglyNum[factor2] * 2) factor2 ;
if (uglyNum[i] === uglyNum[factor3] * 3) factor3 ;
if (uglyNum[i] === uglyNum[factor5] * 5) factor5 ;
}
return uglyNum[index - 1];
}题目 34: 在一个字符串(1 <= 字符串长度 <= 10000，全部由大写字母组成)中找到第一个只出现一次的字符，并返回它的位置
思路：
① 新建一个对象，其中 key 用来存放字符，value 用来存放该字符出现的次数；
② 第一次循环，将所有字符和对应出现的次数存放在 map 中，时间复杂度为 0(n)；
③ 第二次循环找到 value 为 1 的字符所在的位置，并返回。
代码语言：javascript复制function FirstNotRepeatingChar(str) {
if (str.length == 0)
return -1;
var map = {};
for (var i = 0; i < str.length; i ) {
var charX = str[i]
if (!map[charX]) {
map[charX] = 1;
} else {
map[charX] ;
}
}
for (var i = 0; i < str.length; i ) {
var charY = str[i];
if (map[charY ] == 1)
return i;
}
}题目 35: 在数组中的两个数字，如果前面一个数字大于后面的数字，则这两个数字组成一个逆序对。输入一个数组,求出这个数组中的逆序对的总数 P。并将 P 对 1000000007 取模的结果输出。 即输出 P % 1000000007
输入描述：
代码语言：javascript复制题目保证输入的数组中没有的相同的数字数据范围：
对于P的数据，size <= 10 ^ 4
对于 % 75 的数据，size <= 10 ^ 5
对于 0 的数据，size <= 2 * 10 ^ 5输入例子：
代码语言：javascript复制1, 2, 3, 4, 5, 6, 7, 0输出例子：
代码语言：javascript复制7—— AC 代码在 C/C (clang 3.3)下提交通过 ——
代码语言：javascript复制class Solution {
public:
void merge(vector<int> &vec, int l, int m, int r, vector<int> &tmp, int &cnt)
{
int i = l,j = m 1, k = 0;
while (i <= m && j <= r)
{
if (vec[i] <= vec[j])
tmp[k ] = vec[i ];
else
{
tmp[k ] = vec[j ];
cnt = (cnt m - i 1) % 1000000007;
}
}
while (i <= m) tmp[k ] = vec[i ];
while (j <= r) tmp[k ] = vec[j ];
for (int i = 0;i < k; i)
vec[l i] = tmp[i];
}
void msort(vector<int> &vec, int beg, int end, vector<int> &tmp, int &cnt)
{
if (beg < end)
{
int mid = ( beg end ) / 2;
msort(vec, beg, mid, tmp, cnt);
msort(vec, mid 1, end, tmp, cnt);
merge(vec, beg, mid, end, tmp, cnt);
}
}
int InversePairs(vector<int> data) {
int cnt = 0;
vector<int> tmp(data.size());
msort(data, 0, data.size() - 1, tmp, cnt);
return cnt;
}
};题目 36: 输入两个链表，找出它们的第一个公共结点。
思路：用两个指针扫描“两个链表”，最终两个指针到达 null 或者到达公共结点。
—— AC 代码在 C/C (clang 3.3)下提交通过 ——
代码语言：javascript复制public:
ListNode* FindFirstCommonNode( ListNode *pHead1, ListNode *pHead2) {
ListNode *p1 = pHead1;
ListNode *p2 = pHead2;
while(p1!=p2){
p1 = (p1==NULL ? pHead2 : p1->next);
p2 = (p2==NULL ? pHead1 : p2->next);
}
return p1;
}
};—— 题目来源 剑指 offer ——
