一.Es6初识

es6 就是js
准确来说 es6 是 js 的语法规范
之前所学的是 js5 的第五代版本
es6(ECMAscript)是 2015年 6月 由欧洲工业标准组织 所制定的 新一套 js 语法标准 也算是 js 第6套版本 ECMAscript 简称ES6
es6 是 js 的标准
js 是 ES6 的实现
es6 中 提供了 模块化开发的语法 ，主要应用于 企业级复杂的web开发
对数组 对象 字符串 都进行一些方法的扩展
提供了几个新的数据类型。
es6 可以实现一个同步的效果

二. let_ const

1. let

（1）let 声明的变量只在 let 命令所在的代码块内有效

 for(var i = 0;i<10;i++){
    console.log(i);
    var  = i
 }
    console.log(i);//10
     console.log(a);//9
i 和 a 都能取的到  说明js中 用var 在for中声明的变量 可以在外部访

   for(let i = 0;i<10;i++){
       let a = i;
 }
   console.log(i);
    console.log(a);
  在 es6 中 用 let在for中生命的变量 无法在外部访问

（2）Let 生命的变量 变量名 不能重复 而且 必须先声明后使用，let没有变量的提升 和 变量污染

var a = 0;
let a = 1;
console.log(a)  直接报错

（3）块级作用域 相当于 局部作用
// 在js中 只有函数才能创造局部作用域，但是在es中 只要是个大括号{} 他都是局部作用域（也是块级作用域

{
var  a = 0;a
let b = 1
}
console.log(a) //0
console.log(b)// 报错 找不到变量b 

1.与js中不同的是 在js 中 在全局中生命的变量 在局部环境也可以使用
2.在Es6中 全局变量只能在全局中使用，局部变量也只能在局部中使用
3.而且 全局声明的变量 跟 局部声明的变量 没有任何关系
变量名也可以一样
4.let 声明的变量 只能在当前作用域中使用

let a = 0;
{
  let a = 1;
console.log(a) //1
}
console.log（a）//0

2.const

(1). const 关键字 在es6中 声明 静态常量
（2).常量所有字母 必须完全大写
（3).常量在声明时必须赋值
（4).const 在作用域特性上 跟let完全一样
（5).var 声明的变量 是写在了 window的对象上 是 window的属性或方法
let 声明的变量 跟 window完全没有关系，

const PI = 3.1416926;
console.log(PI); 3.1416926
PI = 0;
console.log(PI);   报错 ！ 常量 无法修改！
const ABC；
console.log(ABC)  常量必须在声明的时候赋值

三.解构赋值

概述

解构赋值是对赋值运算符的扩展。
他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。

解构模式

**在解构中，有下面两部分参与：
解构的源，解构赋值表达式的右边部分。
解构的目标，解构赋值表达式的左边部分。
**
正常赋值

let x = 0;

解构赋值
本质上就是一种模式匹配，只要等号两边的模式相同，
左边的变量就会被赋予相对应的值

let [x,y] = [0,1]
console.log（x）// 0;
console.log(y)  // 1

(1)二维数组的解构赋值

let[a,[b1,b2],c] = [0,[1,2],3]；
console.log（a）; //0
console.log（b1）;//1
console.log（b2）;//2
console.log（c）;//3

(2)按位置匹配

let[a, ,b] = [1,2,3]
// 让b等于3，需要将中间用逗号（，）隔开
console.log(b)//3

(3)解构赋值 结构对象时
变量名 必须和属性名相同，但是顺序没有要求

let obj = {
  name:'张三'，
age:18,
sex:'女'，
say:function(){
console.log('你好，我是张三')
  }
}

Es5 写法

var name1 = obj.name;
var age1 = obj.age;

Es6写法

let{
  age,
names,
} = obj;
console.log(names,age)

(4) 解构数组

let arr= [1,2,3,4,5];
let obj1 = {
   [0]:a,
   [4]:b
}=arr
console.log(a,b)//a= 1,b = 5

(5).当对象中含有数组时

let obj1 = {
  data :[0,1,2,3,4]
}
let{
data, // 已变量 取出相对应  键值对的值 变量名必须和属性名相同
data:arr// 以属性名 取出 相对应键值对的值  并将值保存在变量arr中
data：[a,b,c] //将上一步的arr 彻底解构
} = obj1
console.log(a);//0
console.log（b);//1
console.log（c）;//2

(6).当对象中含有数组 数组内又有对象

  let obj = {
  data:[{
  age:1
},{
    names:2
    }]
}

解构

let{
  data:[{age},{names}]
} = obj；
console.log(age,names)// 1 , 2 

(7).解构赋值 解构字符串时 会将字符串当做一个数组来解构

let str = 'Helloword';
let[a,b,c] = str;

let{
  [0]:d 
} = str;
console.log(a,b,c,d)// H , e, l ,H

四.函数拓展

//在es6中 用let 或 const 声明与形参重复的 变量 或 常量
其实不管在 es6 还是js 中 形参跟变量名 都尽量不要重复

形参默认参数

注意!!!

（1）形参默认值不是赋值 而是惰性传值
（2）使用函数默认参数时，不允许有同名参数。
js中默认值赋值

function fn1(x){
  var a = x || 10//js中默认值赋值
}

js中默认值赋值

function fn3（x = 10）{
  var a = x//js中默认值赋值
}

给函数传参

function fn3(x){
  let x = 0;
console.log(x)
}
fn3(10)

五.箭头函数

（1）多个参数时

let fn3 = (a,b) =>{
  console.log(a,b)
}
fn3(10,11)

(2).一个参数时,（可以省略括号）

let fn4 = a =>{
  console.log(a)
  }
fn4(1)

(3).没有参数（不能省略括号）

var fn5 = () = >{
  console.log(123)
  }
fn5()

普通函数
命名函数

function fn1(a){
  console.log(a)
}

字面量形式
var fn2 = function(a){
console.log(a)
}
带返回值
正常函数

function aa(){//正常函数
  return 123
}

箭头函数

**（1）箭头函数中 如果只有一条 return 语句 则可以省略大括号

function a(){
  return function b1(a){
    return a+1 
 }
}

箭头函数写法

   let b  = () => a => a+1;
    let b1 = b()(1)
console.log(b1)

当内部函数 使用箭头函数时 不会改变外部函数 this 指向

this指向的总结
普通函数 谁调用我 我的this指向谁
箭头函数我被定义时 ，定义的环境中this 指向谁 我我this就只想谁

 let obj = {
  say:function(){
  console.log(this);//这个对象
      }，
eat：() =>{
  console.log(this);//window
      }
  }
obj.say();
obj.eat();

给对象 定义方法时 不要使用箭头函数

构造函数就没有什么所谓了

function Dog(){
            this.say = function(){
                console.log(this);
            },
            this.eat = ()=>{
                console.log(this);
            }
        }
        let d1  = new Dog();
        d1.say();
        d1.eat();

六.字符串的拓展

**模板字符串 （反斜点）
在模板字符串中 如果需要写一个字符 则要在前面加上 \ **
字符串拓展 的方法

let str = 'hellow'

1.includes()查找
查找指定字符 有返回值
能找到 返回 true
找不到 返回 false

console.log(str.includes('o')); // true 
console.log(str.includes('a'))//false

(2)startsWith()
判断是否以指定字符开头，返回值是布尔值
如果是 返回 true
如果不是 返回 false

  console.log(str.startsWith('h'));//true
    console.log(str.startsWith('he'));//true
    console.log(str.startsWith('hel'));//true
    console.log(str.startsWith('helo'));//false
    console.log(str.startsWith('o'));//false
    console.log(str.startsWith('w'));//false

(3)endwith()
判断是否以指定字符结尾，返回值是布尔值
如果是 返回true
不是 返回 false

  console.log(str.startsWith('h'));//true
    console.log(str.startsWith('th'));//true
    console.log(str.startsWith('ith'));//true

(4)repeat
将原字符串 重复赋值指定次数 并将生成的字符串 返回

    console.log(str.repeat(1));
    console.log(str.repeat(2));
    console.log(str.repeat(3));

(5)5.trim();删除首位和末尾空格

       let str1 = ' a b c d e f ';
    console.log(str1.trim(1));//删除首位和末尾空格
    console.log(str1);

6.trimStart();//删除首位格
7.trimEnd()//删除末尾空格