ECMAScript 6 基础
# ECMAScript 6 基础
- 课堂目标
- 录播视频要点回顾
- 掌握ES6基本使用
- 了解数据驱动视图模式
- 完成员工列表案例
- 完成百度音乐案例
- 本节知识要点
- ES6+基本使用
- 数据驱动视图
- 员工列表案例
- 百度音乐全选案例
## ECMAScript 6 简介
- JavaScript 三大组成部分
- ECMAScript
- DOM
- BOM
- ECMAScript 发展历史 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Language_Resources
- ECMAScript 包含内容：JS 中的数据类型及相关操作，流程控制，运算符及相关运算……
## ECMAScript 6
- let 和 const
- let 和 var 的差异
- let 允许声明一个在作用域限制在块级中的变量、语句或者表达式
- 块级作用域
- var 声明的变量只能是全局或者整个函数块的
- let 不能重复声明
- let 不会被预解析
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/let
- const 常量
- 常量不能重新赋值
- 不能重复声明
- 块级作用域
- const 不会被预解析
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/const
- 解构赋值
- 对象的解构赋值
- 数组的解构赋值
- 字符串的解构赋值
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
- 展开运算符
- 对象展开
- 数组展开
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Spread_syntax
- Set 对象
- Set 对象的数据结构
- Set 相关属性与方法
- size 属性
- clear()、delete()、has()、add()
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Set
- Map 对象
- Map 对象的数据结构
- Map 相关属性与方法
- size 属性
- clear()、delete()、get()、has()、set()
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Map
- 函数新增扩展
- 箭头函数
- 箭头函数的各种写法
- 箭头函数的 this 问题
- 箭头函数的不定参问题
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions
- rest 参数设置
- 参数默认值设置
- 新增数组扩展
- Array.from()、Array.of()
- find()、findIndex()、includes()
- flat()、flatMap()
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array
- 新增字符串扩展
- includes(), startsWith(), endsWith()
- repeat()
- 模版字符串
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String
- 新增对象扩展
- 属性简洁表示法
- 属性名表达式
- 手册地址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object
- babel 使用
- Babel 是一个 JavaScript 编译器
- 手册地址：https://www.babeljs.cn/
- Babel 基本是否方法
### 带着问题学习
- 小试牛刀
- var、let 及 const 区别？
- 说一下 ES6 对 Object 类型做了哪些优化更新?
## 员工列表
- 数据驱动视图
- 员工列表筛选
###百度全选列表
- 实现添加功能
- 实现全选功能
- 实现删除功能
### 总结
- ES6基本使用
- let、const、解构赋值、展开运算符...
- 数据驱动视图
- ES6员工列表案例
- ES6百度音乐全选案例
### 下期预告
- js面向对象
