logo资料库

2018最新Java面试宝典+答案.pdf

第1页 / 共36页
第2页 / 共36页
第3页 / 共36页
第4页 / 共36页
第5页 / 共36页
第6页 / 共36页
第7页 / 共36页
第8页 / 共36页
资料共36页,剩余部分请下载后查看
1.一些 开放 性题目 1. 自我介绍:除了基本个人信息以外,面试官更想听的是你与众不同的地方和你的优势。 2. 项目介绍 3. 如何看待前端开发? 4. 平时是如何学习前端开发的? 5. 未来三到五年的规划是怎样的? position 的 值, relative 和absolute 分别 是相 对于谁 进行定位的? absolute :生成绝对定位的元素, 相对于最近一级的 定位不是 static 的父元素来进行定位。 fixed (老 IE不支持)生成绝对定位的元素,通常相对于浏览器窗口或 relative 生成相对定位的元素,相对于其在普通流中的位置进行定位。 frame 进行定位。 static 默认值。没有定位,元素出现在正常的流中 sticky 生成粘性定位的元素,容器的位置根据正常文档流计算得出 如何 解决跨 域问题 JSONP: 原理是:动态插入 script 标签,通过 script 标签引入一个 js 文件,这个 js 文件载入成功后会执行我们在 url 参数 中指定的函数,并且会把我们需要的 json 数据作为参数传入。 由于同源策略的限制, XmlHttpRequest 只允许请求当前源(域名、协议、端口)的资源,为了实现跨域请求,可 JSON数据并执行回调函数,从而解决了跨域的数据请求。 以通过 script 标签实现跨域请求,然后在服务端输出 优点是兼容性好,简单易用,支持浏览器与服务器双向通信。缺点是只支持 GET请求。 JSONP : json+padding (内填充),顾名思义,就是把 JSON填充到一个盒子里
12345678910111213141516171819 CORS 服务器端对于 CORS的支持,主要就是通过设置 Access‐Control ‐Allow ‐Origin 来进行的。如果浏览器检测到相应 的设置,就可以允许 Ajax 进行跨域的访问。 通过修改 document.domain 来跨子域 将子域和主域的 document.domain 设为同一个主域 .前提条件:这两个域名必须属于同一个基础域名 议,端口都要一致,否则无法利用 document.domain 进行跨域 !而且所用的协 主域相同的使用 document.domain 使用 window.name 来进行跨域 window 对象有个 name 属性,该属性有个特征:即在一个窗口 (window) 的生命周期内 ,窗口载入的所有的页面都是 共享一个 window.name 的,每个页面对 window.name 都有读写的权限, window.name 是持久存在一个窗口载入过 的所有页面中的 使用 HTML5 中新引进的 window.postMessage 方法来跨域传送数据 还有 ?ash 、在服务器上设置代理页面等跨域方式。个人认为 window.name 的方法既不复杂,也能兼容到几乎所有浏 览器,这真是极好的一种跨域方法。 XML和 JSON的区 别?
(1). 数据体积方面。 JSON相对于 XML来讲,数据的体积小,传递的速度更快些。 (2). 数据交互方面。 JSON与JavaScript 的交互更加方便,更容易解析处理,更好的数据交互。 (3). 数据描述方面。 JSON对数据的描述性比 XML较差。 (4). 传输速度方面。 JSON的速度要远远快于 XML。123456789101112131415 谈谈 你对webpack 的看法 WebPack 是一个模块打包工具,你可以使用 能够很好地管理、打包 Web 开发中所用到的 HTML、JavaScript 、CSS 以及各种静态文件(图片、字体等),让开发 WebPack 管理你的模块依赖,并编绎输出模块们所需的静态文件。它 过程更加高效。对于不同类型的资源, 系,最后 生成了优化且合并后的静态资源。 webpack 有对应的模块加载器。 webpack 模块打包器会分析模块间的依赖关 webpack 的两大特色: 1.code splitting (可以自动完成) 2.loader 可以处理各种类型的静态文件,并且支持串联操作 webpack 是以 commonJS 的形式来书写脚本滴,但对 AMD/CMD 的支持也很全面,方便旧项目进行代码迁移。 webpack 具有 requireJs 和 browserify 的功能,但仍有很多自己的新特性: 1. 对 CommonJS 、 AMD 、ES6的语法做了兼容 2. 对js 、 css 、图片等资源文件都支持打包 3. 串联式模块加载器以及插件机制,让其具有更好的灵活性和扩展性,例如提供对 CoffeeScript 、ES6的支持 4. 有独立的配置文件 webpack.config.js 5. 可以将代码切割成不同的 chunk ,实现按需加载,降低了初始化时间 6. 支持 SourceUrls 和 SourceMaps ,易于调试 7. 具有强大的 Plugin 接口,大多是内部插件,使用起来比较灵活 8.webpack 使用异步 IO 并具有多级缓存。这使得 webpack 很快且在增量编译上更加快 123456789101112131415 说说 TCP传 输的三 次握手 四次挥 手策略
为了准确无误地把数据送达目标处, 送 后的情况置之不理,它一定会向对方确认是否成功送达。握手过程中使用了 TCP 协议采用了三次握手策略。用 TCP协议把数据包送出去后, TCP 不会对传 TCP的标志: SYN 和 ACK 。 发送端首先发送一个带 SYN 标志的数据包给对方。接收端收到后,回传一个带有 SYN/ACK 标志的数据包以示传达确 认信息。 最后,发送端再回传一个带 ACK 标志的数据包,代表 “握手 ”结束。 若在握手过程中某个阶段莫名中断, TCP 协议会再次以相同的顺序发送相同的数据包。 断开一个 TCP连接则需要 “四次握手 ”: FIN ,用来关闭主动方到被动关闭方的数据传送,也就是主动关闭方告诉被 第一次挥手:主动关闭方发送一个 动关闭方:我已经不 会再给你发数据了 (当然,在 ?n 包之前发送出去的数据,如果没有收到对应的 文,主动关闭方依然会重发这些数据 ),但是,此时主动关闭方还可 以接受数据。 第二次挥手:被动关闭方收到 FIN 包后,发送一个 ACK 给对方,确认序号为收到序号 个 FIN 占用一个序号)。 +1 (与 SYN 相同,一 ack 确认报 第三次挥手:被动关闭方发送一个 方,我的数据也发送完了,不会再给你发数据了。 第四次挥手:主动关闭方收到 FIN 后,发送一个 ACK给被动关闭方,确认序号为收到序号 次挥手。 FIN ,用来关闭被动关闭方到主动关闭方的数据传送,也就是告诉主动关闭 +1,至此,完成四 TCP和 UDP 的区别 TCP (Transmission Control Protocol 和对方建立可靠的连接。一个 TCP 连接必须要经过三次 “对话 ”才能建立起来 ,传输控制协议)是基于连接的协议,也就是说,在正式收发数据前,必须 UDP (User Data Protocol ,用户数据报协议)是与 TCP相对应的协议。它是面向非连接的协议,它不与对方建立 连接,而是直接就把数据包发送过去! UDP 适用于一次只传送少量数据、对可靠性要求不高的应用环境。 说说 你对作 用域链 的理解 作用域链的作用是保证执行环境里有权访问的变量和函数是有序的,作用域链的变量只能向上访问,变量访问 到 window 对象即被终止,作用域链向下访问变量是不被允许的。 创建 ajax 过 程 (1) 创建 XMLHttpRequest 对象 , 也就是创建一个异步调用对象 . (2) 创建一个新的 HTTP请求, 并指定该 HTTP请求的方法、 URL及验证信息 . (3) 设置响应 HTTP请求状态变化的函数 . (4) 发送 HTTP请求 . (5) 获取异步调用返回的数据 . (6) 使用 JavaScript 和DOM实现局部刷新 .1234567891011 渐进 增强和 优雅降 级 渐进增强 :针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和 追加功能达到更好的用户体验。
优雅降级 :一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。 常见 web 安 全及 防护原 理 sql 注入原理 就是通过把 SQL命令插入到 Web 表单递交或输入域名或页面请求的查询字符串,最终达到欺骗服务器执行恶意的 SQL命令。 总的来说有以下几点: 1. 永远不要信任用户的输入,要对用户的输入进行校验,可以通过正则表达式,或限制长度,对单引号和双 换等。 " ‐"进行转 2. 永远不要使用动态拼装 SQL,可以使用参数化的 SQL或者直接使用存储过程进行数据查询存取。 3. 永远不要使用管理员权限的数据库连接,为每个应用使用单独的权限有限的数据库连接。 4. 不要把机密信息明文存放,请加密或者 hash 掉密码和敏感的信息。 12345678 XSS原理及防范 Xss(cross-site scripting) 攻击指的是攻击者往 Web 页面里插入恶意 html 标签或者 JavaScript 代码。比如:攻击者 在论坛中放一个 看似安全的链接,骗取用户点击后,窃取 cookie 中的用户私密信息;或者攻击者在论坛中加一个恶意表单, 当用户提交表单的时候,却把信息传送到攻击者的服务器中,而不是用户原本以为的信任站点。 XSS防范方法 首先代码里对用户输入的地方和变量都需要仔细检查长度和对 页面之前都必须加以 encode ,避免不小心把 html tag 弄出来。这一个层面做好,至少可以堵住超过一半的 攻击。 ”<”, ”>”, ”; ”, ”’”等字符做过滤;其次任何内容写到 XSS 首先,避免直接在 cookie 中泄露用户隐私,例如 email 、密码等等。 其次,通过使 cookie 和系统 ip 绑定来降低 cookie 泄露后的危险。这样攻击者得到的 不可能拿来重放。 cookie 没有实际价值, 如果网站不需要再浏览器端对 码直接获取 cookie 。 cookie 进行操作,可以在 Set‐Cookie 末尾加上 HttpOnly 来防止 javascript 代 尽量采用 POST 而非 GET 提交表单 XSS与CSRF有什么区别吗? XSS 是获取信息,不需要提前知道其他用户页面的代码和数据包。 他用户页面的代码和数据包。 CSRF是代替用户完成指定的动作,需要知道其 要完成一次 CSRF攻击,受害者必须依次完成两个步骤: 登录受信任网站 A,并在本地生成 Cookie 。 在不登出 A的情况下,访问危险网站 B。123
CSRF的防御 服务端的 CSRF方式方法很多样,但总的思想都是一致的,就是在客户端页面增加伪随机数。 通过验证码的方法 Web Worker 和 webSocket worker 主线程 : 1. 通过 worker = new Worker( url ) 加载一个 JS文件来创建一个 worker ,同时返回一个 worker 实例。 2. 通过 worker.postMessage( data ) 方法来向 worker 发送数据。 3. 绑定 worker.onmessage 方法来接收 worker 发送过来的数据。 4. 可以使用 worker.terminate() 来终止一个 worker 的执行。 1234567 WebSocket 是 Web 应用程序的传输协议,它提供了双向的,按序到达的数据流。他是一个 议, WebSocket 的连接是持久的,他通过在客户端和服务器之间保持双工连接,服务器的更新可以被及时推送给客 Html5 协 户端,而不需要客户端以一定时间间隔去轮询。 HTTP 和HTTPS HTTP 协议通常承载于 TCP协议之上,在 HTTP 和 TCP 之间添加一个安全协议层( SSL 或 TSL ),这个时候,就成 了我们常说的 HTTPS 。 默认 HTTP 的端口号为 80 , HTTPS 的端口号为 443 。 为什么 HTTPS安全 因为网络请求需要中间有很多的服务器路由器的转发。中间的节点都可能篡改信息,而如果使用 和终点站才有。 https 之所以比 http 安全,是因为他利用 ssl/tls 协议传输。它包含证书,卸载,流量转发,负 载均衡,页面适配,浏览器适配, refer 传递等。保障了传输过程的安全性 HTTPS ,密钥在你 对前 端模块 化的认识 AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。 CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。 CommonJS的风格通过对 module.exports 或 exports 的属性赋 AMD 是提前执行, CMD 是延迟执行。 AMD推荐的风格通过返回一个对象做为模块对象, 值来达到暴露模块对象的目的。 CMD 模块方式 define(function(require, exports, module) { // 模块代码 });12345 Javascript 垃圾回 收方法
标记清除( mark and sweep ) 这是 JavaScript 最常见的垃圾回收方式,当变量进入执行环境的时候,比如函数中声明一个变量,垃圾回收器将其标 记为 “进入环境 ”,当变量离开环境的时候(函数执行结束)将其标记为 “离开环境 ”。 垃圾回收器会在运行的时候给存储在内存中的所有变量加上标记,然后去掉环境中的变量以及被环境中变量所引用 的变量(闭包),在这些完成之后仍存在标记的就是要删除的变量了 引用计数 (reference counting) 在低版本 IE中经常会出现内存泄露,很多时候就是因为其采用引用计数方式进行垃圾回收。引用计数的策略是跟踪 记录每个值被使用的次数,当声明了一个 果该变量的值变成了另外一个,则这个值得引用次数减 1,当这个值的引用次数变为 0的时 候,说明没有变量在使 变量并将一个引用类型赋值给该变量的时候这个值的引用次数就加 1 ,如 用,这个值没法被访问了,因此可以将其占用的空间回收,这样垃圾回收器会在运行的时候清理掉引用次数为 占用的空间。 0的值 在IE中虽然 JavaScript 对象通过标记清除的方式进行垃圾回收,但 的, 也就是说只要涉及 BOM及DOM 就会出现循环引用问题。 BOM 与 DOM 对象却是通过引用计数回收垃圾 你觉 得前端 工程的 价值体现在哪 为简化用户使用提供技术支持(交互部分) 为多个浏览器兼容性提供支持 为提高用户浏览速度(浏览器性能)提供支持 为跨平台或者其他基于 webkit 或其他渲染引擎的应用提供支持 为展示数据提供支持(数据接口) 谈谈 性能优 化问题 代码层面:避免使用 css表达式,避免使用高级选择器,通配选择器。 缓存利用:缓存 Ajax ,使用 CDN ,使用外部 js 和css 文件以便缓存,添加 Expires 头,服务端配置 Etag ,减少 DNS 查 找等 请求数量:合并样式和脚本,使用 css 图片精灵,初始首屏之外的图片资源按需加载,静态资源延迟加载。 请求带宽:压缩文件,开启 GZIP, 代码层面的优化 用 hash‐table 来优化查找 少用全局变量 用 innerHTML 代替 DOM操作,减少 DOM操作次数,优化 javascript 用 setTimeout 来避免页面失去响应 缓存 DOM 节点查找的结果 避免使用 CSS Expression 避免全局查询 避免使用 with(with 会创建自己的作用域,会增加作用域链长度 ) 多个变量声明合并 性能
避免图片和 iFrame 等的空 Src 。空 Src 会重新加载当前页面,影响速度和效率 尽量避免写在 HTML 标签中写 Style 属性 移动 端性能 优化 尽量使用 css3 动画,开启硬件加速。 适当使用 touch 事件代替 click 事件。 避免使用 css3 渐变阴影效果。 可以用 transform: translateZ(0) 不滥用 Float 。Float 在渲染时计算量比较大,尽量减少使用 不滥用 Web 字体。 Web 字体需要下载,解析,重绘当前页面,尽量减少使用。 合理使用 requestAnimationFrame CSS中的属性( CSS3 transitions 、CSS3 3D transforms 、 Opacity 、 Canvas 、WebGL 、 Video )会触发 GPU 渲染,请合理使用。过渡使用会引发手机过耗电增加 动画代替 setTimeout 来开启硬件加速。 PC端的在移动端同样适用 相关阅读: 如何做到一秒渲染一个移动页面 什么 是Etag ? 当发送一个服务器请求时,浏览器首先会进行缓存过期判断。浏览器根据缓存过期时间判断缓存文件是否过期。 情景一:若没有过期,则不向服务器发送请求,直接使用缓存中的结果,此时我们在浏览器控制台中可以看到 200 OK (from cache) ,此时的情况就是完全使用缓存,浏览器和服务器没有任何交互的。 情景二:若已过期,则向服务器发送请求,此时请求中会带上①中设置的文件修改时间,和 Etag 然后,进行资源更新判断。服务器根据浏览器传过来的文件修改时间,判断自浏览器上一次请求之后,文件是不是 没有被修改过;根据 Etag ,判断文件内容自上一次请求之后,有没有发生变化 情形一:若两种判断的结论都是文件没有被修改过,则服务器就不给浏览器发 index.html 的内容了,直接告诉 它,文件没有被修改过,你用你那边的缓存吧 —— 304 Not Modified ,此时浏览器就会从本地缓存中获取 index.html 的内容。此时的情况叫协议缓存,浏览器和服务器之间有一次请求交互。 情形二:若修改时间和文件内容判断有任意一个没有通过,则服务器会受理此次请求,之后的操作同① ① 只有 get 请求会被缓存, post 请求不会 Expires 和Cache-Control Expires 要求客户端和服务端的时钟严格同步。 age 和 Expires 同时出现,则 max-age 有更高的优先级。 HTTP1.1 引入 Cache ‐ Control 来克服 Expires 头的限制。如果 max- Cache ‐ Control: no ‐ cache, private, max ‐ age=0 ETag: abcde Expires: Thu, 15 Apr 2014 20:00:00 GMT Pragma: private Last ‐ Modified: $now // RFC1123 format123456789 ETag应用 :
分享到:
收藏