1、下面的输出结果是什么？有何不同？why?
var a=10+20+'30';
console.log(a);//3030
var b='10'+20+30;
console.log(b)//102030
从左向右执行，数字和字符串相加，数字会隐式转换为字符串类型
2、实现以下函数
add(2, 5); // 7
add(2)(5); // 7
具体实现：第一个简单，第二个考察的是闭包
function add(a, b) {
return a + b;
}
add(2, 5);
function add(a) {
return function(b) {
return a + b;
}
}
add(2)(5);
3、写出下面题目的输出结果
var foo = '';
console.log(foo||(foo = "bar"));//"bar"
考察点：赋值语句的返回值就是赋的值
4、下面两个 alert 的结果分别是什么？
var foo = "Hello";
(function() {
var bar = " World";
alert(foo + bar); //hello World
})();
alert(foo + bar);//Uncaught ReferenceError: bar is not defined
考察点：作用域
5、 编码：input ‘abcdefg’，output ‘gfedcba’
法一：
var a = 'abcdefg';
var b = a.split('').reverse().join('');
console.log(b);
法二：
var str = 'abcdefg';
Array.prototype.map.call(str, function(x){
return x;
}).reverse().join();
考察点：
1）split空字符串分割，stringObject 中的每个字符之间都会被分割；
2）reverse() 方法：颠倒数组中元素的顺序，改变原来的数组，而不会创建新的数组；
3）join():可以使用空字符串连接，默认逗号连接。
6、console.log(['1','2','3'].map(parseInt)) 输出值？
[1, NaN, NaN]
考察点：map和parseInt方法
1）map 是ECMAScript 5 的一个内置数值方法，把函数作为它的参数，遍历数组中所有的元素，并且为每个元素调用一次这个传入map中的函数，当前元素作为参数传入该函数。函数调用完毕之后将返回结果存入一个新数组中，不会改变原始数组。不会对空数组进行检测。
函数定义：
arr.map(callback[,thisArg]);
callback函数需要以下3个值：
currentValue：当前处理数值
index：处理的数值的索引值
array：map函数处理的函数值,即arr
thisArg可选. ，callback函数里的this值 默认是window对象
2）parseInt函数定义：parseInt(string, radix)
string: 需要转化的字符，如果不是字符串会被转换，忽视空格符。
radix：数字2-36之间的整型。默认使用10，表示十进制。如果省略该参数或其值为 0，则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头，将以 16 为基数。如果radix在2-36之外会返回NaN。
那么根据上面的函数定义，这道题目即可转化为求下面这个数组的值：
[parseInt('1', 0),parseInt('2', 1),parseInt('3', 2)]
结果显而易见：[1, NaN, NaN]
7、find和filter的区别
A、find：返回符合测试条件的第一个数组元素索引值，如果没有符合条件的则返回 undefined。对于空数组，函数是不会执行的。没有改变数组的原始值。
array.find(function(currentValue, index, arr)[,thisValue])
callback函数需要以下3个值：
currentValue：当前处理数值
index：处理的数值的索引值
arr：map函数处理的函数值
thisValue:可选
B、filter:创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。如果没有符合条件的元素则返回空数组。不改变数组的原始值。
array.filter(function(currentValue,index,arr)[, thisValue])
参数同find
8、出现下图这种情况的原因以及解决办法
html及css代码：
原因：
1、同一行的行内元素对齐方式默认是底部对齐，即vertical-align：baseline；
2、对于内容为空的inline-block元素而言，该元素的基线就是它的margin底边缘，否则就以元素的内部最后一行内联元素为基线,所以你看黄色的div和cxcx那一排字是对齐的。
解决方式：
1.float方式（考虑脱离流后后面元素不易控制，故不首选）
2.增加vertical-align属性，改成下面酱紫就可以了：
div {
display: inline-block;
vertical-align：bottom;//居中，顶部，底部都可以
}
9、使用原生js 实现下图中所示的input和p标签点击删除自己
考察点：document.getelementsByTagName、document.querySelectorAll、onclick、DOM节点删除、
可以通过getelementsByTagName一个个获取标签节点，但是如果标签很多，还是用querySelectorAll吧。注意子节点的删除方式。
var tags = document.querySelectorAll('input,p');
for (var i = 0; i < tags.length; i++) {
tags[i].onclick = function () {
this.parentNode.removeChild(this);//首先要找到当前节点的父节点，然后删除父节点的子节点
}
}
10、使用原生js给动态生成的button添加click事件
考察点：委托、监听、冒泡
注意：addEventListener的最后一个参数，默认false,在冒泡阶段执行;true,捕获阶段执行。
具体实现：
var myBody = document.getElementsByTagName("body")[0];
AddButton();
function AddButton() {
var bt = document.createElement("button"); //createElement生成button对象
bt.innerHTML = '删除';
myBody.appendChild(bt); //添加到页面
}
function fnHandler(e) {
e = e || window.event;
var t = e.target || e.srcElement; //t:目标对象
var tagName = t.tagName; //tagName标签名称
if (tagName == 'BUTTON') {
console.log('333333333333');
}
}
function addEventHandler(oTarget, sEventType, fnHandler) {
if (oTarget.addEventListener) { //监听IE9，谷歌和火狐
oTarget.addEventListener(sEventType, fnHandler, false);
} else if (oTarget.attachEvent) { //IE
oTarget.attachEvent("on" + sEventType, fnHandler);
} else {
oTarget["on" + sEventType] = fnHandler;
}
}
addEventHandler(myBody, 'click', fnHandler);
11、禁止浏览器回退
A、回退后，产生一个前进事件。
window.history.forward(1);
B、禁用键盘的backspace键，繁琐且没有办法消除鼠标的误操作。
C、h5新增，可消除后退的所有动作。包括 键盘、鼠标手势等产生的后退动作。
history.pushState(null, null, document.URL);//创建（添加）一个新的history实体,消除历史记录
window.addEventListener('popstate', function () {//监听
history.pushState(null, null, document.URL);
});
