web前端面试题及答案 JavaScript篇 谁践踏了优雅 2022-08-21 13:40 138阅读 0赞 **1.null和undefined的区别？** 1，null是一个表示”无”的对象，转为数值时为0；undefined是一个表示”无”的原始值，转为数值时为NaN。 2，null用来表示尚未存在的对象，常用来表示函数企图返回一个不存在的对象；当声明的变量还未被初始化时，变量的默认值为undefined。 3，undefined表示”缺少值”，就是此处应该有一个值，但是还没有定义。典型用法是： > ①变量被声明了，但没有赋值时，就等于undefined。 > ②调用函数时，应该提供的参数没有提供，该参数等于undefined。 > ③对象没有赋值的属性，该属性的值为undefined。 > ④函数没有返回值时，默认返回undefined。 4，null表示”没有对象”，即该处不应该有值。典型用法是： > ①作为函数的参数，表示该函数的参数不是对象。 > ②作为对象原型链的终点。 **2.new操作符具体干了什么呢?** > 1，创建一个空对象，并且 this 变量引用该对象，同时还继承了该函数的原型。 > 2，属性和方法被加入到 this 引用的对象中。 > 3，新创建的对象由 this 所引用，并且最后隐式的返回 this 。 1.obj = {}; obj.__proto__ = Base.prototype; Base.call(obj); 2.obj = {}; 3.__ proto__ = Base.prototype; Base.call (obj); **3.js延迟加载的方式有哪些？** > defer和async、动态创建DOM方式（创建script，插入到DOM中，加载完毕后callBack）、按需异步载入js; **4.如何解决跨域问题?** > jsonp、 document.domain+iframe、window.name、window.postMessage、服务器上设置代理页面; > jsonp的原理是动态插入script标签; **5.documen.write和 innerHTML的区别?** > 1，document.write只能重绘整个页面; > 2，innerHTML可以重绘页面的一部分； **6.call() 和 .apply() 的区别和作用？** > 动态改变某个类的某个方法的运行环境。 > 1，方法的定义 > call方法: > 语法：call(thisObj，Object) > 定义：调用一个对象的一个方法，以另一个对象替换当前对象。 > 说明： > call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 > 如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。 > apply方法： > 语法：apply(thisObj，\[argArray\]) > 定义：应用某一对象的一个方法，用另一个对象替换当前对象。 > 说明： > 如果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。 > 如果没有提供 argArray 和 thisObj 任何一个参数，那么 Global 对象将被用作 thisObj， 并且无法被传递任何参数。 > 2， 模拟call, apply的this替换 > function Animal(name) \{ > this.name = name; > this.showName = function() \{ > alert(this.name); > \}; > \}; > function Cat(name) \{ > this.superClass = Animal; > this.superClass(name); > delete superClass; > \} > var cat = new Cat(“Black Cat”); > cat.showName(); **7.哪些操作会造成内存泄漏？** > 1，内存泄漏指任何对象在您不再拥有或需要它之后仍然存在。 > 2，垃圾回收器定期扫描对象，并计算引用了每个对象的其他对象的数量。如果一个对象的引用数量为 0（没有其他对象引用过该对象），或对该对象的惟一引用是循环的，那么该对象的内存即可回收。 > 3，setTimeout 的第一个参数使用字符串而非函数的话，会引发内存泄漏。 > 4，闭包、控制台日志、循环（在两个对象彼此引用且彼此保留时，就会产生一个循环）。 **8.你遇到过比较难的技术问题是？你是如何解决的？列举IE 与其他浏览器不一样的特性？什么叫优雅降级和渐进增强？** > 1，优雅降级：Web站点在所有新式浏览器中都能正常工作，如果用户使用的是老式浏览器，则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题，针对不同版本的IE的hack实践过优雅降级了,为那些无法支持功能的浏览器增加候选方案，使之在旧式浏览器上以某种形式降级体验却不至于完全失效。 > 2，渐进增强：从被所有浏览器支持的基本功能开始，逐步地添加那些只有新式浏览器才支持的功能,向页面增加无害于基础浏览器的额外样式和功能的。当浏览器支持时，它们会自动地呈现出来并发挥作用。 **9.WEB应用从服务器主动推送Data到客户端有那些方式？** > Javascript数据推送 > 1，Commet：基于HTTP长连接的服务器推送技术。 > 2，基于WebSocket的推送方案。 > 3，SSE（Server-Send Event）：服务器推送数据新方式。 **10.对前端界面工程师这个职位是怎么样理解的？它的前景会怎么样？** > 1， 前端是最贴近用户的程序员，比后端、数据库、产品经理、运营、安全都近。 > ①实现界面交互； > ②提升用户体验； > ③有了Node.js，前端可以实现服务端的一些事情； > 2，前端是最贴近用户的程序员，前端的能力就是能让产品从 90分进化到 100 分，甚至更好； > 3，参与项目，快速高质量完成实现效果图，精确到1px； > 4，与团队成员，UI设计，产品经理的沟通； > 5，做好的页面结构，页面重构和用户体验； > 6，处理hack，兼容、写出优美的代码格式； > 7，针对服务器的优化、拥抱最新前端技术。 **11.你有哪些性能优化的方法？** > 1，减少http请求次数：CSS Sprites, JS、CSS源码压缩、图片大小控制合适；网页Gzip，CDN托管，data缓存 ，图片服务器。 > 2，前端模板 JS+数据，减少由于HTML标签导致的带宽浪费，前端用变量保存AJAX请求结果，每次操作本地变量，不用请求，减少请求次数。 > 3， 用innerHTML代替DOM操作，减少DOM操作次数，优化javascript性能。 > 4，当需要设置的样式很多时设置className而不是直接操作style。 > 5，少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。 > 6，避免使用CSS Expression（css表达式)又称Dynamic properties(动态属性)。 > 7，图片预加载，将样式表放在顶部，将脚本放在底部 加上时间戳。 **12.一个页面从输入 URL 到页面加载显示完成，这个过程中都发生了什么？** > 分为4个步骤： > （1），当发送一个URL请求时，不管这个URL是Web页面的URL还是Web页面上每个资源的URL，浏览器都会开启一个线程来处理这个请求，同时在远程DNS服务器上启动一个DNS查询。这能使浏览器获得请求对应的IP地址。 > （2）， 浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/IP连接。该握手包括一个同步报文，一个同步-应答报文和一个应答报文，这三个报文在 > 浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信，而后服务器应答并接受客户端的请求，最后由客户端发出该请求已经被接受的报文。 > （3），一旦TCP/IP连接建立，浏览器会通过该连接向远程服务器发送HTTP的GET请求。远程服务器找到资源并使用HTTP响应返回该资源，值为200的HTTP响应状态表示一个正确的响应。 > （4），此时，Web服务器提供资源服务，客户端开始下载资源。 > 请求返回后，便进入了我们关注的前端模块； > 简单来说，浏览器会解析HTML生成DOM Tree，其次会根据CSS生成CSS Rule Tree，而javascript又可以根据DOM API操作DOM； **13.javascript对象的几种创建方式？** > 1，工厂模式 ； > 2，构造函数模式 ； > 3，原型模式 ； > 4，混合构造函数和原型模式 ； > 5，动态原型模式 ； > 6，寄生构造函数模式 ； > 7，稳妥构造函数模式。 **14.javascript继承的6种方法？** > 1，原型链继承 ； > 2，借用构造函数继承； > 3，组合继承(原型+借用构造) ； > 4，原型式继承 ； > 5，寄生式继承； > 6，寄生组合式继承。 **15.ajax过程？** > 1，创建XMLHttpRequest对象,也就是创建一个异步调用对象； > 2，创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息； > 3，设置响应HTTP请求状态变化的函数； > 4，发送HTTP请求； > 5，获取异步调用返回的数据； > 6，使用JavaScript和DOM实现局部刷新； **16.异步加载和延迟加载？** > 1，异步加载的方案： 动态插入script标签； > 2，通过ajax去获取js代码，然后通过eval执行； > 3，script标签上添加defer或者async属性； > 4，创建并插入iframe，让它异步执行js； > 5，延迟加载：有些 js 代码并不是页面初始化的时候就立刻需要的，而稍后的某些情况才需要的。
还没有评论，来说两句吧...