千锋教育JavaScript全套视频教程（10天学会Js，前端javascrip
## 事件委托
+ 什么是事件委托
+ 如何实现事件委托
+ 事件委托优点
## 阻止冒泡
+ 什么是冒泡 && 什么时候需要实现冒泡
+ 如何实现
## 阻止默认事件
+ 什么是默认事件
+ 如何实现
+ 获取目标元素
+ 获取父元素
+ 获取元素的标签名
## this关键字
+ this出现在事件处理函数里面 this代表的是当前的事件源
+ 普通函数内部的this看调用
+ 箭头函数内部的this看定义
+ 可以强制修改一个普通函数内部的this， 有三种方式可以修改一个函数内部的this指向
- call
+ 函数名.call(新this的指向, 参数01, 参数02,...)
- apply
+ 函数名.apply(新this的指向, [参数01, 参数02, ...])
- bind
+ var 新函数 = 函数.bind(新this的指向)
+ 新函数(参数01, 参数02, ...)
+ call、apply、bind的区别
+ call、apply在改变函数this的同时会调用这个函数 bind只会改变this 不会调用函数 会返回一个修改this之后的新函数 需要自己去调用这个新函数
+ call和apply的传参方式不一样
## es6
+ ECMAscript 简称 es 标准语法
+ es5
+ es1.0 1997
+ es2.0 1998
+ es3.0 1999
+ es5.0 2008 es3.0-->es3.1-->es5
+ 2015 年 6 月 es6 官方称呼这个版本es2015
+ 2016 es2016 --> es7
+ ...
+ 2023 es2023 --> es14
### let和const
+ let是声明变量的一种新方式
+ let和var的区别
1. 作用域不一样
2. let不会声明提升 var有声明提升(不能提前使用let变量)
3. let不允许重复声明（let声明的时候看有没有定义过）
4. 暂时性死区
+ const是声明常量的一种方式
+ const有没有块级作用域概念
### 箭头函数
+ 定义函数
- es5(普通函数 带function函数)
+ 声明式定义
```js
function 函数名(形参,形参){
}
```
- 赋值式定义
```js
var 函数名 = function(形参,形参){
}
```
- es6 箭头函数
```js
var 函数名 = (形参,形参) => {
}
```
+ 箭头函数简写
- 当箭头函数内部的代码`只有一行`的时候 花括号可以省略不写
- 当箭头函数`只有一个形参`的时候 小括号可以省略不写
+ 箭头函数解决this指向不固定的问题
+ 箭头函数和普通函数的区别
1. 内部的this指向不一样
2. 箭头函数内部this无法修改
3. 箭头函数内部没有arguments
4. 箭头函数无法当做构造函数
### 函数默认参数
### 函数的剩余参数rest parmater
### 解构赋值
+ 主要用于取出数组或者对象里面的值将它赋值给一个变量
+ var [变量名, 变量名, ...] = 数组名
+ var {键名:别名, 键名: 别名, 键名} = 对象名
### 展开运算符
+ `...`
+ 用于合并数组和对象
### 模块化语法
+ 模块： 在项目开发中每一个文件就是一个独立的模块 由多个模块组成一个整体 构成一个项目
+ 模块化管理： 将我们独立每一个文件进行整合
+ css模块化
+ js模块化（esm） es6 module语法
+ 导入
- 单个导入
```js
import {a, fn} from '路径'
```
- 默认导入
```js
import 变量名 from '路径'
```
+ 导出
- 单个导出
```js
export var a = 1
export const fn = ()=>{}
```
- 默认导出
```js
export default {
aaa: 1,
fnn: ()=>{}
}
```
+ `Cannot use import statement outside a module` 导入了一个js 这个js用到了import命令 这个命令浏览器是不识别的 需要告诉浏览器 我是使用了import命令 你要帮我解析 在加载这个js的script标签里面添加一个`type=module`
+ `Access to script at 'file:///D:/%E6%95%99%E5%AD%A6/2302/week03/day04/%E4%BB%A3%E7%A0%81/js%E6%A8%A1%E5%9D%97%E5%8C%96/index.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.` 一旦开始type=module模式 本地打开的网页不支持 需要在服务器环境打开这个页面 需要安装live server利用live server打开这个页面即可
+ 虽然此时我们已经可以成功在一个js里面加载另一个js 但是注意每一个js都相当于是一个独立的作用域 单纯的导入只是将文件执行了 并不能说就能够使用导入文件里面的数据
+ 如果我们想要使用导入文件里面的数据 就要导入文件要导出 在数据前面加上`export`就导出了这个数据
+ 导入的时候需要接受数据
### 作用域
+ es5作用域
- 全局作用域
- 局部作用域
+ es5变量
- 全局变量
- 局部变量
+ es6作用域
- 全局作用域
- 局部作用域
- 块级作用域
+ 花括号内部
+ es6变量
- 全局变量
- 局部变量
- 块级变量
+ 在块级作用域里面用`let声明`的变量被称为块级变量 块级变量只能在当前块级作用域内部使
