前端体系结构及知识点

一阶段 ( html + css )

  • 基础的页面布局 ( div 弹性盒子布局 )

  • seo优化 ( 搜索引擎优化 )

  • 动画效果

  • html5和css3

  • 多端适配 ( rem )

二阶段 ( javaScript )

  • DOM ( 文档操作 ) : 不推荐大量使用 , 会造成重绘回流

  • BOM ( 浏览器操作 ( 路由实现 ) )

  • ES ( ECMAScript , 基础语法 )

  • node.js ( 后端 )

三阶段 ( 应用 )

  • MVVM ( 双向绑定 数据和视图之间实现绑定 数据驱动视图(数据变了页面就会变) )

  • 框架 ( vue ( 封装的使用 ) , react ( 原生js ) )

  • 组件 ( 抽取功能代码 , 形成一个组件 , 为了复用 )

  • uniapp ( 利用vue来书写代码 , 可以打包多端 ) 及小程序 ( 微信小程序 )

 

基础内容回顾

第一周内容

1、javaScript入门

  • 变量定义 ,

  • 常见关键词 ,

  • 基础语法

  • 基础数据类型及相关转换

2、运算符及表达式

  • 算术运算 ,

  • 逻辑运算 ,

  • 比较运算 ,

  • 位运算 ,

  • 赋值运算 ,

  • 三目运算

3、条件判断语句

  • if…else ,

  • switch…case

4、循环

  • while ,

  • do…while ,

  • for ,

  • 时间复杂度 O1>OlogN>On^2>On^3

5、函数

  • 函数作用域 ,

  • 全局作用域 ,

  • 作用域链 ( 函数的基本使用 , 抽取公共代码形成达到复用 )

  • arguments ( 参数数组 )

第二周内容

1、数组

  • 数组的定义 ,

  • 数组的增删改查方法 ( push , pop ,shift , unshift , reverse , slice , splice , concat , join , sort … )

2、字符串

  • 字符串特性 ,

  • 字符串的相关方法 ( charCodeAt , charAt , indexOf , lastIndexOf , search , match , replace , split , concat , toUpperCase , toLowerCase , substr , subString … )

3、日期及对象

  • Date的相关方法 ,

  • 对象的声明 ( 键值对存储 )

  • 对象的属性获取 ( 对象名.属性名 , 对象名[属性字符串] )

4、BOM

  • window对象及底下的子对象

    ( location 属性 : hash , search , href … ; 方法 : assgin , replace ,reload

    history 属性 : length ; 方法 : go , back , forward , pushstate , replacestate )

  • screen ,

  • navigator ,

  • frams ,

  • document

5、DOM ( 文档对象 属性 元素 文本 , 对应的关于元素操作的增删查改方法 ( 元素自带的属性 ) , 相关的节点获取相关属性 , 属性操作的相关方法 )

第三周内容

1、DOM回顾

  • DOM相关节点的操作以及属性节点的获取

2、事件

常用事件有 :

  • 鼠标事件 ( click , dbclick , )

  • 键盘事件 ( keydown , keyup , keypress ) 、

  • html事件 ( change , select , input , reset , submit , focus , blur , load , close , unload… )

3、事件

  • 模式 : 冒泡和捕获 ,

  • 事件对象event ,

  • 事件委托 ( event.target )

  • 阻止默认行为 ( e.preventDefault || e.returnValue = false )

  • 阻止冒泡 ( e.stopPagation || e. cancalbubble = true )

4、cookie

  • cookie的诞生 ( 解决http无状态问题 ,使用sessionID存储 )
  • cookie的格式 ( key = value ; expries = 过期时间 ; path = 地址 ; domain = 跨域 ; secure 安全 )
  • cookie和localStroage 、sessionStroage的区别

第四周内容

1、ES5和ES6新增

  • ES5新增 ( 严格模式 , 字符串模板 , 数组高阶函数 ( forEach , map , some , every , filter , reduce ) , 更改this指向 ( call , apply , bind ) )

  • ES6新增 ( 字符串新增 , 数组新增 , 对象新增 , 函数新增 , 声明关键字新增 , 基础值类型新增 , 解构和扩展运算符 , class类新增 ( class , extends ) , set 和map 新增的数据结构 , 模块化 ( import , export )

2、运动

  • 匀速 ( 改变的步长不变 )

  • 缓存 ( 步长越来越小 )

  • 链式 ( 回调函数来实现 )

  • setInterval+dom操作

3、面对对象

  • 对象的构建方式 ( 对象的封装 )

  • 利用面对对象思想来书写案例 ( tab栏切换 , 盒子拖拽 , 放大镜 , 轮播图 )

4、原型和继承

  • 构造函数的原型是prototype

  • 对象的原型是__proto__ ( 对象的原型指向构造函数的原型 )

  • 原型链

  • 继承实现 ( class extends 继承 , 原型链继承 , 冒充继承 , 组合继承 , 组合寄生继承 )

5、闭包和promise

  • 闭包的特性

  • 闭包的应用 ( 节流 , 防抖 , 函数的柯里化 )

  • promise ( ES6新增的一个类 , 需要实例化 , 它有三种状态 (pending , fulfiling , rejected) )

  • promise的相关方法 ( 原型方法 : then , catch , finally ; 静态方法 : resolve , reject , all ,allsettled , race )

6、事件轮询机制

执行顺序 :

script ( 宏任务 ) –> script内同步代码 –> script内微任务代码 — >下一个宏任务 ( 定时器 , IO… ) –>宏任务内同步代码–>宏任务内微任务 ( promise.then , promise.catch , promise.finally , nextTick… ) –> 宏任务 …

原文地址:http://www.cnblogs.com/itlulu/p/16833536.html

1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长! 2. 分享目的仅供大家学习和交流,请务用于商业用途! 3. 如果你也有好源码或者教程,可以到用户中心发布,分享有积分奖励和额外收入! 4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解! 5. 如有链接无法下载、失效或广告,请联系管理员处理! 6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需! 7. 如遇到加密压缩包,默认解压密码为"gltf",如遇到无法解压的请联系管理员! 8. 因为资源和程序源码均为可复制品,所以不支持任何理由的退款兑现,请斟酌后支付下载 声明:如果标题没有注明"已测试"或者"测试可用"等字样的资源源码均未经过站长测试.特别注意没有标注的源码不保证任何可用性