A. 你遇到的前端面试题都有什么
大家好，我是王我。
随着春节的结束，各个行业也普遍开始了上班的节奏， 不过本人17号才上班。为什么？因为长得帅的都上班比较晚。 当然，每到新年结束，又迎来了一批招聘者与面试者，我来说说作为一年工作经验应该知道的面试题。
HTML篇
1.doctype是什么？有哪些类型？
2.input有哪些新类型？简要说明其8用法。
3.HTML5有哪些新特性，移除了哪些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分HTML和HTML5？
4.bootstrap响应式的原理是什么？
5.多移动终端页面适配是如何实现的？
CSS篇
1.如何实现两列布局，左边自适应，右边固定宽度？
2.用CSS画一个三角形
3.CSS实现字体大写
4.display有哪些常用的属性值？分别是什么意思？
5.position为absolute，relative，fixed的定点位置
6.用三种方法清除浮动
7.请介绍一下margin塌陷问题
js篇
1.什么是事件冒泡和捕获？如何阻止事件冒泡？(分别用原生和jquery实现)
2.js创建对象，至少使用三种方法
3.简述一下事件穿透以及解决办法
4.用三种方式判断变量类型是否是数组
5.如何实现对象的拷贝？
6.什么是闭包？闭包的优缺点。
7.简述一下ajax请求的过程。
8.简述一下new一个人构造函数的人过程。
9.为什么会有跨域？是怎么解决跨域问题的？简述一下原理。
10.js原始数据类型有哪些？
11.学一个函数，判断一个变量是否是字符串
12.typeof有哪些结果？
13.剪头函数和普通函数有什么区别？
14.请用三种方法实现数组去重
15.href和src有什么区别？
jquery篇
1.attr()和prop()有什么区别？
2.on和bind有什么区别？js动态添加的dom元素是通过on还是bind？
3.touch和click有什么区别？
4.window.onload和jquery的ready有什么区别？
vue篇
1.简述一下vue的生命周期及其特点
2.vue双向绑定的原理是什么？
3.vue的特点有哪些？和jquery有什么区别？
4.父子组件之间传递数据的方法
5.子组件如何共享数据？
6.一般有什么工具进行数据交互？
7.webpack的原理是什么？
8.简述一下$nextTick的用法
浏览器篇
1.cookie、sessionStorage、localStorage的区别是什么？
2.有用过浏览器缓存吗？简述一下基本的缓存机制
网络篇
1.http和https之间的区别
2.从服务器的安全考虑，是使用get请求还是post请求？
3.URL请求的过程有哪些？
项目经验篇
1.项目中遇到的最大挑战以及解决办法
2.常见的网页优化有哪些？
作为一个面试一年以内工作经验的前端程序员来说，以上的问题能够倒答如流月薪6k应该不成问题啦。这些面试题也是我在很多面试中感觉经常被问到的题目。
希望大家年后找工作能够顺顺利利， 千万不要跟我一样哦，只有帅气就一无所有了。
大家好，我是王我，中国最帅的前端程序员。
前几次都是各种培训公司，各种忽悠就不提了，说说后面4次面试的经历。
第一次是面一个小公司，不过他们好像没有厉害的前端，来面我的是个后端，一来没有问我关于js的知识，直接问我以前做过什么，有没有经验，我本人不会吹牛，简历也没怎么包装，就是自己把自学的知识和做的几个小demo弄在上面，也用github挂在页面上了，不过他根本不点开看，也不问，问我会不会vue，我当时对框架还不了解，他就说他们需要能直接上手开始写的，所以我第一个就直接挂了。
第二次面试是一个国企，这个问了很多问题，都很基础，js数据类型，数组操作，事件，大概就是高程的前面几章看看就差不多都能答到，然后因为他们主要用jq，所以问了很多jq的操作，关于节点的，动画的，我看锋利的jq大概看了3遍，也练过多次，所以我答的很熟。然后问了些布局方面的，bootstrap我了解过，又看过css3，所以这方面也没啥问题，最后在现场做了个题目，主要就是布局然后通过ajax呈现数据。后面听介绍我面试的说面试官比较满意，说我jq很熟，一面就过了。可惜后面电话面试不知怎么回事可能表现的不够自信，虽然没问技术，但是我没啥自信，把没项目经验什么的也不知怎么就一五一十交代了，估计因为这个挂掉了。
第三次没问问题，直接就是一套题开做，我在那做了一个多小时。题目就是按照要求一步一步做一个页面出来，我也搞忘了我当时卡在哪个地方了，坐在那得时候就是做不出来，没有设计图，要根据他的描述自己找个设计图然后做，我第一次遇到这个有点懵，虽然当时没做出来，不过回来我自己花了几个小时把它做了。所以这个也是凉了。
第四个问的比较多，数据类型，数组操作，跨域，ajax，闭包，原型链，继承，深拷贝，浅拷贝，模块amd cmd，基本都是问的js。然后问了html5的新特性 css3 的新特性，遇到过什么浏览器的兼容性问题，怎么解决的，以后想往什么方面发展。这个时候我已经会点vue了，照着做了个小demo，不过后来知道公司用的angularjs，面试官也没看我做的，问也没问。。以前听网上说要带上自己的项目去面试感觉没起多大效果。
最后总结下如果面的比较初级的岗位，应该主要问js，原型链，继承，闭包，深浅拷贝，ajax，跨域，然后js的基础知识，对了还有apply和call也问了，html5的新特性了解下就行。主要就是看你js掌握的程度，如果稍微要求高一点的，暂时还没面过，等以后面过在来回答
1. cookie session 的用途和区别，以及有效期
1、cookie数据存放在客户的浏览器上，session数据放在服务器上。
2、cookie不是很安全，别人可以分析存放在本地的COOKIE并进行COOKIE欺骗
考虑到安全应当使用session。
3、session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能
考虑到减轻服务器性能方面，应当使用COOKIE。
4、单个cookie保存的数据不能超过4K，很多浏览器都限制一个站点最多保存20个cookie。
2. vue的数据绑定原理，mvvm与mvc的区别
MVVM：
m:model数据模型层 v:view视图层 vm:ViewModel
vue中采用的是mvvm模式，这是从mvc衍生过来的
MVVM让视图与viewmodel直接的关系特别的紧密，就是为了解决mvc反馈不及时的问题
图片说明一下：
说到MVVM就要说一下双向绑定和数据劫持的原理，
MVC：
m:model数据模型层 v:view视图层 c:controller控制器
原理： c层需要控制model层的数据在view层进行显示
MVC两种方式，图片说明：
总结：
mvvm与mvc最大的区别：
MVVM实现了view与model的自动同步，也就是model属性改变的时候， 我们不需要再自己手动操作dom元素去改变view的显示，而是改变属性后该属性对应的view层会自动改变。
不懂得可以复制链接查看：
https://www.pianshen.com/article/3716256399/
3. storage 的区别 sessionStorage localStorage
localStorage 的生命周期是永久性的。假若使用localStorage存储数据，即使关闭浏览器，也不会让数据消失，除非主动的去删除数据，使用的方法如上所示。localStorage有length属性
sessionStorage 的生命周期是在浏览器关闭前。也就是说，在整个浏览器未关闭前，其数据一直都是存在的。sessionStorage也有length属性，其基本的判断和使用方法和localStorage的使用是一致的
有一个文本框 通过v-bind绑定了value属性 值为myname 是我们在vue实例中定义的属性
传统我们获取文本框值方法 可能通过getElementById找到文本框 然后获取其value属性
但是vue中直接通过v-bind绑定了value属性 所以不需要像之前那样获取值
所以在后面的按钮中获取name值 直接获取vue实例对象data里面的myname属性即可
【数据为尊 ----数据映射到浏览器 如果数据v-model后修改（肯定input）然后到数据在有数据映射到浏览器页面 ----映射关系统称】
缓存路由组件
使用的是vue的一个组件，参考vue的官方文档
使用这个东西可以保证我们在切换组件的时候，原来显示的组件不被销毁
-----【保障组件的数据不会被切换路由而销毁数据】
Home是对应的组件对象的名字，不是路由的名字
6.多维数组拍平
数组拍平也称数组扁平化，就是将数组里面的数组打开，最后合并为一个数组
一红六种方法吧……
了解的请看： https://www.cnblogs.com/guan-shan/p/10165737.html
7.跨域的原因 解决方案
跨域是指一个域下的文档或脚本试图去请求另一个域下的资源，这里跨域是广义的。
这样就可以说同源策略----协议---端口---域名
原生的src和href可以解决跨域
代理可以解决
请求头也可以携带浏览器提示的也可以解决
一般都是后端解决跨域问题
【别的需要了解看下方链接】
https://blog.csdn.net/qq_41604383/article/details/100770100
8.uniApp兼容问题§ 如果你使用cli创建项目（即项目根目录是package.json），不管用什么ide，即便是用HBuilderX，切记cli项目的编译器是在项目下的，HBuilderX不管怎么升级都不会影响编译器版本。你需要手动npm update来升级编译器。以及如果你想要安装less、scss等预编译器，也需要自己npm安装在项目下，而不是在HBuilderX的插件管理里安装。
§ 如果你使用离线打包，请注意HBuilderX升级后，真机运行基座和云打包对应引擎跟随HBuilderX升级，而你的sdk需要手动升级。sdk的版本升级一般滞后HBuilderX正式版升级一两天。
§ 如果你使用自定义基座，之前制作的自定义基座是不会跟随HBuilderX升级的，升级HBuilderX后你应该重新制作新版自定义基座。
§ 如果你使用wgt升级，新版HBuilderX编译的wgt，运行到之前的runtime上，一定要先测试好，看有没有兼容性问题。如果有问题，就不要wgt升级，整包升级。
§ 考虑到向下兼容，uni-app编译器在升级为新的自定义组件模式后，同时保留了对老编译模式的向下兼容。
在HBuilderX alpha版中，App端一定会使用新编译器，不理会manifest配置。
在HBuilderX 正式版中，新创建的项目会使用新编译器，老项目不会强制使用，而是开发者自己在manifest里配置开启。
§ 如果你使用其他ide开发uni-app，会经常因为拼错单词而运行失败，因为经过webpack编译一道，很多错误反应的不够直观，排错时间很长，不如从开始就依赖有良好提示的HBuilderX，避免敲错单词。
§ 云打包的引擎版本说明
HBuilderX Alpha，只有1套云打包机，不管你的HBuilderX alpha版本多少，对应的打包机一定是最新的alpha版的客户端引擎。
HBuilderX正式版，有2套打包机，一个是最新正式版，一个是次新正式版。
中间的紧急更新版本没有独立打包机。
举个例子：
HBuilderX 有1.8.0、1.8.1、1.8.2、1.9.0、1.9.1这几个正式版。
那么当前可用的打包机有1.9.1和1.8.2这2台。（即每个大版本的最后一个版本）
除了这2个HBuilderX版本外，其他版本的云打包都指向最新的1.9.1版对应的打包机。（即只保留2个大版本的云打包机）
【详情请看】
https://ask.dcloud.net.cn/article/35845
一、HTML
HTML书写规范
H5新增标签
HTML渲染过程
二、CSS
css盒子模型概念
css弹性布局概念
三、JavaScript
事件模型
DOM2级事件模型
闭包
原型链
四、移动Web开发
常见的布局方案
移动端前端常见的触摸相关事件touch、tap、swipe等整理
移动端前端手势事件
移动端页面渲染优化
GPU渲染
GPU核心渲染过程
五、调试
常用的调试工具
Chrome控制台调试js使用
移动端测试
六、HTTP网络知识
常见的HTTP状态码
不同请求类型的区别
WEB缓存方案
——————————
牛客网（www.nowcoder.com）
- 专业IT笔试面试备考平台
- 最全C++JAVA前端等互联网技术求职题库
- 全面提升IT编程能力
- 程序员交友圣地
分享了一些Web前端的面试题，限时一小时，你看看自己能够答出多少道！
放心，这些面试题都是一些非常基础的知识，只要你在平时认真听课、学习了，那么这些面试题肯定不会难道你。
建议：虽然没有人监督你，但还是希望你不要去寻找答案，脱离网络，拿起纸笔，你试一下自己究竟能够答出个什么水平！有没有真本领？答案尽在这些面试题里！那么，你准备好了吗？OK！计时开始！
一、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、如何居中p？如何居中一个浮动元素？如何让绝对定位的p居中？
06、display有哪些值？说明他们的作用。
07、position的值relative和absolute定位原点是？
08、CSS3有哪些新特性？
09、请解释一下CSS3的Flexbox(弹性盒布局模型),以及适用场景？
10、用纯CSS创建一个三角形的原理是什么？
三、Java类的题目
01、介绍Java的基本数据类型。
02、说说写Java的基本规范？
03、Java原型，原型链？有什么特点？
04、Java有几种类型的值？(堆：原始数据类型和栈：引用数据类型)，你能画一下他们的内存图吗？
05、Java如何实现继承？
06、Java创建对象的几种方式？
07、Java作用链域？
08、谈谈This对象的理解。
09、eval是做什么的？
10、什么是window对象？什么是document对象？
OK，一小时到了，这个时间可不算短了，那么这些面试题你答出了几道呢？你写的答案正确了吗？现在你可以去翻看答案了。
如果你答出了绝大多数的或者是全部的题，并且答案也正确了，那么恭喜你……
你这时心里是不是有点小窃喜，认为自己有能力拿高薪了？虽然我也很想这么告诉你，但事实上这只能表明你的基础扎实，毕竟这只是一些非常基础的面试题。骚年~继续努力吧！
如果你只答出了小部分或者答出了大部分题但答案不正确，那么我只想说：“骚年，你的水平还差的远呢。”连这么基础的题你都打不出来，还想拿高薪？回去再练一段时间吧！
扎实的基础是你拿高薪的重要武器，如果你连基础都不扎实，那么想要攻克“高薪”这个厚实的堡垒，那只是痴人说梦罢了。
1.前端框架类问题，问你会不会用vue react啊
2.语言类，问你一些JavaScript语言的问题
3.项目经验，让你讲讲做过的项目，遇到的问题和解决之道
B. Web前端新手应该注意的常见错误有哪些
今天小编要跟大家分享的文章是昌亮关于Web前端新手应该注意的常见错误有哪些?Web全栈是目前比较流行的语言，因为前端较其他语言相比，简单好学，而且现在的互联网公司几乎缺少不了Web前端开发，行业的需求致使大量的人转型前端，对于刚学前端的人来讲，他们缺乏开发经验，在项目开发中容易出错，为了使大家少走弯路，综合一批前端程序员，收集了一些最常见的错误，下面我们一起来看一看吧，希望能够对大家有所帮助。
一、JQuery选择器
在一个HTMLDOM
树中，进行一个比较复杂的元素选择，不包含某些文字的带有某某类名的元素的邻居的父元素的然后怎么做?写一个很复杂的jQuery选择器?打住。
jquery选择器原理是用正则表达式去分解你的选择器字符串(这一部分叫做Sizzle)，然后再用内置的一些遍历函数如prev,next等(其实这些函数也是基于DOM提供的方法)，去找到你想要的元素。
我会不去盲目地进行Sizzle的语义歧义测试，而是自己根据自己的逻辑去用prev,next等去找到自己的元素;而且退一万步来说，我也会尽量避免使用复杂的选择器(之前的方案也有提及)，单位个元素用ID，多个元素用类，绝对高效准确。
二、基础数据结构与算法
现在有两个不同的JSON，比较复杂，可以参考这里的DEMO中返回的JSON。要比较它们的差异，除了用现成的工具如beyond
compare以外，如果我们的机器上没有安装这个工具，能如何较快解决裂迅胡?
作为一个程序员，一个个对比是不可行的，对比完也不会有什么收获。我会把之放进Excel中(如果你机器连这个都没有，那忽视我)，先排序，再用二分法去快速定位找到有差异的JSON属性，即使是1024个字段的大数据，也最多10次的定位即可找到。
其实算法这东西，并不是给你一道题目然后把死记下来的内容背出来，而是当你遇到相应的情景时，能想到用这个方法去解决。
三、HTTP协议
现在很多项目中都是用ajax去提交JSON到后台了，原始的那种HTTP提交已经比较少见(至少在我的项目中是这样)，但是我们也不能忘记设置form的method、action的原始提交方式，因为这个才是表单提交的原型，有助于我们理解HTTP协议，例如POST和GET的区别，理解数据是怎么样从前端到达后端的，又是怎么样从后端返回到前端。
当你理解了这个，就可以更好地跟后端进行沟通，遇到数据上的问题也能较快地定位解决。
四、javascript作用域
学过好几种的编程语言，作用域问题都是老生常谈了。在javascript中更是有函数的作用域这一基础知识。关于这个，推荐《javascript权威指南》。当时我是把中文的读去再去读英文，把英文的读完去找图解，才感觉到把这一点理解清楚的。
五、HTML/CSSDOCTYPE
曾经项目中遇到这样一个问题，用其他浏览器打开页面是好的，唯独是IE8打开时出奇地慢。我注意到肆拦IE8打开时慢但CPU消耗并不高，只是网页空白很久没渲染出来，可以排除JS算法上的问题。
经过细心研读代码发现，有人把一部分script、link等标签放到了DOCTYPE的前面。
DOCTYPE是用来告诉浏览器解释整个文档的一套法则的，一定要放在HTML部分的最前面，先有script标签，那就意味着浏览器已经开始解释了，后面再有DOCTYPE也是没有意义的了。把DOCTYPE放到HTML部分的最前面，一开始提及的问题就解决了。
以上就是小编今天为大家分享的关于Web前端新手应该注意的常见错误有哪些的文章，希望本篇文章能够对正在从事Web前端工作的小伙伴们有所帮助。想要了解更多Web前端知识记得关注北大青鸟Web培训官网。最后祝愿小伙伴们工作顺利！
C. 前端开发的难点到底在什么地方
一般意义上的前端项目：
-从0到1，治理晒哦为健全点的都能捣鼓出来；
-从1到60，后后端或者设计岗位勉强能兼任；
-从60到80，需要比较专业的前端；
-从80到100，这么好的前端可遇不可求。
从0到1就是从无到有的过程，很多人用WordPress，建站之星就差不多就能搞个demo了，可以拿去骗投资人的钱。
从1到60，就是勉强可用，基本上让后端工程师或者UI设计师找一套bootstrap的模板东拼西凑的也能勉强应付到第一版本上线。
从60到80，就是真正要做一款能完备、性能优良、架构合理的中小规模产品，没有专业的设计、前端、后端、产品、运营是走不到这步的，差不多到A轮了。
从80到100，那就是追求各方面的极致，与竞争对手一较高下，各个方面没有顶尖的人才都会影响整体的战斗力，木桶效应。
解释一下：
1. 核心竞争力的主体是工程经验。
其实这个结论可以推广到其他研发岗位，就是每个研发岗位的知识体系都是由基础学科知识＋领域工程经验构成，彼此不可替代的就是工程经验部分。一个后端工程师一时间不能替代同等级前端工程师到不是基础或者智商的问题，主要是工程经验不足，你让一个前端一个后端分别实现对方领域中一个有明确输入输出的功能函数，二者通过简单学习新语言新语法，加上开发手册查询，一般都能比较正常的实现业务逻辑，但你让他们hold住对方领域的完整项目就很困难了，技术选型，系统设计，模块拆分，平台特性，宿主环境，性能优化，构建部署，系统测试等等都是领域工程经验问题。
2. 工程经验的等级是能cover项目从0发展到80+。
这个很好解释，因为从0-60的非专业前端也能做到，60+的才是专业前端。
所以不用担心核心竞争力问题，60+的前端现在都很抢手啊。工程经验只有60-的话确实压力比较大。
D. web前端工程师工作中遇到难以解决的问题
1）.margin-top,margin-bottom不能正常显示时
一.有时会遇到外层中的子层使用margin-top不管用的情况；这里我们需要在子层的前后加上一个
div{height:0;overflow:hidden;}
例
CSS样式表中：
#box {background-color:#eee;}
#box p {margin-top: 20px;margin-bottom: 20px;text-align:center;}
解决方法：在P标签前后各加2个空的div：<divstyle="height:0;overflow:hidden"></div>
二.网页中头部，中部，底部的居底部有时给个margin-bottom:10px;不管用也是要给个清除属性的.clear{clear:both;font-size:0;line-height:0;}在底部<div id="footer"></div>下加个<div></div>
2）.div层中高度自适应问题
网页前端科技人员在设计网页时不可能知道客户在要他们自己的网站内容页里加多少文字或图片内容
这时我们就不能规定div层的高度，为此应写成min-height:200px;height:auto!important;height:
200px;overflow:visible;这样ie7,ff,ie6浏览器的高度自适应问题就解决了，这些在
http://www.xueshengshu.com/网站中用到最多了。
3）.div层中子层的居底部对齐问题
div中的定位问题有很多也很麻烦，但弄懂了就OK了，在一个大的div层中如何让子层的内容居底部
对齐就涉及到了position定位问题；
例
div层#box{position:relative;border:1px solidred;width:600px;hegiht:400px;}
div子层#box .wrap{position:absolute;bottom:0;border:1px dashedblue;width:200px;height:
100px},最近写的网站中http://www.msgc.net.cn/就用到了
4）.div层中清除clear属性的一小部分应用
在div中一个大的层里面有很多子层，若是加上边框在ie7、ie6中或许会正常显示，但是在ff中可能
只会成一条线了，此时在最外层的后面加上<div style="clear:both"></div>或者设 .wrapfix:after{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}后在每个浮动外框调用wrapfix；http://www.xueshengshu.com学生书网里用到最多了。
5）.解决IE8下div移位、错位等兼容性问题
在<head>标签后面的第一句话加上<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />就OK了
6）.单行文字居中与字体样式问题
在div中一个层中只有一行文字，要让这层中的文字居中，可设line-height的高度和层的高度一样，注意这一层中的文字不能换行，此外，设了line-height时再给定字体样式font:bold 14px "宋体";这时要把font:bold 14px "宋体";放在line-height的前面，否则字体样式不显示文字也不居中；或者将font:bold 14px "宋体";改成font-size:16px;font-weight:bold;font-family:"宋体";就OK了。
7）.鼠标滑上去的特殊效果
往往为了达到显眼的效果，我们会写到一些好看的效果，方法一在样式表中写：ul li a{border:1px solid red;}ul li a:hoverimg{filter:alpha(opacity=40在ul标签中调用即可方法二：在样式表中写上：.hover img{filter:alpha(opacity=40);}在div中调用onmouseover="this.className='hover'"onmouseout="this.className=this.classtype"即可
8）.IE6中高度不对问题
今天在div中给定了高度为1px,其它浏览器显示正常，可是ie6中显示的高度就不对了，这时我给样式表中加了个font-size:0px;line-height:0px;就好了
9）.ul在外框里margin-top不起作用的问题
在div大框子里用了ul作导航的时候为了合ul层居中显示，设ul的样式表为margin-top:-15px不起作用了，此时应该将div大框设定高度后给个line-height与height一样的高度，ul层就自动居中了。
例如http://www.hopes-home.cn/main.aspx
10）.ff中margin-top有时不起作用的问题
今天头晕脑涨的把这问题给解决了，这几天写标网都有累似问题，可是一直都是换个写法解决的，今天的这个办法也不只可行试试还是可以的，在一个div外框层中给个宽度例如，#div_wrap{width:280px;height:100%;}
其次在这个框子里设一个.div_top{widh:100%;font:bold12px "宋体";height:24px;line-height:24px;}
.div_center{border:1px solid#dbdbdb;border-top:none;background:#fff;min-height:460px !important;height:auto!important;height:460px;overflow:visible;}
最后在这个div_center里套个ul li时经常会在ff中出问题，也就是在div_top与div_center中莫名的多了几个像素的空格，这时给ul样式表设个display:inline-table即可；
E. web前端开发常遇到的问题有哪些
前端和后端没有可比性
前端的开发，如果没有总体的设计思路，会成为一种碎片似地程序，一个效果一坨代码，一个功能一滩脚本，一个需求片逻辑，我曾经遇到过，因为ue调整，把整个前端的代码除了核心数据处理函数保留，其余的全部修改的情况。基本上前端的开发，处于dom操作，数据处理，数据交互三部分，如果合理的分配这三部分的功能，那么前端的代码就很容易扩展和调整。可惜现在优秀的前端开发者很少，因为前端门槛很低。
那么接下来我回答挑战所在：真正的前端开发的挑战，还在于开发者的思路，兼容性，布局，css js都不是问题，问题在于如何合理的组织语言逻辑，如果正确抽象出需求中的模块，在如何用代码处理。清楚的用代码表达出思路，清楚的写好注释，给后续维护者一个可阅读的思路。
前端的改动量，是后端的数倍，前端没有绝对，只有跟随需求不停的修改。
F. 前端开发过程中遇到过什么困难
前端开发过程中遇到的困难还是很多
1、面试中前端开发过程中遇到的困难这个问题主要是相看面试者是不是有独立解决问题的能力及解决问题的方案以及工作中的的一些两点
2、遇到这样的问题可以说出一个自己解决的比较完美的问题，如：vue不适合做cms，因为单页面应用对seo很不友好，解决的方法就是：我们使用nuxt技术，在保证使用vue语法开发的同时，也使用了服务端渲染技术保证了seo效果，这个过程突出了自己的学习nuxt等新技术的能力
3、另外也是有很多实际的开发问题不好解决，的但是那些自己解决不好的问题不适合 在面试的过程中说的
G. web前端工程师工作中,遇到难以解决的问题有哪些
有时会遇到外层中的子层使用margin-top不管用等情况
H. 前端开发遇到的问题与怎么解决的
前端和后端没有可比性
前端的开发，如果没有总体的设计思路，会成为一种碎片似地程序，一个效果一坨代码，一个功能一滩脚本，一个需求片逻辑，我曾经遇到过，因为ue调整，把整个前端的代码除了核心数据处理函数保留，其余的全部修改的情况。
基本上前端的开发，处于dom操作，数据处理，数据交互三部分，如果合理的分配这三部分的功能，那么前端的代码就很容易扩展和调整。可惜现在优秀的前端开发者很少，因为前端门槛很低。
那么接下来我回答挑战所在：真正的前端开发的挑战，还在于开发者的思路，兼容性，布局，css
js都不是问题，问题在于如何合理的组织语言逻辑，如果正确抽象出需求中的模块，在如何用代码处理。清楚的用代码表达出思路，清楚的写好注释，给后续维护者一个可阅读的思路。
前端的改动量，是后端的数倍，前端没有绝对，只有跟随需求不停的修改。
I. 前端遇到了瓶颈期怎么办
工作上遇到瓶颈期怎么办?
1、要有积极的心态
事业成功的人往往耐得住寂寞，在那些枯燥乏味的工作中，寻找快乐，他们都是善于自我控制的人，可以让时间听从自己的安排。对于我们平时不愿意又不得不去做的事情，我们改变策略，立马行动。这样做，不仅可以完成部分的工作，还少了产生抱怨的想法和发泄情绪而浪费的时间。没有积极进取的心态很容易进入舒适圈，让自己的发展受到局限；而有了积极进取的心态，在新的领域中可以学到更多知识，开拓思维和视野，从而增强自身的综合能力。
2、立刻、马上，时间管理法
一个简单的事情，不要拖到下一个小时完成。很多事情，往往不是因为难，让我们不敢去做，而是因为我们不敢做才显得很难。跨出那一步就有希望成功，不敢去尝试连一点希望都没有！绝不要给自己一个理由，说服自己把工作交给下一个小时。永远以“现在”这两个字来想问题，做个“我现在就要开始工作”的人，哪怕只是拿起电话，和客户说说你刚才想到的那个创意，让他觉得你是一个主动的热情的服务者。工作在此时此刻，是让我们保持战斗欲望的行动力。
3、设定目标和奖励措施
以前我们常常说，没有压力就没有动力。我一直觉得这句话是错的，应该是没有奖励就没有动力。压力有什么用，无非是我们在压力之后，产生反弹后带给我们的盈利。我们拼命工作，不就是为了离自己理想更近些吗？每隔一段时间就给自己制订一个目标，大的像买一辆自己喜欢的新车，小的如买一套今秋的流行格呢套装，有时候，好的奖励措施会让人产生最好的动力，当你的目标得以实现的时候，千万不要忘记，好好犒劳自己。
4、抓紧时间，开门见山
当下一个任务下来时，你可以召集大家开一个小会，你需要做的也许就是找出一点空余时间，把自己对任务的理解面对面、最大限度地传递给合作者。让大家都有时间去处理每个人手上的要完成的工作，又能及时地沟通，随时调整彼此支持力度的侧重点。此外，拐弯抹角或耐人寻味的提问方式虽然可以使人觉得你含蓄和温和，但它的反面代价也是巨大的。
5、充电培训学习
当你在一个岗位上做了三年以上，却没有什么进步和提升，除了考虑公司机会的因素外，就是考虑自己的知识结构能否适应公司的发展，停下来给自己充充电，或者业余时间参加一些学习班，现在网络很发达，学习的形式也很多，要不了多久，你对你职业的认识就会不一样。
6、主动出击寻找出路
对于已经积累了相当丰富的工作经验，由于自己在原公司已经找不到再次提升的空间，遭遇职场瓶颈，那么不妨勇敢地迈出跳槽这一步。不要把自己局限在一家企业，而要放在一个行业里，就会有长久的发展。想往上走的想法是好的，但是不能意气用事，必须了解客观环境，只有结合自身情况，整合自身当前的个人竞争力，结合职场的岗位要求和自己的工作适应度找到一个能够切入且适合自己发展的道路，再针对性的进行调整，这样才会顺利度过瓶颈期，进入新的更广阔的职业发展空间。
7、充分利用公司这个平台，建立起自己的职场社交圈
在当下这个社会，请抛弃掉靠自己的努力和奋斗就能在职场上打拼出一片天地的想法，必须有自己的关系网和人脉圈。
8、尝试一下有选择性的跳槽
通过跳槽突破自己的职业瓶颈期是很多人的第一选择，小编不建议首先虑这个方法，要综合考虑三个因素：一是专业内跳槽；二是专业内突破，比如你现在技术主管，向技术经理跳；三是通过学习和培训掌握新的技能后，跳到新的相关岗位上发展。
9、到外面看一看，估一估
尝试着投几份简历，到外面的公司看一看自己现在身价，估一估自己的潜力，很多的机会就是这样得来的，虽然有脚踩两只船之嫌疑，但为了自己的前途还是试试吧。
10、退是为了更好的进，下一线再温温习
你的晋升一直受阻，或许因为你的基础经验不足造成的，为了让自己前进的更快一点，不妨以退为进，要求再下一线，增加点一线的经验说不定会更好呢？
【点】【击】【下】【方】【链】【接】【可】【以】【获】【得】【资】【料】
网页链接
J. 前端开发的难点到底在什么地方
不同级别的前端面临的难点各不相同，不可一概而论；
业务开发的前端难点在于对业务的理解和把控能力；
平台开发的前端难点在于产品化的把控和推进能力。
观点1：不同级别的前端面临的难点各不相同，不可一概而论。
其他回答有说 CSS 难，有说 CSS 不难的，每个人水平不同，这样争论毫无意义。我刚学前端时觉得 JS/CSS/浏览器兼容问题都很难，现在觉得也就那样，因为前端路子广，办法总比问题多。后来觉得要评估好需求，把控好项目质量比较难，很多时候我们是在干事，在解决问题，不是只埋头写代码，时间一长你会发现前端工作中，技术问题往往比较好解决，反而资源+协作问题比较麻烦。现在对我来说比较难的是快速产品化的能力，如何从无到有去做出一些有价值的东西。
举一个简单粗暴的例子吧：阿里前端很多，P5/P6 一大把，但是 P8/P9 的非常少，为什么？进阶的难点在哪里？
前端开发的难点跟前端进阶的难点是非常相似的。阿里对每个前端层级都有一个标准，这也从侧面回答了这个问题，比如对 P5 来说，难点可能是写好业务代码，保证其灵活性和可维护性，能解决各种适配问题；对 P6 来说则需要独挡一面，能独立 owner 需求，而 P7 则需要在某方面技术有深入理解，等等。
能提出这个问题首先得恭喜题主，说明题主在当前阶段遇到瓶颈了，需要向下一个 level 出击了。
观点2：业务开发的前端难点在于对业务的理解和把控能力。
业务逻辑开发本身并不是难点，谁都可以写。但是对于你自己负责的这块业务，后续业务的发展方向和潜力，你有去了解过吗？当业务方提需求过来时你是只负责执行还是和业务方一起探讨更合理的方案？你有没有给自己负责的产品提过一些建议？做过一些改善措施？如果前端只是作为一个执行者，作为一种被调度的资源，那么即使最终项目取得了好的成绩，跟你有多大关系？你自己会有多大的成就感？
另外一个很重要的点：就是对业务的把控能力。业务方总是会催着上线，开发时间不断被压缩该怎么办？进度不如预期怎么办？开发遇到瓶颈怎么办？发布新功能翻车了怎么办？
我见过有默默加班保证进度的，也有跟需求方重新谈延期的，有发布出问题手足无措的，也有自己默默修复的，有遇到瓶颈一筹莫展的，也有及时跟老板沟通，跟业务方撕逼的… 如何优雅的处理这些问题，有时候比写代码更难。为什么有的人业务代码逻辑混乱，写的一团糟？我不相信是智力问题，反倒更相信是对项目本身没有把控好，本来排了5天工作量的需求被业务方压到了3天，你还能保证写出健壮而不失风度的代码？
观点3：平台开发的前端难点在于产品化的把控和推进能力。
做业务时有人给你提需求，帮你出交互视觉稿，你只要负责写页面就行了。但是在支付宝前端，很多内部平台和技术产品都是技术自己主导，你需要自己发现问题，出方案，设计数据库，自己出页面，这是一个从无到有的创造的过程。并且要保证你做的东西是真正解决问题的，而不是做一些自己觉得很牛逼实际上并没有解决用户痛点的东西，用我老板的话说就是对产品的把控能力，不要跑偏了。前端是最容易做出产品化东西的工程师了，因为后端不会做 UI，UI 不会写代码，唯前端兼顾，这是最大优势。
再一个就是对产品的推进能力了，你做的东西可能需要各种资源？如何争取？可能牵扯到多方利益？如何权衡？东西做出来了如何推广?如何在用户的一片骂声中奋勇前进？
印象中很多平台型产品，刚开始投入使用时都是一片骂声，各种问题，说实话负责这些产品的程序员压力是相当大的，天天被骂还得彻夜帮别人解决问题，还得不断优化系统，你说难不难？
以上三点就是本文所展现的理念，希望能对大家有帮助。