58同城 前端工程师面试题
58同城2017秋招前端工程师笔试卷
JS 输出值问题
var a=[0];
if(a){
console.log(a==true);
}
else{
console.log("wut");
}
结果输出是什么？
false
css 属性能够设置盒模型的内边距为上 10px 、下 20px 、左 30px 、右 40px 的合并写法 ____.
padding:10px 40px 20px 30px;
当块级元素设置 box-sizing:border-box 属性时，该块级元素的 width 包含哪几个部分？
padding,border和content
列举出 3 个 JS 中的基本数据类型
基本数据类型6种：number，string，Boolean，undefined，null, symbol(ES6)
input 的 type 属性值列举 3 个.
text, password，file，checkbox，radio，submit，email
移动浏览器中，触摸一下屏幕会依次触发哪些事件.
触摸事件，有touchstart touchmove touchend touchcancel 四种之分 touchstart：手指触摸到屏幕会触发 touchmove：当手指在屏幕上移动时，会触发 touchend：当手指离开屏幕时，会触发 touchcancel：可由系统进行的触发，比如手指触摸屏幕的时候，突然alert了一下，或者系统中其他打断了touch的行为，则可以触发该事件
‘5’+3 等于 ____ ， ‘5’-3 等于 ____.
字符串和数字相加，会把数字转成字符串再相加：如 ‘5’ + 3 = ‘5’ + ‘3’ = ‘53’ 字符串和数字相减，会把字符串转为数值再相减：
常见的浏览器端的存储技术有哪些？
cookie：放在http请求头中，伴随数据传输而传输，数据传输大小有限制，有过期时间
localstorage：存储在本地，不会伴随数据传输，生命周期为永久
sessionstorage：浏览器中，浏览器关闭则消失，即使在同源浏览器中也不能共享
userdata：ie中用于浏览器存储技术
globalstorage：ff中用于浏览器存储
非严格模式下写出下面表达式结果
parseInt(“123a”)=____.
123
JS输出结果
var a=[1,2,3,4,5];
a.splice(1,3,5,2,1);
console.log(a);
a 的输出结果 ____
输出为[ 1, 5, 2, 1, 5 ]
splice() 方法向/从数组中添加/删除项目，然后返回被删除的项目。
splic(1,3)，删除了，从第二位开始，3个字符的数量，返回[1,5]，
数组[5,2,1]，添加到删除的位置，返回的数组就是[1,5,2,1,5]
简述css中position属性为absolute和relative的区别。
1、position：relative 相对定位
特点：
* 1）不影响元素本身的特性；
* 2）不使元素脱离文档流（元素移动之后原始位置会被保留）；
* 3）如果没有定位偏移量，对元素本身没有任何影响；
* 4）提升层级。
注：定位元素位置控制：top/right/bottom/left 定位元素偏移量
2、position：absolute 绝对定位
特点：
* 1）使元素完全脱离文档流；
* 2）使内嵌支持宽高；
* 3）块属性标签内容撑开宽度；
* 4）如果有定位父级相对于定位父级发生偏移，没有定位父级相对于document发生偏移；
* 5）相对定位一般都是配合绝对定位元素使用；
* 6）提升层级
简述domready和onload事件的区别？图片的onload和domready和页面onload的先后顺序，并简述原因。
dom文档加载的步骤为：
1.解析html结构
2.加载外部脚本和样式表文件
3.解析并执行脚本代码
4.dom树构建完成 // DOMContentLoaded
5.加载图片等外部文件
6.页面加载完毕 // window.onload 可以通过addEventListener测试一下结果 先DOMContentLoaded也即domready然后img的ready最后window的ready。
描述一个你在实际项目中有用过什么比较好的布局方式（不拘泥于页面整体布局，页面中某一小版块也行），深入讲解下其中的原理？
就拿响应式布局来说，pc站当然是把所有能呈现的东西都呈现出来，而且一般整体是纵向布局，局部用横向布局（float较多）。到了平板电脑，基本上和pc的布局也是差不多的。到了手机，才开始有了很大的变化，整体依然是纵向布局，但是横向布局却变得越来越少，因为手机能呈现在一屏的内容确实是少之又少，而且还要考虑到分辨率大小的问题，所以一般都是不用float布局，把最重要的功能呈现出来，没有pc里面那么多的效果。
左侧固定宽度，右侧自适应 给父盒子设置高度和左内边距如200px 给左侧子盒子设置设置高度和左外边距-200px，设置float:left,设置宽度为200px 右侧子盒子设置高度
目前用得最多的就是flex布局和float布局交替使用，比如导航栏没有特殊样式需求，都是横着排的我就会选择用flex布局，让各个元素自动排列，如果导航栏中有几个是左排，有一个是居右显示，此时我就会选择用float来布局
Ajax是什么？Ajax的交互模型？同步和异步的区别？如何解决跨域问题？
一、Ajax是什么？
1、Ajax全称asynchronous javascript and xml ，可以说是已有技术的组合。 2、主要用来实现客户端与服务器的异步通信效果，实现页面的局部刷新 3、ajax的实现过程 创建XMLHttpRequest对象，也就是创建一个异步调用对象 创建一个新的http请求，并指定该http请求的方法、URL以及验证信息 设置响应http请求状态变化的函数 发起http请求 获取异步调用返回的数据 使用javascript 和 dom 实现局部刷新
二、同步、异步的区别 同步:阻塞的 两人吃饭。一人忙，一人等 异步:非阻塞的 两人吃饭。一人忙，另一个不等
三、如何解决跨域问题？
理解跨域的概念:协议、域名、端口都相同是同源，否则都是跨域 解决:动态创建script标签，使用标签的src属性访问js文件的形式获取js脚本，并且这个js脚本中的内容是函数调用，该函数调用的参数是服务器返回的数据，为了获取这里的参数数据，需要事先在页面中定义回调函数，在回调函数中处理服务器返回的数据。
简述 instanceof 和 type 的区别？
简述 []instanceof Object的值和原因？
区别详见https://segmentfault.com/a/1190000000730982，粗糙地讲： type 获取对象的基本类型，常用于判断对象是否赋值，instanceof 返回对象的类。
直接instanceof Object 将报错,应为instanceof操作的是类对象，而 Object 是一个方法 （可用 typeof Object查看）
typeof一元运算符， 用来检测基本数据类型，
返回值有undefined,string,boolean,number,function,object,都是加引号的
对于是不是数组用typeof检测不出来，要用到instanceof了，当然可以用Array.isArray() instanceof 双目运算符， 用来检测引用类型，返回值是boolean形的 var a=[1,2];a instanceof Array
编写一个函数isMerge，判断一个字符串str是否可以由其他两个字符串part1和part2“组合”而成。
“组合 ”的规则如下：
1). str中的每个字母要么来自于part1，要么来自于part2;
2). part1和part2中字母的顺序与str中字母的顺序相同。
例如：
“codewars"由"cdw"和"oears"组合而成：
s: c o d e w a r s = codewars
part1: c d w = cdw
part2: o e a r s = oears
完成函数：
function isMerge(s, part1, part2) {
//code here
}
https://www.nowcoder.com/test/question/done?tid=39066548&qid=108089#summary
编写请给 Array 本地对象增加一个原型方法，它用于删除数字数组中重复的数字（可能有多个），返回值是一个包含被删除的重复条目的新数组。
https://www.nowcoder.com/test/question/done?tid=39066548&qid=108090#summary
编程题克隆可乐
小 S，小L，小P，小R和小H 五个人排队站在一个出售’克隆可乐’的自动贩卖机前 ； 队伍中除了他们五个没有其他人 。 队形如下 ： 小 S，小L，小P，小R，小H
队列的第一个人 （小S）买了一听可乐，喝下去后变成了两个小S！然后两个小S心满意足的站到了队伍的最后。此时队形变成了这样：
小 L，小P，小R，小H，小S，小S
然后队列中下一个人 （小L）也买了听可乐，喝下去后变成两个人，站到了队伍最后。以此类推。例如小P第三个喝了克隆可乐，之后队伍变成这个样子：
小 R，小H，小S，小S，小L，小L，小P，小P
请问第 n个喝这个饮料的人是谁？
https://www.nowcoder.com/test/question/done?tid=39066548&qid=109249#summary
