面试题目及答案.pdf

面试题目及答案第一章： HTML 1. img 中的 alt和 title的区别seo 优化 : 搜索引擎优化2. H5的新特性有哪些1. 画布 (Canvas) API 2. 地理 (Geolocation) API 3. 音频、视频API(audio,video) 4.localStorage和 sessionStorage 5.webworker, websocket 6.header,nav,footer,aside,article,section 语义化标签第二章： CSS 1. 如何隐藏一个元素，分别有什么特点？visibiLity:hidden 占位opacity: 0 占位display: none 不占位定位到外面transform: scale(0) 2. 如何清除浮动3. 常见的布局有哪些双飞翼布局，品字布局，让一个元素水平垂直居中4. BFC是什么？如何触发BFC ？BFC就是“块级格式化上下文”的意思，创建了 BFC 的元素就是一个独立的盒子，不过只有 Block-level box可以参与创建BFC ， 它规定了内部的Block-level Box如何布局，并且与这个独立盒子里的布局不受外部影响，当然它也不会影响到外面的元素。BFC有一下特性：内部的 Box 会在垂直方向，从顶部开始一个接一个地放置。Box 垂直方向的距离由margin 决定。属于同一个BFC的两个相邻Box 的 margin 会发生叠加每个元素的margin box 的左边，与包含块 border box 的左边相接触( 对于从左往右的格式化，否则相反)。即使存在浮动也是如此。BFC的区域不会与float box叠加。BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素，反之亦然。计算 BFC的高度时，浮动元素也参与计算。如何触发 BFC ？float 除了 none 以外的值overflow 除了 visible 以外的值（ hidden ，auto ，scroll ）display (table-cell，table-caption，inline-block, flex, inline-flex) position值为（ absolute ， fixed ）5.第三章： ES核心1. 什么是作用域？定义 : 代码作用的范围，区域作用 : 隔离变量产生时间 & 销毁时间 : 代码定义的时候产生，代码执行结束作用域链：查找变量的时候会在当前的作用域先查，如果没有沿着上一级作用域继续找，直到找到全局作用域，如果还没有报错: xxxx is not defined 2. 什么是执行上下文 ( 执行上下文环境 ) ？执行上下文栈？执行上下文分为（全局代码）全局执行上下文和（函数代码）函数执行上下文1、全局执行上下文- 在执行全局代码前将window 确定为全局执行上下文- 对全局数据进行预处理1)var 定义的全局变量=undefined, 添加为 window 的属性2)function声明的全局函数=赋值 (fun), 添加为 window 的方法3)this= 赋值 (window) 4)开始执行全局代码2、函数执行上下文- 在调用函数 , 准备执行函数体之前, 创建对应的函数执行上下文对象- 对局部数据进行预处理1)形参变量 =赋值 ( 实参 )=添加为执行上下文的属性2)arguments= 赋值 ( 实参列表 ), 添加为执行上下文的属性3)var 定义的局部变量=undefined, 添加为执行上下文的属性4)function声明的函数 = 赋值 (fun), 添加为执行上下文的方法5)this= 赋值 ( 调用函数的对象) 6)开始执行函数体代码执行上下文栈：在全局代码执行前, JS引擎就会创建一个栈来存储管理所有的执行上下文对象。1)在全局执行上下文(window) 确定后 , 将其添加到栈中( 压栈 ) 2)在函数执行上下文创建后, 将其添加到栈中( 压栈 ) 3)在当前函数执行完后, 将栈顶的对象移除( 出栈 ) 4)当所有的代码执行完后, 栈中只剩下window 特点：先进先出3. 变量提升4. This 5. 强制绑定 this指向的方法有哪些？它们有什么区别？6. 什么是闭包？闭包的应用？7. IIFE 是什么？8. 什么是原型？什么是原型链？9. 数组的常用方法？10. 熟悉面向对象吗？能聊聊JS 中继承吗？11. 封装、继承、多态。12. null和 undifinded区别null 表示一个对象是“没有值”的值，也就是值为“空”；undefined 表示一个变量声明了没有初始化( 赋值 ) ；null的类型 (typeof)是 object ；undefined的类型 (typeof)是 undefined ；Javascript将未赋值的变量默认值设为undefined ；Javascript从来不会将变量设为null 。null = undefined / true 由于 undefined衍生自 null null = undefined / false 13. 如何原生区别 function/array/object Typeof 不能 instanceof可以Typeof 返回值有几种： string, number, boolean, undefined,object,function, symbol 14. 严格模式是什么？15. 什么是事件循环机制？16. 数组去重17. 怎么去实现异步？ Promise/generator/async 第四章：原生DOM 1. 用原生 DOM 进行 CRUD 操作（1）创建新节点 createDocumentFragment() /创建一个DOM 片段 createElement() /创建一个具体的元素 createTextNode() /创建一个文本节点（2）添加、移除、替换、插入 appendChild() removeChild() replaceChild() insertBefore() （3）查找 getElementsByTagName() /通过标签名称getElementsByClassName() /通过类名称 getElementsByName() /通过元素的Name属性的值 getElementById() /通过元素Id ，唯一性2. Cookie、session 、localStorage和 sessionStorage之间的区别和联系会话对话cookie 优点： 1. 可以解决 HTTP 无状态的问题，与服务器进行交互缺点： 1.数量和长度限制，每个域名最多20 条，每个 cookie 长度不能超过 4kb 2. 安全性问题。容易被人拦截 3. 浪费带宽，每次请求新页面，cookie都会被发送过去cookie 和 session 区别1.cookie数据存放在客户的浏览器上，session数据放在服务器上。2.session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能。考虑到减轻服务器性能方面，应当使用COOKIE 。sessionStorage是当前对话的缓存，浏览器窗口关闭即消失，localStorage持久存在，除非清除浏览器缓存。3.事件委托第五章： Ajax 1. 原生 ajax 写法？2. 用过什么 ajax 的库？ axios, fetch, fly 3. 怎么解决跨域问题？Cors: res.send(Access-Control-Allow-Origin, “* ”); 4. 前后台之间怎么交互的？5. 接口是什么？怎么对接口？6. 怎么进行模拟数据？7. 前后台分离 8. GET和 POST 的区别1、原理不同：一般我们在浏览器输入一个网址访问网站都是GET请求；在 FORM 表单中，可以通过设置Method 指定提交方式为GET或者 POST提交方式，默认为GET提交方式。HTTP定义了与服务器交互的不同方式，其中最基本的四种：GET ， POST ， PUT ， DELETE ， HEAD ，其中 GET和 HEAD 被称为安全方法，因为使用GET和 HEAD 的 HTTP请求不会产生什么动作。不会产生动作意味着GET和 HEAD 的 HTTP请求不会在服务器上产生任何结果。但是安全方法并不是什么动作都不产生，这里的安全方法仅仅指不会修改信息。根据HTTP规范， POST可能会修改服务器上的资源的请求。2、数据量GET传送的数据量较小，不能大于2KB 。POST传送的数据量较大，一般默认为不受限制。3、安全性、效率传统的比较都是觉得GET安全性非常低，POST安全性较高。因为GET请求的数据会暴露在地址栏中，而POST请求则不会。但是GET的执行效率比POST方法好。通过我们自己做的网站也是可以追踪到，GET提交的数据， 用户名和密码将会明文出现在URL上，这样就给一些人一个机会，当别人拿到你的账号和密码之后后果不堪设想，听到这里突然毛骨悚然，但是又看到下面这样一则故事，顿时觉得这个世界还好第六章：移动端1. 适配方案有哪些？rem 适配viewport适配百分比适配flex在某种场景下也能适配2. css 预编译器介绍一下Less sass stylus 3. 使用 rem适配，设计稿为1080px的移动设备，一般在less 中怎么设置/1rem 转化成多少个px？rem:1080/16rem; 4. 事件点透5. 移动端怎么实现1 物理像素边框6. 2x 图 3x 图怎么实现7. 移动端遇到哪些问题？怎么解决的？第七章：库和框架1. jQuery 和 zepto 的区别和联系2. jQuery 的优点3. Angular ng-model ng-repeat 4. React 和 vue 之间联系和区别相同点：都支持服务端渲染都有Virtual DOM ，组件化开发，通过props参数进行父子组件数据的传递，都实现webComponents规范数据驱动视图都有支持 native的方案， React 的 React native，Vue的 weex 不同点：React 严格上只针对MVC 的 view 层， Vue 则是 MVVM 模式virtual DOM 不一样 vue 会跟踪每一个组件的依赖关系，不需要重新渲染整个组件树。而对于 React 而言， 每当应用的状态被改变时，全部子组件都会重新渲染。当然， 这可以通过 shouldComponentUpdate 这个生命周期方法来进态行控制，组件写法不一样 React 推荐的做法是 JSX + inline style， 也就是把 HTML 和 CSS 全都写进 JavaScript 了，即” all in js ” Vue 推荐的是使用 webpack + vue-loader 的单文件组件格式，即html,css,js写在同一个文件；数据绑定： Vue有实现了双向数据绑定，React 数据流动是单向的state对象在 react应用中是不可变的，需要使用setState方法更新状；在Vue 中，state对象并不是必须的，数据由data 属性在 Vue对象中进行管理。1、Angular/react/vue 理解 / 比较差异 / 虚拟 DOM / 组件间通信 / react、vue 的生命周期函数2、React react 的 state 和 prop / 组件化好处 / 封装组件时注意事项 / 开发遇见的问题 / key 模块化有哪些 / 什么是模块化、组件化、工程化3、工程化工程化有哪些 / 怎么进行项目构建4、其他性能优化 / 缓存 / 页面重构怎么操作5、扩展性问题公司人员概况 / 任务分配情况 / 对上家公司的看法 / 为什么从上家公司离职 / 压工资 / 自我评价 / 如何快速融入一个团队 / 未来规划 / 对加班的看法