网络13116赵钦 毕业论文《web前端的发展》

毕业论文Web前端的发展学院：计算机与通信工程学院专业：网络施工与管理班级：网络131学号：16姓名：赵钦指导教师：王瑞计算机与通信工程学院2016年5月黑龙江建筑职业技术学院毕业论文1Web前端的发展摘要随着互联网的迅猛发展和普及，一个新型的行业和新兴的职位正在上升到技术的层面：web前端开发工程师。Web前端表现层及与前后端交互的架构设计和开发配合后台开发人员实现产品界面和功能利用各种Web技术模拟开发产品原型Web新技术调研和资讯整理，精通HTML/XHTML、CSS，熟悉页面架构和布局，对Web标准和标签语义化有深入理解。熟悉Ajax、JavaScript、DOM等前端技术，掌握面向对象编程思想。Web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/Flash等各种Web技术进行客户端产品的开发。完成客户端程序（也就是浏览器端）的开发，开发JavaScript，同时结合后台开发技术模拟整体效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。关键字：模块化技术调研产品还原。黑龙江建筑职业技术学院毕业论文2AbstractWiththerapiddevelopmentandpopularizationoftheInternet,anewtypeofindustryandemergingpositionsarerisingtothelevelofTechnology:Webfront-enddevelopmentengineer.Webfrontendperformancelayerandbeforeandaftertheendoftheinteractionwiththearchitecturedesignanddevelopmentwiththebackenddeveloperproductinterfaceandfunctionstoachievethesimulationofproductdevelopmentprototypewebtechnologyresearchandorganizeinformationusingavarietyofwebtechnology,proficientinHTML/XHTML,CSS,familiarwiththestructureandlayoutofthepage,thesemanticwebstandardsandlabelshavein-depthunderstanding.FamiliarwithAjax,JavaScript,DOMandotherfront-endtechnology,tograsptheideaofobject-orientedprogrammingWebfront-enddevelopmentengineer,themainresponsibilityistouse(X)HTML/CSS/JavaScript/FlashandotherWebtechnologyforclientproductdevelopment.Completeclientprogram(isbrowser)development.ThedevelopmentofJavaScript,combinedwiththebackgroundtodeveloptechnologytosimulatethewholeeffect,richInternetwebdevelopment,workingthroughtechnologytoimprovetheuserexperience.黑龙江建筑职业技术学院毕业论文3Keywords:modulartechnologyresearchproductreduction.黑龙江建筑职业技术学院毕业论文4目录第一章绪论……………………………………………………5第二章Web前端发展的目的及意义…………………………62.1.1对于前端的开发工具了解所述……………………62.1.2对于前端的开发工具了解所述……………………72.2.1我们是否需要使用库和框架等……………………7第三章原生代码的关键性……………………………………8第四章移动端的发展…………………………………………11第五章关于APP………………………………………………12结论…………………………………………………………………15致谢…………………………………………………………………20参考文献……………………………………………………………21黑龙江建筑职业技术学院毕业论文5第一章绪论1.1web前端的发展在计算机的茫茫码海中，技术在不断地更新，我们在不断地完善着计算机世界，在众多技术中，各个新兴技术不断崛起，对于web前端正是如此，不在只限于作图PS，而是可以通过代码技术来完成开发页面，因此前端也就不只局限于美工，一个好的前端完全可以根据设计师的PSD图，百分百还原设计稿，来用代码完成页面展示，又有各种奇幻的效果来增加了前端在互联网行业的进一步发展。由于现在手机的高速发展，前端可以通过HTML5与CSS3技术来完成绚丽的效果与现在智能手机的页面。已经从最早的切图前端发展到了技术（代码）前端，然而技术前段又分很多个技术。1.1.1对于前端技术的概论前端分为很多种技术，有用来完成静态页面的HTML与CSS，又有JavaScript来成静态页面的动态效果，又通过AJAX来完成后台与前台的交互，又分为MVC等模块化管理，因为时代的更新浏览器的发展，每一个浏览器的内核不同，对于代码的兼容性问题又有很多问题，所以一个专业的前端，会完成浏览器的兼容性处理来实现适用于各大浏览器，对于现在技术的发展又有很多帮助前端人员来开发的库、框架、插件等，比如说现在前端人员广泛流传的JQuery的库，angularJS框架，swiper框架，还有很多辅助框架等，由于公司要求的高效率所以导致很多人已经把原生代码给遗忘，这是我感觉悲伤的地方。静态页面的效果，其实很多做前端的人不屑于写静态的页面，可能是因为感觉静态页面简单，其实不然，我们可以通过很多例子来发现静态页面其实不简单，比如说我们需要考虑到很多地方，为后期交互做考虑，后台来运行代码，和动态页面的完成，需要考虑的地方很多，还有语义化等基础的理论与知识，我需黑龙江建筑职业技术学院毕业论文6要用少量的标签来完成简单的布局与样式，如果前期静态页面写的不够标准的话对后期JS等程序有一定的影响，或是导致布局错乱动态页面的完成，需要很多逻辑性代码来完成，语义化符合逻辑这些都是写JS需要考虑到的，比如一个小小的循环（遍历）对其了解，比如说其中循环的一个变量，双次利用，造成循环的BUG，或是死循环等，又可以通过this等面向对象写法来完成，对于前端来说需要学习的还是比较多的。1.1.2前端如何持续发展作为现在前端的崛起，很多程序员工程师，已经选择了很多快速开发工具，比如说库类，框架类，插件类，虽然说用上这些比较方便快些，比如拿库来说，的确方便快捷就像JQ来说，调用函数，获取函数等，完全可以用一个$符完成，写事件也比较方便，点击事件的话原生JS代码会需要obj.onclick=function(){}这样来写，对于JQ来说的话便是方便了很多$(‘id’).click{}这样就完成了点击事件，虽然说方便快捷，但是对于新手来说的话，没有一个良好的JS基础，只会JQ这类的库的话，就像一个没有内力的侠客，没有其真正拿出手的东西，因为JQ等的库也使用原生JS来写的，所以其价值你应该已经了解了。第二章Web前端发展的目的及意义2.1.1对于前端的开发工具了解所述上面已经提到了JQ等辅助程序员开发库的利弊，下面我们来讲讲关于框架的一些利弊，简单说框架的话字面意思就能发现，他是类似一个模具，比方说建筑工人砌墙的话他会用线来搭建出所需要的框架，来限制搭建上的失误位置偏移等，所以现在也应该理解框架是一个怎么样的一个开发工具，对，没错，他是一个限制程序员开发的东西，你所需要编写的程序要根据他定义好的内容来写，虽然他大大的限制了程序员的开发，但是还是犹如主题一样，他是一个有利有弊的一个东西，对于框架来说，他省掉了跟多布局上的一些规矩，又可以与后台配合，完全是一个后台类的前端工具，而且每一个框架的功能不一比如说angularJS使用了不同的方法，它尝试去补足HTML本身在构建应用方面的缺陷。AngularJS黑龙江建筑职业技术学院毕业论文7通过使用我们称为指令(directives)的结构，让浏览器能够识别新的语法。例如：使用双大括号{{}}语法进行数据绑定；使用DOM控制结构来实现迭代或者隐藏DOM片段；支持表单和表单的验证；能将逻辑代码关联到相关的DOM元素上；能将HTML分组成可重用的组件。所以框架也是看属不属于适不适合开发人员来使用。2.1.2对于前端的开发工具了解所述经过对于库和框架的初步了解，所以我们再来讲讲插件的利与弊，对于插件怎么说呢，她就像一个装饰品，用的好的话，完美无瑕，用的不好的话真是丑态百出啊，插件顾名思义，一个完美的东西来继续装饰他展示出另一功能，我们就拿一个插件来说说swiper这个是一个轮播图（幻灯片）的插件，对于开发人员来说轮播图可以说是一个让人认非常上火的东西，他不是很难但是很烦，所以就有人写了这个插件，以后需要些轮播图的时候他就会拿出来用，swiper里面各种各样的轮播图，任何功能都能完成，但是不是自己写的东西拿过来用你懂的，他会出现很多问题，哪一个最实际的例子来说，我前两天写过某汽车的官网，里面有一个功能就是从后台来获取数据，在布局的时候当然会考虑到他不是一个轮播，而是很多个而且还不定量是几个，本来我为了方便就打算用swiper这个插件，但是客户的需求的原因出现了问题，因为客户需要它显示隐藏，和个问题当然很简单的解决掉了在swiper里面也写了关于怎么解决掉显示隐藏后的问题，但是新的问题出现了，因为所有的轮播没有办法定义数量所以都是创建出来的，这对swiper来说就会出现一个问题，插件失效，显示隐藏后他的数据没办法初始化，然而这个初始化只对第一个创建出来的有效果，最后没有办法只能自己写轮播图了因为是自己写的原生所以没有任何问题。而且一个页面里面引入的插件过多的话会相当卡。通过这个问题来看，插件总会有一些项目需求完成不了的功能，这也就是没有最好的插件框架，没有任何一种语言或是框架，只有适不适合的语言，因为时代不停地变迁，计算机的程序也在不断更新加强完善。2.2.1我们是否需要使用库和框架等黑龙江建筑职业技术学院毕业论文8对于这个问题我是这样理解的，库和框架等，已经很明显了，就是辅助程序员开发的工具，当然要用，但是需要找到合适的来用，不是盲目的用，对于工作中的程序员，需要的是高效开发，这也是大多数公司注重的，使用框架之类的，对于开发效率来说的确是很合适，但是怎么说呢，有得公司也需要用各种框架，其实万变不离其宗原生JS玩的好的话，对于任何框架插件使用起来学习起来都是很轻松的，因为他们都是基于原生JS来写出来的，我们回到主题，建议使用框架等，但是我们不应该吧主要学习的东西放在他们上边，因为这些东西，都在不断地更新，不断地提高版本，但是JS不会一直更新，只有用JS写的软件在不断更新，可想而知，JS的重要性于主导作用了，每当一个辅助插件更新内容后，就要不断地跟着他来学习，像框架这类的你永远都不可能学完，如果原生代码学的精通后，完全可以自己来写插件框架库之类的，这就是区别，建议使用开发工具，但是不建议以他们为主，术业有专攻，为何不学精其之本之根呢？第三章原生代码的关键性3.1.1原生代码的关键性话不多说，对于很多人来说，的确原生代码比JQ的库难，其实只不过是难在原生比较繁琐，比喻一个获取对象varobj=document.getElementsByTagName('class'),然而JQ呢？很简单一个$符号搞定，想获取谁就$（‘class’）那个就可以了，因此很多人已经用JQ取代了原生，可是原生代码真的可以被取代么?答案是不可