当前位置：首页 > news >正文

ECMAScript 6 基础

news 来源：原创 2024/9/20 11:57:14

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 基本是否方法