前端的认识和理解

 前端是最贴近用户的程序员，前端的能力就是能让产品从 90分进化到 100 分，甚至更好

b 参与项目，快速高质量完成实现效果图，精确到1px；

c 与团队成员，UI设计，产品经理的沟通；

d 做好的页面结构，页面重构和用户体验；

e 处理hack，兼容、写出优美的代码格式；

f 针对服务器的优化、拥抱最新前端技术。

1、前端页面有哪三层构成，分别是什么？作用是什么？

a 结构层：由 HTML 或 XHTML 之类的标记语言负责创建，仅负责语义的表达。解决了页面“内容是什么”的问题。

b 表示层：由CSS负责创建，解决了页面“如何显示内容”的问题。

c 行为层：由脚本负责。解决了页面上“内容应该如何对事件作出反应”的问题。

2、一次js请求一般情况下有哪些地方会有缓存处理？

a 浏览器端存储

b 浏览器端文件缓存

c >

事情起因是这样子的，有团队做了一款可以直接生成网页的手机APP发布了。某知友就慌乱了，觉得前端工程师会被AI所取代，开始纠结学习前端还是后端。

“手机APP可以直接生成网页，取代了前端工程师的一部分工作，随着APP的进一步开发使用，前端开发的行业空间将更加狭小，是不是就意味着，前端开发正面临着被淘汰的局面？”

前端真的会被取代吗？

答案是否定的。诚然，按照人类现在的发展趋势，未来所有工作都将被AI取代，但是计算机行业肯定也是要在后期才会被取代，优先取代的必然是一些流水线上的固定岗位的重复工作。

很多人会有这种想法，有以下几个原因：

1、大部分人对于前端工程师的误解

一个转换网页的APP的出现就能引起这么多人的猜测和恐慌，足以说明很多人对于前端开发的认识和了解是不够清晰的。

真正的前端开发并不是傻瓜式的网页生成可以取代的，在这个前端开发快速发展的互联网时代，你还认为前端开发只是切网页的，那你就大错特错了。

来看一则招聘启示：

看岗位职责就知道了，一个APP转换网页怎么可能撼动前端开发整个行业呢？大家真是太小看我们的前端攻城狮的日常了。

总结一下来说，前端工作主要方向是下面三个：

1偏设计和交互方向

重点是设计或交互能力，需要知道页面怎么做好看，怎么更符合用户的使用习惯（用户的需求大多数的是无止境的，无理的，无逻辑的）

设计能力强的后续可以转懂技术的设计!交互能力强的后续可以转产品。

2偏逻辑和架构方向

和后端有些近似了。其实是前后端分离后产物，现在的后端只负责产出数据，那么和页面相关的逻辑转换就需要前端继续实施了，更高级的就需要知道框架的选型以及业务模块的封装。

发展方向就是架构师了，当然也不排除一部分同学直接转成了后端

3偏安全&运维方向

早期的前端代码都是依附于后端进行部署，但是现在cdn，node环境搭建，都需要专门的同学去负责。这个方向比较杂，也比较容易产生大牛，所以crsf攻击、页面响应优化这样的事一般都会放到这块来

下面是我筛选的几个大咖的分析，我觉得还是比较中肯的额，但不完全代表我的看法

专业性的方面分析完了，我们再来看看侧面因素，为何一个看似门外汉提出的问题会有60万人响应呢？这让我陷入深思，行内都知道，2017年开始前端突然崛起，大批大批的IT人员或者非IT人员转行做前端，这60万人中，学艺不精者，心态浮躁者应该占了大部分，那就引出下面第二个观点。

2、行业内大批学艺不精者造成市场饱和假象

由于前端工程师的入门门槛较低，很多人认为HTML、CSS、JavaScript并不是很难掌握的语言，似乎只要花一点时间，无论是谁，都可以通过网上教程或者书本入门。

许多人怀着追求高薪的想法入行，其实也没什么错，但是无法安心学习，浅尝辄止，会一点皮毛便不再深入研究，所以即便有大量的前端工程师涌入，公司对于技术扎实的优秀工程师的需求仍然只增不减。

来看看数据（早先小编还有一篇大数据分析前端技术发展潮流的文章，有意者可以关注阅读）

(以北京为例，截止到2018年3月12日，前端岗位需求两万多。)

(以北京、上海、深圳、广州等一线城市为首,一线城市对于前端攻城狮需求量仍然极大)

整个互联网在不断发展，前端开发技术也在不断进步，前端开发市场会越来越广泛，人才需求当然也不会止步于当前，所以不论现在还是未来，整体市场都不会饱和，只会低端饱和，高端缺人。未来优秀前端开发工程师将成为市场争抢的资源。而淘汰的并不是前端，应该是落后的技术和不合格的开发者。

10 年前的前端工程师熟悉所有 IE6 bug，只要你说得出表象，他就能告诉你这个 bug 叫什么名字、成因是什么、如何能够绕过去同时保持跟其它浏览器兼容。

10年后的现在，这样的技术是显然被淘汰了的。

上图的发言者明显在当下发展最好的几个IT公司工作过，这样的一位大咖为何会被淘汰，他的自我分析也说出来本质问题，这个问题才是所有前端工程师不管新人还是大咖都要认真对待的——迭代能力问题。各大滥竽充数的开发者开始在行业中找不到自己的一席之地，正面分析，前端开发在未来巨大的潜力和优势，反之思考在这巨大的潜力下，就是前端技术日新月异的技术迭代是非常考验程序员的学习新知识的能力的。

3前端开发技术日新月异，那么前端开发攻城狮的未来又在哪里呢？

据蚂蚁金服数据平台，负责数据中台产品研发的前端工程师成曰分析预测：

随着前端技术发展，那些小规模移动App市场被一些巨头把持，小规模App生存空间将越来越小，PC信息导航类网站（网址、购物、论坛、生活）由于移动优先、智能推荐的现状，也同样面临更加狭小的生存空间。

还有一大变化是，大量工作需要前端来做：

日常办公软件（复杂应用，并且慢慢从桌面程序演化为Web）：Office、Email、文档管理、产品设计、项目管理、代码编辑器大数据/AI配套软件（复杂应用，并且慢慢从桌面程序演化为Web）：需要大量的后台系统来做数据分析/机器学习播放器/游戏：H5代替Flash，如Web Audio、Web Video、Canvas容器/DSL/内核/小程序：支付宝/微信/钉钉容器，内核（也就是UC、QQ浏览器内核），及其自定义DSL（如果将来手机的底层能力都可以上浮到小程序，很有想象空间）产品信息展示类网站（炫酷应用）：各种智能设备官网、大企业官网

文末小编总结一段话，概括所有问题。

前端开发近十年都不易被撼动或取代，重要程度逐年增长中，吸金能力亦然。从业者应该注重自身知识巩固和新知识的更新迭代。找准时代发展方向，努力专研，勇于创新能让你走在时代最前头。

box-sizing是css3中引入的新属性。

说到 IE 的 bug，在 IE6以前的版本中，IE对盒模型的解析出现一些问题，跟其它浏览器不同，将 border 与 padding 都包含在 width 之内。而另外一些浏览器则与它相反，是不包括border和padding的。

在我们开发的过程中会发现，有时候，如果对页面中的大区域进行设置时，将border、padding计算到width和height之内，反而更灵活。但W3C的 CSS21规范却规定了他们并不能被包含其中。考虑到这个问题，css3中引入了一个新的属性：box-sizing，它具有“content-box”和”border-box“两个值。

程序员必须要了解的web安全

1简述

互联网本来是安全的，自从有了研究安全的人之后，互联网就变得不安全了。

11什么是安全？

字典的解释是指没有受到威胁、没有危险、危害、损失。

12什么情况下会产生安全问题？

类似我们在机场，火车站里面，乘客开始上车之前，都会有一个必要的程序：安全检查。如果没有安全检查我们就会产生我们所谓的安全问题。在安全检查中我们会检查乘客身上是否携带了打火机，可燃液体等危险物品。

从上面我们看出为什么我们会有安全检查呢？归根结底还是信任问题。因为我们的信任关系被破坏，从而产生了安全问题。

13怎么进行有效的安全评估？

一个安全评估过程，可以简单地划分为4个阶段：资产等级划分，威胁分析，风险分析，确认解决方案。

资产等级划分：明确我们目标是什么，要保护什么。互联网安全的核心问题，其实是数据安全问题。用户的数据也就是我们需要保护的。

威胁分析：找到所有可能造成危害的来源，一般采用头脑风暴列举所有的情况。

风险分析：预估造成的损失大小。

确认解决安全方案：安全评估的产出物，就是确认安全解决方案。解决方案一定要有针对性，这种针对性是由资产等级划分，威胁分析，风险分析，确认解决方案。

2浏览器安全

近年来随着互联网的发展，人们发现浏览器才是互联网最大的入口，绝大多数用户使用互联网的工具是浏览器。因此浏览器市场的竞争也日趋白热化。浏览器安全在这种激烈竞争的环境中被越来越多的人所重视。

21同源策略

浏览器的安全都是以同源为基础，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。

浏览器的同源策略，限制了来自不同源的“document”或脚本，对当前"document"读取或设置某些属性。

这一策略很重要，试想一下如果没有同源策略，可能acom的一段JS脚本，在bcom未曾加载此脚本时，也可以随意涂改bcom的页面。为了不让浏览器的页面行为发生混乱，浏览器提出了“Origin”这一概念，来自不同Origin的对象无法互相干扰。

影响“源”的因素有：host,子域名，端口，协议。

22恶意网址拦截

恶意网址拦截的工作原理很简单，一般都是浏览器周期性地从服务器端获取一份最新的恶意网址黑名单，如果用户上网时访问的网址存在于此黑名单中，浏览器就会d出一个警告页面。

3跨站脚本攻击

跨站脚本攻击(XSS)是客户端脚本安全中的头号大敌。

XSS：跨站脚本攻击，英文名称是Cross Site Script，本来缩写是CSS，为了和层叠样式的CSS有所区别，所以在安全领域叫“XSS”。

31XSS攻击

XSS攻击，通常指黑客通过“HTML注入”篡改可网页，插入了恶意的脚本，从而在用户浏览网页时，控制用户浏览器的一种攻击。举个例子：某个黑客发表了一篇文章其中包含了恶意的JS代码，所有访问这篇文章的人都会执行这段JS代码，这样就完成XSS攻击。

32反射型XSS

反射型XSS只是简单地把用户输入的数据反射给浏览器。也就是说，黑客往往需要引诱用户点击一个而已连接，才能攻击成功

33存储型XSS

存储型会把用户输入的数据“存储”在服务器端。这种XSS具有很强的稳定性。黑客把恶意的脚本保存到用户的服务器端，所以这种攻击就是存储型，理论上来说，它存在的时间是比较长的。

34 XSS的防御

XSS的防御是复杂的。

341 >

以上就是关于前端的认识和理解全部的内容，包括:前端的认识和理解、前端程序员会不会被淘汰、如何让IE6 7 支持css3属性 box-sizing等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！