面试题整理学习

太过爱你忘了你带给我的痛 2022-07-16 12:59 159阅读 0赞

最近在看面试题，然后对别人网上提出的面试题做个自问自答吧，算是学习啦

1.  描述下渐进增强和优雅降级的不同

我觉得这个渐进增强和优雅降级其实就是不同的两种妥协，这种妥协是对旧版浏览器的妥协，专业点吧

优雅降级就是我一开始构建站点的完整功能，然后针对浏览器测试和修复。web站点在所有新式浏览器中都能正常工作，如果用户使用的是老式浏览器，工程师会为那些无法支持所有功能的浏览器增加候选方案，使之在旧式浏览器上一某种形式降级体验但是却不至于失效。

渐进增强是从浏览器支持的基本功能开始，逐步添加那些只有新式浏览器才支持的功能

*  区别:
    
     *  “优雅降级”观点认为应该针对那些最高级、最完善的浏览器来设计网站. 而将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段，并把测试对象限定为主流浏览器（如 IE、Mozilla 等）的前一个版本。
     *  “渐进增强”观点则认为应关注于内容本身。
 *  理解:
    
     *  "优雅降级"就是首先完整地实现整个网站,包括其中的功能和效果. 然后再为那些无法支持所有功能的浏览器增加候选方案, 使之在旧式浏览器上以某种形式降级体验却不至于完全失效.
     *  "渐进增强"则是从浏览器支持的基本功能开始, 首先为所有设备准备好清晰且语义化的html及完整内容, 然后再以无侵入的方法向页面增加无害于基础浏览器的额外样式和功能. 当浏览器升级时, 它们会自动呈现并发挥作用.

2.浏览器的结构

*  用户界面（UI）-包括菜单栏，工具栏，地址栏，回退前进按钮，即主窗口之外的部分
 *  浏览器引擎 即我们所说的浏览器内核，渲染引擎，主要作用为负责取得页面内容，整理css信息，计算页面的显示方式，然后输出到显示器
 *  js解释器  也可以成为js内核，主要负责处理js脚本，
 *  网络部分  主要是网络调用，http请求，为所有平台提供底层实现
 *  UI后端  用户绘制基本的窗口部件，
 *  数据存储  保存类似于cookie/storage等数据部分

1.  1.  1.  [你能描述一下渐进增强和优雅降级之间的不同吗][Link 1]
        2.  [浏览器兼容问题][Link 2]
        3.  [如何对网站的文件和资源进行优化?][Link 3]
        4.  [怎么学习前端?怎么接触前端新知识?][Link 4]
        5.  [关于前后端分离][Link 5]
        6.  [关于浏览器内核(渲染引擎)][Link 6]
        7.  [浏览器加载文件顺序以及repaint/reflow][repaint_reflow]
        8.  [为什么使用多个域名来存储网络资源会更有效？][Link 7]
        9.  [进程和线程的区别][Link 8]
        10. [前端开发的优化问题][Link 9]
        11. [Flash，Ajax各自的优缺点，使用中如何取舍？][Flash_Ajax]
    2.  CSS
        
        1.  [CSS3][]
        2.  [css居中的方式][css]
        3.  [请写一个简单的幻灯效果页面][css]
        4.  [什么是无样式内容闪烁?如何避免?][Link 10]
        5.  [display:none和visibility:hidden的区别][display_none_visibility_hidden]
        6.  [解释浮动和工作原理][Link 11]
        7.  [清除浮动][Link 12]
        8.  [解释CSS Sprits,以及你要如何使用?][CSS Sprits]
        9.  [你最喜欢的图片替换方法是什么?你将如何使用?][Link 13]
        10. [讨论CSS hacks, 条件引用或其他][CSS hacks_]
        11. [如何为有功能限制的浏览器提供网页][Link 14]
        12. [在书写高效CSS时会有哪些问题需要考虑?][CSS]
        13. [如何优化网页的打印样式?][Link 15]
        14. [描述下你曾经使用过的CSS 预处理的优缺点][Link 15]
        15. [如果设计中使用了非标准的字体, 你将如何实现?][Link 16]
        16. [解释下浏览器是如何判断元素是否匹配某个 CSS 选择器？][CSS 1]
        17. [解释一下你对盒模型的理解，以及如何在 CSS 中告诉浏览器使用不同的盒模型来渲染你的布局。][CSS 2]
        18. [伪类的用法][Link 17]：
        19. [描述下"reset"css文件的作用和使用它的好处][Link 17]
        20. [请解释一下 \* \{ box-sizing: border-box; \} 的作用, 并且说明使用它有什么好处？][_ box-sizing_ border-box_ _]
        21. [block, inline和inline-block的区别][block_ inline_inline-block]
        22. [css动画和js动画的优缺点][css_js]
        23. [你用过媒体查询，或针对移动端的布局/CSS 吗？][CSS 3]
        24. [有哪些隐藏内容的方法(同时还要保证屏幕阅读器可用)][Link 18]
        25. [CSS选择器级别][CSS 4]
        26. [alt和title的区别][alt_title]
        27. [知道bfc吗?][bfc]
        28. [行内元素，块级元素，空元素各有哪些？][Link 19]
    3.  [html][Link 19]
        
        1.  [h5的改进:][Link 19]
        2.  [什么是语义化的html?][Link 19]
        3.  [从前端角度出发谈谈做好seo应该注意什么?][Link 19]
        4.  [文档类型(DOCTYPE)][Link 19]
        5.  [使用XHTML的局限有哪些?][Link 19]
        6.  [如果网页内容需要多语言,要怎么做?][Link 19]
        7.  [data-\*属性的作用][Link 19]
        8.  [如果把 HTML5 看作做一个开放平台，那它的构建模块有哪些？][Link 19]
        9.  [请描述一下 cookies，sessionStorage 和 localStorage 的区别？][Link 19]
        10. [浏览器本地存储与服务器端存储之间的区别][Link 19]
        11. [sessionStorage和页面js数据对象的区别][Link 19]
        12. [canvas和svg的区别?][Link 19]
        13. [href和src的区别][Link 19]
    4.  [js][]
        
        1.  [ajax, 跨域, jsonp][ajax_ _ jsonp]
        2.  [apply和call的用法和区别:][apply_call]
        3.  [bind函数的兼容性][bind]
        4.  [解释下事件代理][Link 20]
        5.  [解释下js中this是怎么工作的?][js_this]
        6.  [继承][Link 21]
        7.  [AMD vs. CommonJS？][AMD vs. CommonJS]
        8.  [什么是哈希表?][Link 22]
        9.  [什么是闭包? 闭包有什么作用?][Link 23]
        10. [伪数组:][Link 24]
        11. [undefined和null的区别, 还有undeclared:][undefined_null_ _undeclared]
        12. [事件冒泡机制:][Link 25]　　
        13. [解释下为什么接下来这段代码不是 IIFE(立即调用的函数表达式)：function foo()\{ \}();?][IIFE_function foo_]
        14. ["attribute" 和 "property" 的区别是什么？][attribute_ _ _property_]
        15. [请指出 document load 和 document ready 两个事件的区别。][document load _ document ready]
        16. [什么是use strict? 其好处坏处分别是什么?][use strict_]
        17. [浏览器端的js包括哪几个部分?][js 1]
        18. [DOM包括哪些对象?][DOM]
        19. [js有哪些基本类型?][js 2]
        20. [基本类型与引用类型有什么区别?][Link 26]
        21. [关于js的垃圾收集例程][js 3]
        22. [ES5中, 除了函数,什么能够产生作用域?][ES5_]
        23. [js有几种函数调用方式?][js 4]
        24. [描述事件模型?IE的事件模型是怎样的？事件代理是什么？事件代理中怎么定位实际事件产生的目标？][IE]
        25. [js动画有哪些实现方法?][js 5]
        26. [还有什么实现动画的方法?][Link 27]
        27. [面向对象有哪几个特点? ][Link 28]
        28. [如何判断属性来自自身对象还是原型链?][Link 29]
        29. [ES6新特性][ES6]
        30. [如何获取某个DOM节点，节点遍历方式][DOM 1]
        31. [用LESS如何给某些属性加浏览器前缀？][LESS]
        32. [js异步模式如何实现？][js 6]
        33. [事件机制，如何绑定事件处理函数][Link 30]
        34. [图片预加载][Link 31]
        35. [如果在同一个元素上绑定了两个click事件, 一个在捕获阶段执行, 一个在冒泡阶段执行. 那么当触发click条件时, 会执行几个事件? 执行顺序是什么?][click_ _ _. _click_ _]
        36. [js中怎么实现块级作用域?][js 7]
        37. [构造函数里定义function和使用prototype.func的区别？][function_prototype.func]
        38. [js实现对象的深克隆][js 8]
    5.  jquery问题
    6.  一些编程题
        
        1.  匿名函数变量
        2.  this指向
        3.  定时
        4.  [点击一个ul的五个li元素，分别弹出他们的序号，怎么做？][ul_li]
    7.  js算法题
        
        1.  [ js实现数组去重怎么实现?][js 9]
        2.

[Link 1]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_1
[Link 2]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_2
[Link 3]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_3
[Link 4]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_4
[Link 5]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_5
[Link 6]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_6
[repaint_reflow]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_7
[Link 7]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_8
[Link 8]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_9
[Link 9]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_10
[Flash_Ajax]: http://www.cnblogs.com/haoyijing/p/5789348.html#z1_11
[CSS3]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_1
[css]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_3
[Link 10]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_4
[display_none_visibility_hidden]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_5
[Link 11]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_6
[Link 12]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_7
[CSS Sprits]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_8
[Link 13]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_9
[CSS hacks_]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_10
[Link 14]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_11
[CSS]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_12
[Link 15]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_13
[Link 16]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_14
[CSS 1]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_16
[CSS 2]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_17
[Link 17]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_18
[_ box-sizing_ border-box_ _]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_20
[block_ inline_inline-block]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_21
[css_js]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_22
[CSS 3]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_23
[Link 18]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_24
[CSS 4]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_25
[alt_title]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_26
[bfc]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_27
[Link 19]: http://www.cnblogs.com/haoyijing/p/5789348.html#z2_28
[js]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4
[ajax_ _ jsonp]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_1
[apply_call]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_2
[bind]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_3
[Link 20]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_4
[js_this]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_5
[Link 21]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_6
[AMD vs. CommonJS]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_7
[Link 22]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_8
[Link 23]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_9
[Link 24]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_10
[undefined_null_ _undeclared]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_11
[Link 25]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_12
[IIFE_function foo_]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_13
[attribute_ _ _property_]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_14
[document load _ document ready]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_15
[use strict_]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_16
[js 1]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_17
[DOM]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_18
[js 2]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_19
[Link 26]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_20
[js 3]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_21
[ES5_]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_22
[js 4]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_23
[IE]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_24
[js 5]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_25
[Link 27]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_26
[Link 28]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_27
[Link 29]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_28
[ES6]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_29
[DOM 1]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_30
[LESS]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_31
[js 6]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_32
[Link 30]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_33
[Link 31]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_34
[click_ _ _. _click_ _]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_35
[js 7]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_36
[function_prototype.func]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_37
[js 8]: http://www.cnblogs.com/haoyijing/p/5789348.html#z4_38
[ul_li]: http://www.cnblogs.com/haoyijing/p/5789348.html#z7_4
[js 9]: http://www.cnblogs.com/haoyijing/p/5789348.html#z8_1