web前端面试题（Web前端岗位面试题有哪些）

本文目录

• Web前端岗位面试题有哪些
• Web前端5道面试题
• web前端 面试必问的几个问题有那些
• 2020年Web前端面试题汇总（一）
• Web前端企业面试题
• 经典的 Web 前端或者 JavaScript 面试笔试题有哪些
• 前端面试会提问到哪些
• 常见的web前端面试题及答案分享
• web前端面试经常问到的面试题有哪些
• 高级前端面试题目大全（三）

Web前端岗位面试题有哪些

前端面试题汇总，基本上会有四大类问题，具体如下：
一、HTML
1、Doctype作用？严格模式与混杂模式如何区分？它们有何意义?
2、HTML5 为什么只需要写 《!DOCTYPE HTML》？
3、行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
4、页面导入样式时，使用link和@import有什么区别？
5、介绍一下你对浏览器内核的理解？
6、常见的浏览器内核有哪些？
7、html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
8、简述一下你对HTML语义化的理解？
9、HTML5的离线储存怎么使用，工作原理能不能解释一下？
10、浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢？
11、请描述一下 cookies，sessionStorage 和 localStorage 的区别？
12、iframe有那些缺点？
13、Label的作用是什么？是怎么用的？（加 for 或 包裹）
14、HTML5的form如何关闭自动完成功能？
15、如何实现浏览器内多个标签页之间的通信? (阿里)
16、webSocket如何兼容低浏览器？(阿里)
17、页面可见性（Page Visibility）API 可以有哪些用途？
18、如何在页面上实现一个圆形的可点击区域？
19、实现不使用 border 画出1px高的线，在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。
20、网页验证码是干嘛的，是为了解决什么安全问题？
21、tite与h1的区别、b与strong的区别、i与em的区别？
二、css
1、介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？

2、CSS选择符有哪些？哪些属性可以继承？
3、CSS优先级算法如何计算？
4、CSS3新增伪类有那些？
5、如何居中div？如何居中一个浮动元素？如何让绝对定位的div居中？
6、display有哪些值？说明他们的作用。
7、position的值relative和absolute定位原点是？
8、CSS3有哪些新特性？
9、请解释一下CSS3的Flexbox（弹性盒布局模型）,以及适用场景？
10、用纯CSS创建一个三角形的原理是什么？

11、一个满屏 品 字布局 如何设计?

三、常见兼容性问题？

1. 
   1、li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法？
   2、经常遇到的浏览器的兼容性有哪些？原因，解决方法是什么，常用hack的技巧 ？
   3、为什么要初始化CSS样式。
   4、absolute的containing block计算方式跟正常流有什么不同？
   5、CSS里的visibility属性有个collapse属性值是干嘛用的？在不同浏览器下以后什么区别？
   6、position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样？
   7、对BFC规范(块级格式化上下文：block formatting context)的理解？
   8、CSS权重优先级是如何计算的？
   9、请解释一下为什么会出现浮动和什么时候需要清除浮动？清除浮动的方式
   10、移动端的布局用过媒体查询吗？
   11、使用 CSS 预处理器吗？喜欢那个？
   12、CSS优化、提高性能的方法有哪些？
   13、浏览器是怎样解析CSS选择器的？
   14、在网页中的应该使用奇数还是偶数的字体？为什么呢？
   15、margin和padding分别适合什么场景使用？
   16、抽离样式模块怎么写，说出思路，有无实践经验？
   17、元素竖向的百分比设定是相对于容器的高度吗？
   18、全屏滚动的原理是什么？用到了CSS的那些属性？
   19、什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？
   20、视差滚动效果，如何给每页做不同的动画？（回到顶部，向下滑动要再次出现，和只出现一次分别怎么做？）
   21、::before 和 :after中双冒号和单冒号 有什么区别？解释一下这2个伪元素的作用。
   22、如何修改chrome记住密码后自动填充表单的黄色背景 ？
   23、你对line-height是如何理解的？
   24、设置元素浮动后，该元素的display值是多少？（自动变成display:block）
   25、怎么让Chrome支持小于12px 的文字？
   26、让页面里的字体变清晰，变细用CSS怎么做？（-webkit-font-smoothing: antialiased;）
   27、font-style属性可以让它赋值为“oblique” oblique是什么意思？
   28、position:fixed;在android下无效怎么处理？
   29、如果需要手动写动画，你认为最小时间间隔是多久，为什么？（阿里）
   30、display:inline-block 什么时候会显示间隙？(携程)
   31、overflow: scroll时不能平滑滚动的问题怎么处理？
   32、有一个高度自适应的div，里面有两个div，一个高度100px，希望另一个填满剩下的高度。
   33、png、jpg、gif 这些图片格式解释一下，分别什么时候用。有没有了解过webp？
   34、什么是Cookie 隔离？（或者说：请求资源的时候不要让它带cookie怎么做）
   35、style标签写在body后与body前有什么区别？
   四、JavaScript
   1、介绍JavaScript的基本数据类型。
   2、说说写JavaScript的基本规范？
   3、JavaScript原型，原型链 ? 有什么特点？
   4、JavaScript有几种类型的值？（堆：原始数据类型和 栈：引用数据类型），你能画一下他们的内存图吗？
   5、Javascript如何实现继承？
   6、Javascript创建对象的几种方式？
   7、Javascript作用链域?
   8、谈谈This对象的理解。
   9、eval是做什么的？
   10、什么是window对象? 什么是document对象?
   11、null，undefined的区别？
   12、写一个通用的事件侦听器函数(机试题)。
   13、.map(parseInt) 答案是多少？
   14、关于事件，IE与火狐的事件机制有什么区别？ 如何阻止冒泡？
   15、什么是闭包（closure），为什么要用它？
   16、javascript 代码中的”use strict”;是什么意思 ? 使用它区别是什么？
   17、如何判断一个对象是否属于某个类？
   18、new操作符具体干了什么呢?
   19、用原生JavaScript的实现过什么功能吗？
   20、Javascript中，有一个函数，执行时对象查找时，永远不会去查找原型，这个函数是？
   21、对JSON的了解？
   22、.forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1《《24))).toString(16) }) 能解释一下这段代码的意思吗？
   23、js延迟加载的方式有哪些？
   24、Ajax 是什么? 如何创建一个Ajax？
   25、同步和异步的区别?
   26、如何解决跨域问题?
   27、页面编码和被请求的资源编码如果不一致如何处理？
   28、模块化开发怎么做？
   29、AMD（Modules/Asynchronous-Definition）、CMD（Common Module

   Definition）规范区别？
   30、requireJS的核心原理是什么？（如何动态加载的？如何避免多次加载的？如何 缓存的？）
   31、让你自己设计实现一个requireJS，你会怎么做？
   32、谈一谈你对ECMAScript6的了解？
   33、ECMAScript6 怎么写class么，为什么会出现class这种东西?
   34、异步加载的方式有哪些？
   35、documen.write和 innerHTML的区别?
   36、DOM操作——怎样添加、移除、移动、复制、创建和查找节点?
   37、.call() 和 .apply() 的含义和区别？
   38、数组和对象有哪些原生方法，列举一下？
   39、JS 怎么实现一个类。怎么实例化这个类
   40、JavaScript中的作用域与变量声明提升？
   41、如何编写高性能的Javascript？
   42、那些操作会造成内存泄漏？
   43、JQuery的源码看过吗？能不能简单概况一下它的实现原理？
   44、jQuery.fn的init方法返回的this指的是什么对象？为什么要返回this？
   45、jquery中如何将数组转化为json字符串，然后再转化回来？
   46、jQuery 的属性拷贝(extend)的实现原理是什么，如何实现深拷贝？
   47、jquery.extend 与 jquery.fn.extend的区别？
   48、jQuery 的队列是如何实现的？队列可以用在哪些地方？
   49、谈一下Jquery中的bind(),live(),delegate(),on()的区别？
   50、JQuery一个对象可以同时绑定多个事件，这是如何实现的？
   51、是否知道自定义事件。jQuery里的fire函数是什么意思，什么时候用？
   52、jQuery 是通过哪个方法和 Sizzle 选择器结合的？（jQuery.fn.find()进入Sizzle）
   53、针对 jQuery性能的优化方法？
   54、Jquery与jQuery UI有啥区别？
   55、JQuery的源码看过吗？能不能简单说一下它的实现原理？
   56、jquery 中如何将数组转化为json字符串，然后再转化回来？
   57、jQuery和Zepto的区别？各自的使用场景？
   58、针对 jQuery 的优化方法？
   59、Zepto的点透问题如何解决？
   60、jQueryUI如何自定义组件?
   61、需求：实现一个页面操作不会整页刷新的网站，并且能在浏览器前进、后退时正确响应。给出你的技术实现方案？
   62、如何判断当前脚本运行在浏览器还是node环境中？（阿里）
   63、移动端最小触控区域是多大？
   64、jQuery 的 slideUp动画 ，如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行，该如何处理呢?
   65、把 Script 标签 放在页面的最底部的body封闭之前 和封闭之后有什么区别？浏览器会如何解析它们？
   66、移动端的点击事件的有延迟，时间是多久，为什么会有？ 怎么解决这个延时？（click 有 300ms 延迟,为了实现safari的双击事件的设计，浏览器要知道你是不是要双击操作。）
   67、知道各种JS框架(Angular, Backbone, Ember, React, Meteor, Knockout…)么? 能讲出他们各自的优点和缺点么?
   68、Underscore 对哪些 JS 原生对象进行了扩展以及提供了哪些好用的函数方法？
   69、解释JavaScript中的作用域与变量声明提升？
   70、那些操作会造成内存泄漏？
   71、JQuery一个对象可以同时绑定多个事件，这是如何实现的？
   72、Node.js的适用场景？
   (如果会用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?
   73、解释一下 Backbone 的 MVC 实现方式？
   74、什么是“前端路由”?什么时候适合使用“前端路由”? “前端路由”有哪些优点和缺点?
   75、知道什么是webkit么? 知道怎么用浏览器的各种工具来调试和debug代码么?
   76、如何测试前端代码么? 知道BDD, TDD, Unit Test么? 知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)?
   77、前端templating(Mustache, underscore, handlebars)是干嘛的, 怎么用?
   78、简述一下 Handlebars 的基本用法？
   79、简述一下 Handlerbars 的对模板的基本处理流程， 如何编译的？如何缓存的？
   80、用js实现千位分隔符?(来源：前端农民工，提示：正则+replace)
   检测浏览器版本版本有哪些方式？
   81、我们给一个dom同时绑定两个点击事件，一个用捕获，一个用冒泡，你来说下会执行几次事件，然后会先执行冒泡还是捕获
   

Web前端5道面试题

1.请说明ECMAScript,JavaScript,Jscript之间的关系?
ECMAScript提供脚本语言必须遵守的规则、
细节和准则，是脚本语言的规范。
比如：ES5，ES6就是具体的一js版本。
JavaScript是ECMAScript的一个分支版本,
JavaScript实现了多数ECMA-262中
描述的ECMAScript规范，但存在少数差异。
JScript是微软公司对ECMA-262语言规范的
一种实现,除了少数例外(这是为了保持向后兼容),
微软公司宣称JScript完全实现了ECMA标准.
关系:
JavaScript和JScript都是ECMAScript的版本分支,
二者在语法上没有多大的区别;
只不过一个是NetScape公司的,一个是微软的;
IE系列默认是JScript,其它的则反之用JavaScript。
2.页面加载过程中可能触发哪些事件?它们的顺序是?
页面加载时，大致可以分为以下几个步骤：1)开始解析HTML文档结构2)加载外部样式表及JavaScript脚本3)解析执行JavaScript脚本4)DOM树渲染完成5)加载未完成的外部资源6)页面加载成功
执行顺序:1)documentreadystatechange事件2)documentDOMContentLoaded事件3)windowload事件
3.函数中在声明变量a前使用a会产生错误吗?为什么?
不会,JS中能够进行变量作用域提升,
把所有变量、函数的声明提升到当前
作用域的最前面,但不进行赋值操作;
所以可能造成获取的值是undefined。
4.什么是hash,以及hashchange事件?
先了解下什么是hash:hash即URL中"#"字符后面的部分。
a)使用浏览器访问网页时，
如果网页URL中带有hash，
页面就会定位到id(或name)
与hash值一样的元素的位置;
b)hash还有另一个特点，
它的改变不会导致页面重新加载;
c)hash值浏览器是不会随请求发送到服务器端的;
d)通过window.location.hash属性获取和设置hash值。
window.location.hash值的变化会直接
反应到浏览器地址栏(#后面的部分会发生变化)，同时，浏览器地址栏hash值的变化也会触发
window.location.hash值的变化，
从而触发onhashchange事件。
再来了解下什么是hashchange事件:
a)当URL的片段标识符更改时，
将触发hashchange事件(跟在#符号后面的URL部分，包括#符号)b)
hashchange事件触发时，
事件对象会有hash改变前的URL(oldURL)和hash改变后的URL(newURL)两个属性。
5.什么是CDN,CDN对于网站有什么意义,它有什么样的缺点?
CDN又称为内容分发网络;本意在于
尽可能避开互联网上有可能影响数据
传输速度和稳定性的瓶颈和环节，
使内容传输的更快、更稳定。
主要目的:
解决因分布、带宽、服务器性能带来的访问延迟问题，
适用于站点加速、点播、直播等场景。
使用户可就近取得所需内容，解决Internet网络拥挤的状况，
提高用户访问网站的响应速度和成功率。
缺点:
a)实施复杂,投资大;
b)目前大部分的CDN还只是对静态内容加速，
对动态加速效果不好;
而双线对动态加速的效果跟静态是一样的。

web前端 面试必问的几个问题有那些

web前端 面试必问的几个问题?有那些?

根据面试官的不同，面试的内容页不一样的。一般的话就是+css布局占一部分，例如各浏览器的相容性，然后就是js的ajax，闭包，冒泡什么的，js会占很大一部分，也有一部分面试官会抛开这些，直接问公司需要的内容，这样的话就是考验你的实际操作了，这类的面试官我很喜欢，就是直接问布局，资料填充之类的，能学到很多东西，建议面试时偷偷用手机录音，回来之后听一听，研究一下自己不会的问题，因为面试完之后，你可能就会忘了面试时都问过什么了

web前端 面试 会问哪些问题

对公司这个行业有什么样的看法，未来的职业规划，自己做好该职位工作的优势，个人缺点是什么，还有就是一些技术性问题了。web前端 面试 会问哪些问题

web前端开发的几个问题

1.巢状表单一般不会有什么问题，主要是看业务需求，不过尽量还是不要使用巢状。
2.name只是标签的属性，一般的网页标签元素都可以使用这个属性，并非只能表单域里的标签才能使用。比如 div、span、input等等都可以有name属性。
3.JQuery已经成为JS指令码开发的标配了，本身的体积也比较小，最主要的是简化了很多JS操作，而且我们基本不用考虑JS的浏览器相容问题了。至于效能和原生的JS没什么区别，放心使用吧。

面试Web前端需要注意什么？会面试哪些问题？

将这些问题作为参考。
希望你的面试官有点经验，不会用以下这样的问题开场。以防万一，还是准备一些答案。
1.为什么选择程式设计师这个职业生涯?
2.截至目前，你所从事的专案中最喜欢的是哪个?
3.描述一下你梦想中的研发专案。
另外一些面试官会问一些通用的技术问题，来测试你的技术能力。有可能部分人不知道这些问题是什么意思，而仅仅是在考察你的能力/竞争力。基于面试官的技术能力级别的不同，你的答案也会有所不同。这些问题简单易答，因此把这些问题记下来。
1.描述一下建立一个新网页的过程
2.怎样减少页面载入时间?
3.标准和标准体(standards and standards bodies)为什么重要?
4.你使用怎样一个过程来组织程式码?
5.你喜欢用什么工具来测试程式码效能?
既然你从事前端工作，理解CSS会非常重要。因此这里为你准备了一些常见的CSS问题。这是展示你知识储备的重要开始。这些并不是最尖锐或者重要的问题，如果不能回答出来，将对你很不利。
1.CSS 中的 resetting 和 normalizing 之间的区别有哪些?
2.什么是floats，它是如何工作的?
3.absolute、relative、fixed 和 static 定位的区别是什么?
4.解释visiblity hidden和display none之间的区别
5.你是如何修复特定浏览器预设样式的问题?
6.你是否用过网格系统?目的是?
7.如果计算CSS权重?
8.解释如何优化CSS选择器。
9.为什么需要使用预编译器?
10.你是如何测试网站的跨浏览器相容性?
现在我们最基本的任务完成了。谁都能死记硬背这些答案来应付以上问题。即使是新手前端开发者也能出色地回答大部分问题。然而如果想真正让你的面试官印象深刻并证明你的功底深厚，就把下面这些问题牢记在心。
1.前端开发的框架是什么?
2.响应式web app和原生应用程式的区别是什么?
3.原生app相对web app的优点是什么?
4.客户端和伺服器端开发的区别是什么?
5.什么是SASS和LESS?它们是如何工作的?
面试官会更多关注你是如何表达对这些问题的解释。他们会追问支援你的答案的工作案例。前面的问题你可能可以通过记忆而过关，你可能还会遇到这些问题的扩充套件，但这些答案的深度，将让你与众不同。通过你参与过的实际专案，来展示你的思考过程。

web前端jquery面试题有哪些

常见的几个如下：他们的答案可以百度搜。
1. jQuery 库中的 $() 是什么？
2. 网页上有 5 个 《div》 元素，如何使用 jQuery来选择它们？
3. jQuery 里的 ID 选择器和 class 选择器有何不同？
4. 如何在点选一个按钮时使用 jQuery 隐藏一个图片？
5. $(document).ready() 是个什么函式？为什么要用它？
6. JavaScript window.onload 事件和 jQuery ready 函式有何不同？
7. 如何找到所有 HTML select 标签的选中项？
8. jQuery 里的 each() 是什么函式？是如何使用它的？

web前端面试必考的基础面试题有哪些？

切图，css 盒模型，js基础语法，ajax, 面向物件，模组化，效能优化，自动化这想相对的考核会多一些。大公司重基础，小公司重能力，所以与时间的话多去刷一刷基础的题目吧。
祝你顺利通过面试！

web前端面试经常问到的面试题有哪些

web前端面试经常问到的面试题实在太多了，建议你去网上搜索一下，或者直接下载一些面试题的集锦，然后看看就好了。

1、 列举web效能优化？
1)
减少请求次数。合并档案、利用css sprite把零散的图片整合到一张图上。
2)
减少DNS查询。
3)
减少从定向。
4)
响应时间。使用AJAX进行快取，减少请求。
5)
延迟载入元件.
6)
预载入元件。
7)
减少节点的数量。
8)
切分元件到多个域。
9)
最小化iframe。
10)
杜绝404错误。
2、 介绍一下XMLHttpRequest物件的常用方式和属性?
open(“method”,”URL”) 建立对伺服器的呼叫，第一个引数是HTTP请求方式
可以为GET，POST或任何伺服器所支援的您想呼叫的方式。
第二个引数是请求页面的URL。
send()方法，传送具体请求
abort()方法，停止当前请求
readyState属性 请求的状态 有5个可取值 0=未初始化 ，1=正在载入
2=以载入，3=互动中，4=完成
responseText 属性 伺服器的响应，表示为一个串
reponseXML 属性 伺服器的响应，表示为XML
status 伺服器的HTTP状态码，200对应ok 400对应not found

web前端问题

IE浏览器类似银行网银安全密码输入控制元件，使用键盘钩子防止被键盘记录器监听密码，使用des对密码加密传输，输入框禁止选择复制
或者
只要是ActiveX，必须要进行IE的安全设定。
网银一般都是一个安装程式，安装的时候都给你设定好了。
ActiveX在页面里面和普通的DOM物件一样，只要ActiveX建立成功，就可以用js直接访问该元件的方和和属性。

2020年Web前端面试题汇总（一）

今天小编要跟大家分享的文章是关于2020年Web前端面试题汇总。由于内容较多小编分开为大家介绍，今天首先来和小编一起看一看第一部分的内容，希望这些面试题能够对正准备找Web前端相关工作的小伙伴们有所帮助。
1.说几条写JavaScript的基本规范?
1)不要在同一行声明多个变量;
2)请使用===/!==来比较true/false或者数值;
3)使用对象字面量替代newObject这种形式;
4)减少使用全局函数,全局变量;
5)switch语句必须带有default分支;
6)if语句必须使用大括号;
7)for-in循环中的变量;
应该使用var关键字明确限定作用域;
从而避免作用域全局污染。
2.说说平衡二叉树?
平衡二叉搜索树(Self-balancingbinarysearchtree)
又被称为AVL树。
具有以下性质：
1)它是一棵空树或它的左右两个子树
的高度差的绝对值不超过1，
并且左右两个子树都是一棵平衡二叉树。
2)平衡二叉树必定是二叉搜索树，反之则不一定。
3)平衡二叉树的常用实现方法有红黑树、AVL、
替罪羊树、Treap、伸展树等。
最小二叉平衡树的节点的公式如下：
F(n)=F(n-1)+F(n-2)+1备注：1是根节点，
F(n-1)是左子树的节点数量，
F(n-2)是右子树的节点数量。
3.清除浮动和解决垂直外边距重叠的解决方案?
问题描述:
1)父元素没有设置宽高，尺寸由子元素撑起;
子元素一旦浮动，父元素高度会发生塌陷。
2)子元素设置margin-top会作用的父元素的margin-top;
此时会造成垂直外边距重叠。
.clearfix::after,.clearfix::before{
content:’’;
display:table;
clear:both;
}
4.sessionStorage、localStorage和cookie?
相同点:
都用于浏览器端存储的缓存数据;
不同点:
1)存储内容是否发送到服务器端
当设置了Cookie后，数据会发送到服务器端，
造成一定的宽带浪费;xxxstorage则会将数据保存
到本地，不会造成宽带浪费;
2)数据存储大小不同
Cookie数据不能超过4K，适用于会话标识;
xxxstorage数据存储可以达到5M;
3)数据存储的有效期限不同
cookie只在设置了Cookid过期时间
之前一直有效，即使关闭窗口或者浏览器;
sessionStorage,仅在关闭浏览器之前有效;
localStorage,数据存储永久有效;
4)作用域不同
cookie和localStorage是在同源同窗口中
都是共享的;
sessionStorage不在不同的浏览器窗口
中共享，即使是同一个页面;
5.判断一个单词是否是回文?
回文是指把相同的词汇或句子，
在下文中调换位置或颠倒过来，
产生首尾回环的情景，
叫做回文，也叫回环。
比如cacac，redivider。
letcheckPalindrom=(str)=》{
returnstr===
str.split(’’).reverse().join(’’);
}
6.不借助临时变量，进行两个整数的交换?
输入a=3,b=1,
输出a=1,b=3
letswap=(a,b)=》{
b=b-a;
a=a+b;
b=a-b;
return;
}
7.请写出至少5个html5新增的标签，并说明其语义和应用场景?
section：定义文档中的一个章节;
nav：定义只包含导航链接的章节;
header：定义页面或章节的头部;
它经常包含logo、页面标题和导航性的目录。
footer：定义页面或章节的尾部;
它经常包含版权信息、法律信息链接和反馈建议用的地址。
aside：定义和页面内容关联度较低的内容，
如果被删除，剩下的内容仍然很合理。
8.get和post请求在缓存方面的区别?
get请求类似于查找的过程，用户获取数据，
可以不用每次都与数据库连接，所以可以使用缓存。
post不同，post做的一般是修改和删除的工作，
所以必须与数据库交互，所以不能使用缓存。
因此get请求适合于请求缓存。
9.如何解决异步回调地狱?
promise、generator、async/await
10.图片的懒加载和预加载?
预加载：提前加载图片，
当用户需要查看时可直接
从本地缓存中渲染。
懒加载：懒加载的主要目的
是作为服务器前端的优化，
减少请求数或延迟请求数。
两种技术的本质：
两者的行为是相反的，
一个是提前加载，
一个是迟缓甚至不加载。
懒加载对服务器前端有一定
的缓解压力作用，
预加载则会增加服务器前端压力。
11.bind，apply，call的区别?
通过apply和call改变函数的this指向，
这两个函数的第一个参数都是一样的，
表示要改变指向的那个对象，
第二个参数，apply是数组，
而call则是arg1,arg2...这种形式。
通过bind改变this作用域
会返回一个新的函数，
这个函数不会马上执行。
12.js怎么控制一次加载一张图片，加载完后再加载下一张?
方法一:

varobj=newImage();
obj.src="#/21.jpg";
obj.onload=function(){
document.getElementById("pic")
.innnerHTML="";
}

加载中

Web前端企业面试题

答：

一、display和visibility的相同与不同点

1、相同点：display和visibility都有讲元素隐藏的意思

2、不同点：display是元素隐藏，隐藏的元素不占文档流

而visibility隐藏的元素仍然占文档流

二、display和visibility的属性值

1、display

2、visibility

答：

在开发过程中经常需要循环遍历数组或者对象，使用最多的方法 forEach、for…in 、 for…of ，整理一下他们的异同点

for循环

其实除了这三种方法以外还有一种最原始的遍历，自Javascript诞生起就一直用的 就是for循环，它用来遍历数组

for循环中可以使用return、break等来中断循环

结果：

forEach

对数组的每一个元素执行一次提供的函数（不能使用return、break等中断循环），不改变原数组，无返回值undefined。

输出结果：

for…in

循环遍历的值都是数据结构的键值

总结一句: for in也可以循环数组但是特别适合遍历对象

结果：

for…of

它是ES6中新增加的语法，用来循环获取一对键值对中的值

循环一个数组

循环一个普通对象（报错）

答：

px：像素（Pixel）,相对长度单位。像素px是相对于显示器屏幕分辨率而言的 。--即分辨率不同的机型当前对应的距离可能发生变化。(1Inches=xPx)。

所以相对于同一机型来说是一个绝对的长度单位。

em：是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸 。

以其父级元素为基准来变化长度。所以其算法不是一个固定的值。

rem：是CSS3新增的一个相对单位（root em，根em） 。

那么其好用在用可以直接设置HTML的font-size，然后在其子类都是以这个大小为基准变化的值。

在移动设备上，我们常常设置

此方式的目的是为了将当前屏幕(PC)分辨率的px转化成手机端的px，让px在手机上能够兼容此方式。

因此，此时看见的12px与PC端的12px无异。但是，如果不写着个meta的话，那么，浏览器会一直以PC的视图来决定手机端的px的大小，让视图看起来变小了很多。

那么，响应式页面则经常配合媒体查询media 来设置不同分辨率下手机的各种不同的配置机构，然后根据父级来变化所有的相对长度。

基础篇

1.shift

// 删除原数组的第一项，并返回删除元素的值，如果数组为空则返回undefined

2.unshift

// 将参数添加到原数组开头，并返回数组的长度

//注：此方法在ie6.0下

// 测试的返回值始终为undefined，在firefox下测试的返回值为7，所以此方法不可靠

// 一般需要用返回值时可用splice代替

3.pop

// 删除原数组的最后一项，并返回删除元素的值；如果数组为空则返回undefined

4.push

// 将参数添加到原数组末尾，并返回数组的长度

5.concat

// 返回一个新数组，是将参数添加到原数组中构成的

6.splice

7.reverse

8.sort(orderfunction)

9.slice(start,end)

10.join(separator)

11.indexOf

12.lastIndexOf

13. Array.isArray()

14. Array.toString()

进阶篇

1.forEach

是最为常用的情景，它至于遍历，可以在获取当前数据项的前提下，对数据进行修改。它没有返回值。理解起来也是最容易的。

2.map

map的本意就是映射，也就是将一个值从一种形式映射到另一种形式，比如将key映射到value。它的每一次遍历都会有一个返回值。这些返回值组合成最终的结果数组。事实就是如此

forEach和map对比

相同点

1）都是循环遍历数组中的每一项；

2）forEach()和map()匿名函数的参数相同，参数分别是item（当前每一项）、index（索引值）、arr（原数组）；

3）this都是指向调用方法的数组；

4) 只能遍历数组；

不相同点

1）map()创建了新数组，不改变原数组；forEach()可以改变原数组。

2）遇到空缺的时候map()虽然会跳过，但保留空缺；forEach()遍历时跳过空缺，不保留空缺。

3）map()按照原始数组元素顺序依次处理元素；forEach()遍历数组的每个元素，将元素传给回调函数。

3.filter

它致力于从已有的数组中筛选出符合一定条件的数据项，最后的返回值是所有符合条件的数据项构成的数组。它不会修改原来的数组。记住，它的立足点就是筛选。也仅仅是筛选。还有一点需要注意：每一次遍历都会有一个返回值，它的类型是布尔类型。返回值只有是true，当前遍历项才会被筛选中。不要试图在filter中去修改原始数组。

理解: 就是在一堆数据里面去筛选你需要的数据 或者 剔除你不需要的数据

4.find()

返回通过测试的数组的第一个元素的值,

理解:假如你去一个一群人的地方去找人 你说我找xxb 他要是在那里就找到 不在那里就是undefined

在第一次调用 callback 函数时会确定元素的索引范围，因此在 find 方法开始执行之后添加到数组的新元素将不会被 callback 函数访问到。如果数组中一个尚未被callback函数访问到的元素的值被callback函数所改变，那么当callback函数访问到它时，它的值是将是根据它在数组中的索引所访问到的当前值。被删除的元素仍旧会被访问到。

语法

array.find(function(value, index, arr),thisValue)

value:必须，代表当前元素，其他四个参数都是可选，index代表当前索引值，arr代表当前的数组，thisValue代表传递给函数的值，一般用this值，如果这个参数为空，undefined会传递给this值

返回值：返回符合测试条件的第一个数组元素的值，如果没有符合条件的则返回undefined。

扩展: findIndex()方法的用法与find()方法非常类似，返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。自己try吧

5.every

理解: 这个就像 上课了 老师说 昨天布置的作业 只要有一个人没有写完 今天就不讲课 然后挨个检查 当检查到有一个没有写完的时候 就不检查了 返回 不讲课了(false)

6.some

理解: 相当于在一个数组里面找你想要的那个数 找到了 就返回true 找不到就返回false

7.reduce

它这个方法是接收一个函数作为累加器,将数组中的值(从左向右)开始合并,最总为一个值 然后返回出来,callback

他可以传四个参数:

1,previousValue:上一次调用回调返回的值,或者是提供的初始值(initialValue)

2,currentValue:数组中当前被处理的元素

3,index:不啰嗦,自己顾名思义去吧

4,array:返回调用reduce的数组

彩蛋: 这里附上前几天某某人比较喜欢的切割字符串的方法

substring() 和 substr()

相同点： 如果只是写一个参数，两者的作用都一样：都是是截取字符串从当前下标以后直到字符串最后的字符串片段。

不同点： 第二个参数

substr(startIndex, lenth) // 第二个参数是截取字符串的长度（从起始点截取某个长度的字符串）；

substring(startIndex, endIndex) // 第二个参数是截取字符串最终的下标 （截取2个位置之间的字符串,‘含头不含尾’）。

1：在使用vue框架的过程中，我们经常需要给一些数据做一些初始化处理，这时候我们常用的就是在created与mounted选项中作出处理。

首先来看下官方解释，官方解释说created是在实例创建完成后呗立即调用。在这一步，实例已完成以下配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。然而，挂载阶段还没开始，$el 属性目前不可见。

这话的意思我觉得重点在于说挂架阶段还没开始，什么叫还没开始挂载，也就是说，模板还没有被渲染成html，也就是这时候通过id什么的去查找页面元素是找不到的。下面看下实例来证明。

所以，一般creadted钩子函数主要是用来初始化数据。

2：mounted钩子函数一般是用来向后端发起请求拿到数据以后做一些业务处理。官方解释如下：

el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用该钩子。如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.$el 也在文档内。

这意思是该钩子函数是在挂在完成以后也就是模板渲染完成以后才会被调用。下面看实例

下面是结果

nihao

取到了值，这说明这时候vue模板已经渲染完毕。因此，Dom操作一般是在mounted钩子函数中进行的

computed:{} 计算属性，什么是计算属性呢，我个人理解就是对数据进行一定的操作，可以包含逻辑处理操作，对计算属性中的数据进行监控。计算属性是基于它的以来进行更新的，只有在相关依赖发生改变时侧能更新变化，以函数的形式返回结果。然后可以像绑定普通属性一样在模板中绑定计算属性。

总结：
通常created使用的次数多，而mounted通常是在一些插件的使用或者组件的使用中进行操作，比如插件chart.js的使用: var ctx = document.getElementById(ID);通常会有这一步，而如果你写入组件中，你会发现在created中无法对chart进行一些初始化配置，一定要等这个html渲染完后才可以进行，那么mounted就是不二之选。
methods:{}中的方法都需要主动去触发，比如点击click之类的
而created(){}、mounted(){}、里面的代码都是自动去执行的，即vue生命周期到了哪一步就直接去执行对应钩子函数里面的代码了，无需手动去执行
created中主要放初始化获取数据之类，mounted()中挂载到具体的DOM节点

computed:{} 计算属性，什么是计算属性呢，我个人理解就是对数据进行一定的操作，可以包含逻辑处理操作，对计算属性中的数据进行监控。计算属性是基于它的以来进行更新的，只有在相关依赖发生改变时侧能更新变化，以函数的形式返回结果。然后可以像绑定普通属性一样在模板中绑定计算属性。

mounted 是生命周期钩子，vue的生命周期中一个实例的mounted只会运行一次。mounted在vue的渲染模板挂载到$el元素上才会调用，很显然你export的时候el都么有自然不会运行mounted钩子函数了。
所有的方法都应该在methods里定义，然后在created或者mounted里 使用this调用方法，用这种方式实现初始化

6、Vue中组件之间的传参方式有哪些方式？

Vue 组件传参的八种方式总结

Vue 组件的使用不管是在平常工作还是在面试面试中，都是频繁出现的。因此系统的梳理一下组件之间的传参还是非常有必要的

一、props 传参

子组件定义 props 有三种方式:

// 第一种数组方式

// 第二种对象方式

// 第三种对象嵌套对象方式

第三种对象默认支持 4 种属性，并且都是非必填的。可以随意使用

父组件传参的俩种方式

第一种静态属性传参

注意：

1、在不定义 props 类型的情况下 props 接受到的均为 String。

2、当 props 属性指定为 Boolean 时，并且只有属性 key 没有值 value 时接受到的是 true

第二种动态属性传参

注意：

1、需要区分非简写形式传入的值是对象，则会对应 props 中多个值

2、会保留传入值的类型

3、如果是表达式则获取到的是表达式的计算结果

二、attrs 和listeners

$attrs

$attrs 会获取到 props 中未定义的属性（class 和 style 属性除外）,支持响应式。常用的场景有俩种：

组件嵌套组件时可以使用 $attrs 来支持过多的属性支持。比如 elementUI 的 table 组件。支持的属性十几个，而平常封装的时候用的最多的也就一俩个。

属性默认是添加在父组件上的，有时候想把多余的属性添加在子组件上（可以结合 inheritAttrs: false 属性，让父属性不接受多余的属性）

$listeners 定义的事件都在子组件的根元素上，有时候想加到其他元素上。就可以使用 $listerners。它包含了父组件中的事件监听器(除了带有 .native 修饰符的监听器)

三、$emit 通知

这里有一道考题: for 循环的时候如何拿到子组件的传值和 for 中循环的值

答案有俩种，一是 $event, 二是 闭包。只是需要注意 $event 只能获取到第一个值

四、v-model

这个其实是一种通过 emit，on 的组合方式。优点再于同步值方便,写法优雅。下面三种写法其实是一个意思

五、插槽

六、$refs, $root, $parent, $children

$root 获取根组件

$parent 获取父组件

$children 获取子组件(所有的子组件，不保证顺序)

$refs 组件获取组件实例，元素获取元素

七、project / inject

注意：注入的值是非响应的

八、Vuex

这个相当于单独维护的一组数据，就不过多的说了。

watch，computed和methods的关系

1.watch和computed都是以Vue的依赖追踪机制为基础的 ，它们都试图处理这样一件事情：当某一个数据（称它为依赖数据）发生变化的时候，所有依赖这个数据的“相关”数据“自动”发生变化，也就是自动调用相关的函数去实现数据的变动。

2.对methods:methods里面是用来定义函数的，很显然，它需要手动调用才能执行。而不像watch和computed那样，“自动执行”预先定义的函数

watch和computed各自处理的数据关系场景不同

1. watch 擅长处理的场景： 一个数据影响多个数据

2. computed 擅长处理的场景： 一个数据受多个数据影响

watch用法 监听下记haiZeiTuan_Name的值，会改变其他所有的值

结果：this.suoLong会变为 ’橡胶海贼团索隆’,以此类推

computed用法 监听下记firstName，secName，thirdName的值，会改变luFei_Name的值

methods和computed的区别例子

注意两次点击computed返回的时间是相同的！！

1.两次点击methods返回的时间是不同的

2.注意两次点击computed返回的时间是相同的

【注意】为什么两次点击computed返回的时间是相同的呢？new Date()不是依赖型数据 （不是放在data等对象下的实例数据） ，所以computed只提供了缓存的值，而没有重新计算

只有符合：1.存在依赖型数据 2.依赖型数据发生改变这两个条件 ,computed才会重新计算。

***隐藏网址***

***隐藏网址***

1、Promise

Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大，简单地说，Promise好比容器，里面存放着一些未来才会执行完毕（异步）的事件的结果，而这些结果一旦生成是无法改变的

2、async await

async await也是异步编程的一种解决方案，他遵循的是Generator 函数的语法糖，他拥有内置执行器，不需要额外的调用直接会自动执行并输出结果，它返回的是一个Promise对象。

两者的主要用法、语法就不赘述了，感兴趣的同学可以自行查阅 es6中文文档

两者的区别

1、Promise的出现解决了传统callback函数导致的“地域回调”问题，但它的语法导致了它向纵向发展行成了一个回调链，遇到复杂的业务场景，这样的语法显然也是不美观的。而async await代码看起来会简洁些，使得异步代码看起来像同步代码，await的本质是可以提供等同于”同步效果“的等待异步返回能力的语法糖，只有这一句代码执行完，才会执行下一句。

2、async await与Promise一样，是非阻塞的。

3、async await是基于Promise实现的，可以说是改良版的Promise，它不能用于普通的回调函数。

简单来看，这两者除了语法糖不一样外，他们解决的问题、达到的效果是大同小异的，我们可以在不同的应用场景，根据自己的喜好来选择使用。

经典的 Web 前端或者 JavaScript 面试笔试题有哪些

一、不定项选择题（每题3分，共30分）\x0d\x0a1.声明一个对象，给它加上name属性和show方法显示其name值，以下代码中正确的是（D）\x0d\x0aA.varobj=;\x0d\x0aB.varobj={name:”zhangsan”,show:”alert(this.name)”};\x0d\x0aC.varobj={name:”zhangsan”,show:function(){alert(name);}};\x0d\x0aD.varobj={name:”zhangsan”,show:function(){alert(this.name);}};\x0d\x0a2.以下关于Array数组对象的说法不正确的是（CD）\x0d\x0aA.对数组里数据的排序可以用sort函数，如果排序效果非预期，可以给sort函数加一个排序函数的参数\x0d\x0aB.reverse用于对数组数据的倒序排列\x0d\x0aC.向数组的最后位置加一个新元素，可以用pop方法\x0d\x0aD.unshift方法用于向数组删除第一个元素\x0d\x0a3.要将页面的状态栏中显示“已经选中该文本框”，下列JavaScript语句正确的是（A）\x0d\x0aA.window.status=”已经选中该文本框”\x0d\x0aB.document.status=”已经选中该文本框”\x0d\x0aC.window.screen=”已经选中该文本框”\x0d\x0aD.document.screen=”已经选中该文本框”\x0d\x0a4.点击页面的按钮，使之打开一个新窗口，加载一个网页，以下JavaScript代码中可行的是（AD）\x0d\x0aA.\x0d\x0aB.\x0d\x0aC.\x0d\x0aD.\x0d\x0a\x0d\x0a\x0d\x0a5.使用JavaScript向网页中输出

hello

前端面试会提问到哪些

在面试前端的过程中，有些问题是经常会被提问到的
一、基础篇
1. 在不使用第三个变量的情况下，如何调换a与b的值？
2. px与em的区别
3. 简述一下盒模型
4. 页面导入样式时，使用link和@import有什么区别？
5. 简述一下事件代理
二、HTML常见题目
01、Doctype作用？严格模式与混杂模式如何区分？它们有何意义？
02、HTML5为什么只需要写？
03、行内元素有哪些？块级元素有哪些？空(void)元素有哪些？
04、页面导入样式时，使用link和@import有什么区别？
05、介绍一下你对浏览器内核的理解？
06、常见的浏览器内核有哪些？
07、html5有哪些新特性、移除了哪些元素？如何处理HTML5新标签的浏览器兼容问题？
08、如何区分HTML和HTML5？
09、简述一下你对HTML语义化的理解？
10、HTML5的离线储存怎么使用，工作原理能不能解释一下？
三、CSS类的题目
01、介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？
02、CSS选择符有哪些？哪些属性可以继承？
03、CSS优先级算法如何计算？
04、CSS3新增伪类有哪些？
05、如何居中div？如何居中一个浮动元素？如何让绝对定位的div居中？
06、display有哪些值？说明他们的作用。
07、position的值relative和absolute定位原点是？
08、CSS3有哪些新特性？
09、请解释一下CSS3的Flexbox(弹性盒布局模型),以及适用场景？
10、用纯CSS创建一个三角形的原理是什么？
四、JavaScript类的题目
01、JavaScript中this是如何工作的
02、请解释原型继承的原理。
03、什么是闭包(closure)，如何使用它，为什么要使用它？
04、.call 和.apply的区别是什么？
05、请指出JavaScript 宿主对象(host objects) 和原生对象(native objects) 的区别？
06、请指出以下代码的区别：function Person(){}、var person = Person()、var person = new Person()？
07、请解释变量声明提升(hoisting)。
08、什么是 “use strict”; ？ 使用它的好处和坏处分别是什么？
09、什么是事件循环 (event loop)？
10、请解释同步 (synchronous) 和异步 (asynchronous) 函数的区别。
五、开发及性能优化类题目
01、如何规避javascript多人开发函数重名问题？
02、请说出三种减低页面加载时间的方法.
03、说说你所了解到的Web攻击技术。
04、说说你说了解的前端性能优化方法？
05、前端开发中，如何优化图像？图像格式的区别？
06、浏览器是如何渲染页面的？
07、页面重构怎么操作？
08、什么叫优雅降级和渐进增强？
09、前端需要注意哪些SEO？如何做SEO优化？
10、平时如何管理你的项目？

常见的web前端面试题及答案分享

1、 说下行内元素和块级元素的区别?行内块元素的兼容性使用?(IE8 以下)

答：行内元素：会在水平方向排列，不能包含块级元素，设置width无效，height无效(可以设置line-height)，margin上下无效，padding上下无效。块级元素：各占据一行，垂直方向排列。从新行开始结束接着一个断行。兼容性：display:inline-block;*display:inline;*zoom:1。

2、box-sizing常用的属性有哪些?分别有什么作用?

答：box-sizing: content-box|border-box|inherit。content-box:宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框(元素默认效果)。

border-box:元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。

3、Doctype作用?标准模式与兼容模式各有什么区别?

答：告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。

标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中，页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。

4、html5有哪些新特性?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?

答：HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。

(1)绘画 canvas;

(2)用于媒介回放的 video 和 audio 元素;

(3)本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失;

(4)sessionStorage 的数据在浏览器关闭后自动删除;

(5)语意化更好的内容元素，比如 article、footer、header、nav、section;

(6)表单控件，calendar、date、time、email、url、search;

(7)新的技术webworker, websocket, Geolocation;

IE8/IE7/IE6支持通过document.createElement方法产生的标签，可以利用这一特性让这些浏览器支持HTML5新标签，浏览器支持新标签后，还需要添加标签默认的样式。当然也可以直接使用成熟的框架、比如html5shim。

以上就是环球青藤小编关于web前端面试题的相关分享，希望对大家有所帮助，想要了解更多相关内容，请及时关注本平台并进行查看!

web前端面试经常问到的面试题有哪些

Web前端经常被问到的面试题及答案

一、HTML+CSS

1.对WEB标准以及W3C的理解与认识

标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外
链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维
护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性;

2.xhtml和html有什么区别

HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言

最主要的不同：

XHTML 元素必须被正确地嵌套。

XHTML 元素必须被关闭。

标签名必须用小写字母。

XHTML 文档必须拥有根元素。

3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?

用于声明文档使用那种规范(html/Xhtml)一般为 严格 过度 基于框架的html文档

加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug

4.行内元素有哪些?块级元素有哪些?CSS的盒模型?

块级元素：div p h1 h3 h3 h4 form ul

行内元素: a b br i span input select

Css盒模型:内容，border ,margin，padding

5.CSS引入的方式有哪些? link和@import的区别是?

内联 内嵌 外链 导入

区别 ：同时加载

前者无兼容性，后者CSS2.1以下浏览器不支持

Link 支持使用javascript改变样式，后者不可

6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?

标签选择符 类选择符 id选择符

继承不如指定 Id》class》标签选择

后者优先级高

7.前端页面有哪三层构成，分别是什么?作用是什么?

结构层 Html 表示层 CSS 行为层 js

8.css的基本语句构成是?

选择器{属性1:值1;属性2:值2;……}

9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto)

二、Javascript

1.javascript的typeof返回哪些数据类型

Object number function boolean underfind

2.例举3种强制类型转换和2种隐式类型转换?

强制(parseInt,parseFloat,number)

隐式(== – ===)

3.split() join() 的区别

前者是切割成数组的形式，后者是将数组转换成字符串

4.数组方法pop() push() unshift() shift()

Push()尾部添加 pop()尾部删除

Unshift()头部添加 shift()头部删除

5.事件绑定和普通事件有什么区别

6.IE和DOM事件流的区别

1.执行顺序不一样、

2.参数不一样

3.事件加不加on

4.this指向问题

7.IE和标准下有哪些兼容性的写法

Var ev = ev || window.event

document.documentElement.clientWidth || document.body.clientWidth

Var target = ev.srcElement||ev.target

8.ajax请求的时候get 和post方式的区别

一个在url后面 一个放在虚拟载体里面

有大小限制

安全问题

应用不同 一个是论坛等只需要请求的，一个是类似修改密码的

9.call和apply的区别

Object.call(this,obj1,obj2,obj3)

Object.apply(this,arguments)

10.ajax请求时，如何解释json数据

使用eval parse 鉴于安全性考虑 使用parse更靠谱

11.b继承a的方法

12.写一个获取非行间样式的函数

function getStyle(obj,attr,value)

{

if(!value)

{

if(obj.currentStyle)

{

return obj.currentStyle(attr)

}

else

{

obj.getComputedStyle(attr,false)

}

}

else

{

obj.style=value

}

}

高级前端面试题目大全（三）

解析： 第 41题

比如 sleep(1000) 意味着等待1000毫秒，可从 Promise、Generator、Async/Await 等角度实现

解析： 第 42 题

解析： 第 43 题

***隐藏网址***
2、web服务器收到客户端请求后, 会将网站的证书(包含公钥)传送一份给客户端
3、客户端收到网站证书后会检查证书的颁发机构以及过期时间, 如果没有问题就随机产生一个秘钥
4、客户端利用公钥将会话秘钥加密, 并传送给服务端, 服务端利用自己的私钥解密出会话秘钥
5、之后服务器与客户端使用秘钥加密传输

解析： 第 44 题

解析： 第 45 题

1.使用第一次push，obj对象的push方法设置 obj=1;obj.length+=1
2.使用第二次push，obj对象的push方法设置 obj=2;obj.length+=1
3.使用console.log输出的时候，因为obj具有 length 属性和 splice 方法，故将其作为数组进行打印
4.打印时因为数组未设置下标为 0 1 处的值，故打印为empty，主动 obj 获取为 undefined

解析： 第 46 题

解析： 第 47 题

1、Function.prototype.apply和Function.prototype.call 的作用是一样的，区别在于传入参数的不同；
2、第一个参数都是，指定函数体内this的指向；
3、第二个参数开始不同，apply是传入带下标的集合，数组或者类数组，apply把它传给函数作为参数，call从第二个开始传入的参数是不固定的，都会传给函数作为参数。
4、call比apply的性能要好，平常可以多用call, call传入参数的格式正是内部所需要的格式

解析： 第 48 题

解析： 第 49 题

解析： 第 50 题

为什么在 Vue3.0 采用了 Proxy，抛弃了 Object.defineProperty？

解析： 第 51 题

解析： 第 52 题

解析： 第 53 题

解析： 第 54 题

如下：{1:222, 2:123, 5:888}，请把数据处理为如下结构：。

解析： 第 55 题

解析： 第 56 题

解析： 第 57 题

解析： 第 58 题

解析： 第 59 题

解析： 第 60 题

解析： 第 61 题

解析： 第 62 题

解析： 第 63 题

解析： 第 64 题

解析： 第 65 题

解析： 第 66 题

随机生成一个长度为 10 的整数类型的数组，例如 。

解析： 第 67 题

解析： 第 68 题

解析： 第 69 题

解析： 第 70 题

解析： 第 71 题

《figcaption》《/figcaption》

解析： 第 72 题

解析： 第 73 题

解析： 第 74 题

解析： 第 75 题

解析： 第 76 题

示例 1：

示例 2：

解析： 第 77 题

解析： 第 78 题

解析： 第 79 题

解析： 第 80 题

解析： 第 81 题

解析： 第 82 题

解析： 第 83 题

***隐藏网址***

解析： 第 84 题

解析： 第 85 题

给定一个整数数组和一个目标值，找出数组中和为目标值的两个数。

你可以假设每个输入只对应一种答案，且同样的元素不能被重复利用。

示例：

解析： 第 86 题

解析： 第 87 题

以下数据结构中，id 代表部门编号，name 是部门名称，parentId 是父部门编号，为 0 代表一级部门，现在要求实现一个 convert 方法，把原始 list 转换成树形结构，parentId 为多少就挂载在该 id 的属性 children 数组下，结构如下：

解析： 第 88 题

解析： 第 89 题

解析： 第 90 题

解析： 第 91 题

解析： 第 92 题

示例 1：

中位数是 2.0

示例 2：

中位数是(2 + 3) / 2 = 2.5

解析： 第 93 题

解析： 第 94 题

解析： 第 95 题

解析： 第 96 题

解析： 第 97 题

解析： 第 98 题

解析： 第 99 题

***隐藏网址***