1、考查Javascript中的参数传递
如下题，输出结果几何？
var type = 'images';
var size = {width: 800, height: 600};
var format = ['jpg', 'png'];
function change(type, size, format){
type = 'video';
size = {width: 1024, height: 768};
format.push('map');
}
change(type, size, format);
console.log(type, size, format);
(初见此题，一直想着考查es5变量提升，本质是考查参数传递，自己都懂，竟然还是被这道题摆了一道，唉！！！)
见解：
Tips: 可以把 ECMAScript 函数的参数想象成局部变量。 ECMAScript中所有函数的参数都是按值传递的。也就是说，把函数外部的值复制给函数内部的参数，就和把值从一个变量复制到另一个变量一样。基本类型值的传递如同基本类型变量的复制一样，而引用类型值的传递，则如同引用类型变量的复制一样。有不少开发人员在这一点上可能会感到困惑，因为访问变量有按值和按引用两种方式，而参数只能按值传递。
在向参数传递基本类型的值时，被传递的值会被复制给一个局部变量（即命名参数，或者用 ECMAScript 的概念来说，就是 arguments 对象中的一个元素）。在向参数传递引用类型的值时，会把 这个值在内存中的地址复制给一个局部变量，因此这个局部变量的变化会反映在函数的外部。
————《JavaScript高级程序设计(第3版)》第四章4.1.3小节-参数传递
结果：
'images', {width: 800, height: 600}, ['jpg', 'png', 'map']
2、css样式表中的样式覆盖顺序
如下题，输出结果几何？
<style>
.red {color:red;}
.green {color:green;}
</style>
<div class="red green">第一行：颜色是什么？</div>
<div class="green red">第二行：颜色是什么？</div>
(怪自己无知，一直简单的以为根据类选择器后来者居上原则覆盖)
见解：
Tips:
一些教材中（w3schools等），只说css的顺序是“元素上的style” > “文件头上的style元素” >“外部样式文件”，但对于样式文件中的多个相同样式的优先级怎样排列，没有详细说明，这是导致对这道题无知的关键。
attention:
1、样式表的元素选择器选择越精确，则其中的样式优先级越高：id选择器指定的样式 > 类选择器指定的样式 > 元素类型选择器指定的样式
2. 对于相同类型选择器制定的样式，在样式表文件中，越靠后的优先级越高。注意，这里是样式表文件中越靠后的优先级越高，而不是在元素class出现的顺序。
结果：(都为绿色，样式表中.green排在.red后面，故.green优先级高)
第一行：颜色是什么？
第二行：颜色是什么？
3、防抖(debounce) 和 节流(throttling)是什么？
传送门,点我4、深层递归如何直接跳出循环？
思考：
重点在于“直接”两字，传统关键字：break,return，未能直接跳出，而是一层一层往外退出
success eg：
const deep = arr => {
for (let i = 0; i < arr.length; i++) {
if (Array.isArray(arr[i])) {
if(deep(arr[i]))
return true
} else {
if (arr[i] === 2) return true
}
}
}
见解：
给函数添加一个返回值, 然后循环的时候判断这个值
5、你真的理解CSS盒子模型吗？
important：
盒子模型简单点理解就是外边距(margin)+边框(border)+内边距(padding)+内容(content)，页面所呈现的效果其实就是一个个盒子堆叠而成的，这是大家普遍的理解。那你知道每一个元素其实是包含了一个“外在盒子”和一个“内在盒子”吗？其中“外在盒子”负责元素是一行显示还是换行显示，而“内在盒子”则负责宽高、内容展现。盒子模型中难理解的还在于内联盒模型，前端大佬张鑫旭称这是入门CSS开发人员与熟练CSS开发人员之间的分水岭，是需要反复拿来看拿来体味的，可见一斑。点我看更多>>
6、关于内联盒子,幽灵空白节点的问题
什么是幽灵空白节点：
“幽灵空白节点”是内联盒模型中非常重要的一个概念,具体指的是,在HTML5文档声明中,内联元素的所有解析和渲染表现就如同每个行框盒子的前面有一个“空白节点”一样。这个“空白节点”永远透明,不占据任何宽度,看不见也无法通过脚本获取,就好像幽灵一样,但又确确实实地存在,表现如同文本节点一样。”
——《CSS世界》第三章 3.4.3 幽灵空白节点
更多问答，点我>>
7、你理解Event Loop吗？
传送门,点我8、编程题：输入框输入数字12345678.6519转化成RMB形式：12,345,678.65
代码：
function moneyFormat(inputval){
inputval = inputval.toFixed(2).toString();
let [int,float,result] = [inputval.split('.')[0],inputval.split('.')[1],’’];
int = int.split('').reverse();
int.forEach((item,index)=>{
result += item;
if((index+1) % 3 === 0 && (index+1)!=int.length){
result += ','
}
})
result = result.split('').reverse().join('');
return result + '.' + float;
}
9、编程题：有一个数组和一个数，数组里是否有任意两个数之和恰好为给定的数，补充代码实现.并在控制台打印输入匹配到的每一个组合。
var arrs=[1,5,8,2,6,3] , adnum = 9;
代码：
function matchNums(arrs, adnum){
let comb = [];
function matchNums(arrs, adnum){
for(let i=0;i<arrs.length;i++){
for(let j=i+1;j<arrs.length;j++){
if(arrs[i]+arrs[j]===adnum){
comb.push([arrs[i],arrs[j]]);
console.log(arrs[i],arrs[j]);
}
}
}
}
}
10、请定义CSS类，满足要求：有四个div块，①电脑屏幕上单排显示,总宽度不超过800，②手机屏幕分两排显示，横向占满手机屏幕。
<div class=”tipsa”>
<div>A</div><div>B</div><div>C</div><div>D</div>
</div>
代码：
<style>
.tipsa{
display: flex;
flex-wrap: nowrap;
box-sizing: border-box;
max-width: 800px;
}
@media screen and (max-device-width: 764px){
.tipsa{
dipaly: grid;
grid-template-columns: repeat(2, 50%);
grid-template-rows: repeat(2, 50%);
}
}
<style>
11、在浏览器禁用Cookie的情况下，如何预防CSRF攻击？简要说明。
答案：
对于每个request，在服务器端生成一个新的csrf_token，并将其返回在页面的表单中。在服务器端每次接收到请求时，都会验证表单中是否包含正确的csrf_token。由于第三方网站无法得知正确的csrf_token，所以无法进行csrf攻击。
12、成绩表如下，请写一条SQL语句，查询出每门课都大于70分的学生姓名
姓名 课程 分数
name course grade
张三 语文 81
张三 数学 65
王五 语文 71 result表
王五 数学 86
王五 英语 90
答案：
select name from (select name,min(grade) from result group by name having min(grade)>70) result;
13、成绩表如下，写一条SQL语句满足要求：数据编号不会重复，但其它数据存在完全一致的情况，请保留编号最小的一条数据，删除完全一致的多条的重复数据。
数据编号 学号 姓名 课程编号 课程名称 分数
id no name class class_name score
a1c1 2005001 张三 0001 数学 65
a2b1 2005002 李四 0001 数学 81 result表
a3d1 2005001 张三 0001 数学 65
答案：
delete from result where id not in (
select b.id from (select MIN(id) as id from result group by no,name,class,class_name,score having count(*) >= 1) b)
