任务48高级2018年前端面试押题测试题

1、1 纯应试向大部分可以在谷歌上搜到。套路1.举例2.将不会的变成会的3.侃侃而谈HTML1.（必考） 你是如何理解 HTML 语义化的？第一种举例，段落用 p，边栏用 aside，主要内容用 main第二种第三种：对面试官说请看博客 https:/z/p/325704236.meta viewport 是做什么用的，怎么写？死背： 7. 一开始，所有页面都是给 PC 准备的，推出 3GS，页面是不适应屏幕的， 所以的工程师想了一个办法，默认把模拟成 980px，页面缩小。8. 后来，智能普及，这个功能在部分不需要了，所以就用 meta:vp 让不要缩小网页。2. 最开始是后端写 HTML，不会

2、 CSS，于是就用 table 来布局。table 使用展示表格的。严重了 HTML 语义化。后来有了专门的写 CSS 的前端，他们会使用 DIV + CSS 布局，主要是用 float 和绝对定位布局。稍微符合了 HTML 语义化。再后来，前端专业化，知道 HTML 的各个的用法，于是会使用恰当的来展示内容，而不是傻傻的全用 div，会尽量使用 h1、ul、p、main、header 等语义化的好处是已读、有利于 SEO 等。9.canvas 元素是干什么的？项目丢给他。看 MDN 的 canvas 入门手册。CSS1.（必考） 说说盒模型。举例：content-box: width = 内

3、容区宽度border-box: width = 内容区宽度 + padding 宽度 + border 宽度2.css reset 和 normalize.css考英文：reset 重置，之前的样式我不要，acolor: red;，抛弃默认样式区别？normalize 让所有浏览器的都跟标准规定的默认样式一致，各浏览器上的标签默认样式基本。3.（必考）如何居中？平时总结：水平居中：身上写 text-align:center;内联：块级：margin-left: auto; margin-right: auto;垂直居中：4.选择器优先级如何确定？选择器越具体，优先级越高。 #大于 .yyy同样

4、优先级，写在后面的覆盖前面的。color: red !important; 优先级最高。5.BFC 是什么？举例：overflow:hidden清除浮动。（方方总是用 .clearfix 清除浮动，坚决不用overflow:hidden清除浮动）overflow:hidden取消父子 margin 合并。/conulod/1/edit?html,css,js,output （方方用padding-top: 1px;）6.如何清除浮动？overflow: hidden （方方）.clearfix 清除浮动写在身上JS1.JS 有哪些数据类型？string number boodefined nu

5、ll object symbolobject 包括了数组、函数、正则、日期等对象一旦出现（数组、函数、正则、日期、NaN）直接 0 分2.（必考） Promise 怎么使用？then链式 then如何自己生成 Promise 对象function()return new Promise(function(resolve, reject)setTimeout()=$.ajax(.).then(成功函数, 失败函数).then(成功函数 2, 失败函数 2)$.ajax(.).then(成功函数, 失败函数).clearfix:aftercontent: ; display: block; cle

6、ar:both;.clearfixzoom: 1; /* IE 兼容 */3. （必考） AJAX 手写一下？12. （必考）闭包是什么？正确参考：https:/z/p/2248690824. （必考）这段代码里的this 是什么？fn()里面的 this 就是 windowfn()是 strict mode，this就是 undefineda.b.c.fn()里面的 this 就是 ew F() 里面的 this 就是新生成的实例function ()var n = 0return function() 16.n += 117.18. 19.20. let adder = () 21. ad

7、der() / n = 1 22. adder() / n = 223. console.log(n) / n is not definedlet xhr = new XMLHttpRequest()xhr.open(T, /x)xhr.onreadysechange = function()if(xhr.readySe = 4 & xhr.sus = 200)console.log(xhr.responseText) 9.10. 11. xhr.send(a=1&b=2)resolve() 或者 reject(),3000)().then(.)() = console.log(this)里面

8、 this跟外面的 this 的值一模一样正确参考：https:/z/p/2380424725. （必考）立即执行函数？使用立即执行函数的目的是什么？造出一个函数作用域，防止污染全局变量ES 6 新语法38. async/await 语法了解吗？目的是什么？function returnPromise()return new Promise( function(resolve, reject)setTimeout()=resolve() 43.,3000)44.)45. 46.returnPromise().then(result)=result = 49. )50.51. var resul

9、t = await returnPromise()let name;(function ()var name 28. ();(function ()var name 31. )()32. !function ()33.var name 34. ()function ()var name 37. ()把异步代码写成同步代码。54. 如何实现深拷贝？JSON 来深拷贝缺点：JSON、undefined、RegExp、Date不支持函数、递归拷贝环RegExp、Date、Set、Symbol、WeakMap55. 如何实现数组去重？计数排序的逻辑（只能正整数）var a = 4,2,5,6,3,4,

10、5var hashTab = for(let i=0; iif(e.matcheector) fn.call(el, e, el)/ 有 bug 但是可以应付面试官的事件委托function listen(element, eventType, selector, fn) element.addEventListener(eventType, e = le= e.while (!el.matcheector) if (element = el) el = null break.el = el.parentNodeel & fn.call(el, e, el)xxi.xxii.xxiiixxiv

11、.xxv.xxvi.HTTP1.HTTP 状态码知道哪些？2.301和 302 的区别是什么？i.301重定向，浏览器会记住ii.302临时重定向3.HTTP 缓存怎么做？i.Cache-Control: max-age=300ii./1.js?v=1 避开缓存4.Cache-Control 和 Etag的区别是什么？5.是什么？Ses是什么？i.a.HTTP 响应通过 Set-设置b.作为 Request Header浏览器指定是必须带上c.一般用来用户信息ii.Sesa.Ses是服务器端的内存（数据）b.SesSesID 实现一般通过在里c.SesID 一般是随机数)return elem

12、ent. / 工资 12k+ 的前端写的事件委托listen(ul, click, li, ()=)ulli*5span6.LocalStorage 和的区别是什么？i.会随请求被发到服务器上，而 LocalStorage 不会ii.大小一般 4k 以下，LocalStorage 一般 5Mb 左右7.（必考）GETT 的区别是什么？和i.参数。GET 的参数放在 url息体里。T 的参数（数据）放在请求消的查询参数里，ii.安全（扯淡）。GET 没有T 安全（都不安全）iii.GET 的参数（url 查询参数）有长度限制，一般是 1024个字符。T 的参数（数据）没有长度限制（扯淡，410M

13、b 限制）iv.包。GET 请求只需要发一个包，T 请求需要发两个以上包（因为T 有消息体）（扯淡，GET 也可以用消息体）v.GET 用来读数据，T 用来写数据，T 不幂等（幂等的意思就是不管发多少次请求，结果都一样。）8.（必考）怎么跨域？JSONP 是什么？CORS 是什么？tMessage 是什么？i.JSONPii.CORSiii.tMessage 看一下 MDNVue1.（必考）Vue 有哪些生命周期钩子函数？看文档：.vuejs./v2/api/#%E9%80%89%E9%A1%B9-%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E9%92%A9%E5

14、%AD%902.（必考）Vue 如何实现组件通信？父子通信（使用 Prop 传递数据、使用 v-on 绑定自定义事件）通信（通过两对父子通信，爷爸之间父子通信，爸儿之间父子通信）兄弟通信（new Vue()作为 eventBus）3.Vuex 的作用是什么？/ro.html看文档、博客4.VueRouter 路由是什么？看文档、博客5.6.Vue 的双向绑定是如何实现的？看文档，深入响应式原理缺点？Computed计算属性的用法？跟 Methods 的区别。https:/z算法/p/337785941.排序算法（背诵冒泡排序、选择排序、计数排序、快速排序、排序、归并排序）2.二分查找法3.翻转

15、二叉树把上面三个背一下，算法题必过。安全1.XSS？如何预防？举例ment 内容是div.innerHTML=ment /$.get(?=+.)就被执行了，这就是 XSS/预防a.不要使用 innerHTML，改成 innerText，script 就会被当成文本，不执行b.如果你一样要用 innerHTML，字符过滤把 替换成 替换成 把 & 替换成 &;把 替换成 把 替换成 代码 div.innerHTML =ment.replace(/g, console.log()模块就是按需加载的2.转译速度慢什么办？方方不会。3.写过 wck loader 吗？http:/发散题/2016/01

16、/wck-loader-1/1.URL 到页面展现中间发生了什么？从输入i.DNS查询 DNS 缓存ii.TCP 连接（三次握手）连接复用建立iii.HTTP 请求（请求的四部分）发送iv.处理请求a.80 端口b.路由c.渲染 HTML 模板d.生成响应v.HTTP 响应发送vi.TCP 连接（四次挥手）关闭vii.HTMLviii.CSS（缓存ix.CSSx.JS（缓存xi.JSxii.xiii.xiv.渲染 DOM 树xv.渲染样式树xvi.执行 JS2.你没有工作经历吗？i.一开始就问，可以拜拜。ii.中间问最后问，他想压价。iii.解法：用项目打动它：你看下作品，跟一年经验的前端差距大吗？团队一年工作经验的前端，写的出来我这样的作品吗？凭的工作。作品，我觉得我可以胜3.你遇到过最难是什么？htt/question/35323603/answer/3387961534.你的期望薪资是多少？你想要的工资 加 10002000。5.（任何你不会）i.承认不会ii.询问详细细节：你问的是不是方面的知识？请问你想问的是哪方面知识？iii.根据面试官的回答，向有利于自己的方向引导话题。刁钻代