前端知识体系总结
来源:互联网 发布:表白网站整站源码 编辑:程序博客网 时间:2024/06/16 13:38
前端技术栈
前端基础
以上是前端的基本功,一些HTML5的新特性,新API还有CSS3的一些新特性,以及ES6的新语法也是比较热门的,都有涉及。框架或库
这是前端常用到的库和框架,包括:
- jQuery
- bootstrap
- requireJs
- echarts
- vue
- angularJs
- ionic
- react
- ant-design
- easyui
一些工具
目前用的最多的工具主要时npm模块管理工具,gulp、grunt、webpack等自动化或者模块管理工具。
前端的其他方面
性能与安全
- 从浏览器渲染角度考虑性能(并发下载,阻塞等等)
- 从js执行效率考虑性能
1.避免内存泄漏
2.避免意外全局变量
3.避免蛮力算法
4.减少dom操作 - 考虑跨站点脚本攻击和跨站点伪造(不要相信任何用户输入)
前端延伸
- 借助v8引擎通过nodejs向服务端延伸
- 向桌面应用延伸
前端基础–html5
html5前两年非常火,h5的主要改变有下面几点:
- 新增了一些结构元素,例如header,section,footer等等
- 新增了一些属性,例如contentEditable
- 新增一些表单类型,number,url等
- 废除了一些不那么常用或者可以通过css实现的元素
- 新增了一些好用的接口
- 与存储相关的localStroage、sessionStroage、indexedDB
- 与文件访问相关的FileSystem相关的接口
- cache接口
- canvas
- video、audio
- websocket
- webworker
- 还有新增了一些事件
更多请参考:w3school
前端基础–css3
不得不说css3真的很棒,尤其是他的动画,但是学好也是很难的。css3涉及的东西如下:
- 选择器的扩展
- 一些样式,例如背景、文字、边框等等
- 一些布局相关的东西,例如flex,column等等
- 一些变形,transform
- 过度效果,transition
- 基于关键帧的动画,animation
更多请参考:w3school
前端新知–ES6
ES6看上去怪怪的,不过挺好玩的,我比较喜欢他的函数参数默认值,模块管理,还有promise。参考阮一峰老师的那本书,ES6的要点如下:
- let 和 const 关键字
- 变量的解构赋值
- 字符串的扩展
- 正则的扩展
- 数值的扩展
- 函数的扩展
- 数组的扩展
- 对象的扩展
- Symbol
- Set 和 Map 数据结构
- Proxy
- Reflect
- Promise 对象
- Iterator 和 for…of 循环
- Generator 函数的语法
- Generator 函数的异步应用
- async 函数
- Class 的基本语法
- Class 的继承
- Decorator
- Module 的语法
- Module 的加载实现
给一段ES6的代码(是不是很怪,ps:练习代码块编写)
function bar(func = () => foo) { let foo = 'inner'; console.log(func());}bar() // ReferenceError: foo is not defined
更多请参考:ES6标准入门
前端框架或库–jquery
所有学前端的不可能不知道jquery,个人认为jquery有如下特点:
- 强大的选择器,当然现在通过h5的api也可以实现
- 好用的方法
- 良好的兼容性
- 动画的支持
- 丰富的插件
更多请参考:jqury文档
前端框架或库–bootstrap
有了bootstrap,写几个class就可以做一个漂亮的响应式页面,而且还可以用他的相当好用的js插件。very 弯的four!
更多请参考:bootstrap中文文档
前端框架或库–vue
国内大神尤雨溪经典作品,让我们向这位大神致敬。这款框架非常容易学容易用。她有非常丰富的组件可用,跟angular1长得很像,非常棒!还有一点需要再次强调,国产精品!
更多请参考:vue中文文档
前端框架或库–angular
你走开!angular4!我已经认不得你了。他采用了typescript,具体我也不太了解。后面学习了在更几篇文章。
参考:教程
前端框架或库–ionic
这个我就更不熟了,据说是混合式应用必备利器。我要去学习了!不要拦我!
参考:教程
前端框架或库–echarts
Echarts很牛逼哦!小弟也是刚学的,通过几个简单的配置就可以画出各种图表了,nice!妈妈再也不用担心我不会画图了。
参考:官网
前端框架或库–requirejs
这是一个遵循AMD规范的模块管理库,我不是特熟,我是用的webpack,可以用es6的import export
参考:官网
前端工具简介
工具是干嘛的,帮我们偷懒的。
- grunt是一个任务执行器
- gulp是一个流式的任务执行器
- webpack是一个模块打包工具
个人用的比较多的是webpack。具体可以到各自的官网学习。webpack有个中文版的,文档很好懂。
- 前端知识体系总结
- 自己总结的web前端知识体系
- 前端知识体系——总结
- 前端知识体系
- 前端知识体系目录
- 前端工程师知识体系
- 前端知识体系
- 前端知识体系
- Web前端知识体系
- 前端知识体系
- 资深前端知识体系
- 前端知识体系全部
- 前端知识体系
- 前端知识体系
- 前端知识体系
- 前端工程师知识体系
- web前端知识体系
- 前端知识体系
- 2017-7-20总结
- Permission denied (publickey).fatal: Could not read from remote repository.
- 安装Docker环境来使用Battery History
- java并发编程实战-性能与可伸缩性1
- 欢迎使用CSDN-markdown编辑器
- 前端知识体系总结
- 网易云课堂Java进阶学习笔记系列03 -- 第7周 抽象与接口
- Spring Boot应用的Unable to find main class异常详解
- Qt 判断一个点是否落在三角形内(算法)
- 提高组联赛训练07.19
- android 6.0动态权限在进入MainActivity之前的统一处理
- 数据结构:队列和栈----刷题集(二)
- day_12 C语言预处理及数组
- Python ——大道至简