es6基础语法

let定义变量特点

<script>
    // var 可以声明多次
	// let 只能声明一次
    var m = 1;
    var m = 2;
    let n = 3;
    let n = 4;//再次声明报错
    console.log(m);
    console.log(n);
</script>

const声明常量（只读变量）

通过 const 定义的变量与 let 变量类似，但不能重新赋值

<script>
    //const 声明之后不允许改变
    const PI = "3.1415926"
    //常量值一旦被定义不能被改变
    PI = 3
    //定义常量必须被初始化
    //const AA
    
    const aa = [1,2,3]
    aa[1]= 22
    console.log(aa)//[1,22,3]
    //const定义的对象或者数组，存放在堆内存中，变量只保存指针，
    //所以数据可以被改变
</script>

解构赋值

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

// 解构赋值
  let [a, b] = [1, 2, 3];
  console.log(a, b);//1,2

  let user = { name: "yy", age: 23, age1: 777 };

  let { name, age1 } = user;//结构的变量必须在user中有的属性 
  console.log(name, age1);//yy ,777

模板字符串

模板字符串相当于加强版的字符串，用反引号 `,除了作为普通字符串，还可以用来定义多行字符串，还可以在字符串中加入变量和表达式。

// 模板字符串
  let str1 = `hello,
  es6 demo up`;
  console.log(str1);//输出多行

  // 在字符串中插入变量或表达式
  let name2 = "yy";
  let age2 = 25;
  let str2 = `我叫${name2},年龄${age2 + 1}`;
  console.log(str2);//我叫yy，年龄26

  // 在字符串中调用函数
  function f() {
    return "nihao";
  }
  let str3 = `反引号${f()}`;
  console.log(str3);//反引号nihao

声明对象简写

// 声明对象简写
  const age4 = 22;
  const name4 = "yy";
//传统
  const person1 = { age: age4, name: name4 };
  console.log(person1);
//es6
  const person2 = { age4, name4 };
  console.log(person2);

定义方法简写

 // 传统 通过var 声明的变量没有块作用域
  var person3 = {
    sayHi: function () {
      console.log("hi");
    },
  };
  // es6 const 定义常量 
  const person4 = {
    sayHi() {
      console.log("hi,es6");
    },
  };
  // let 和 var 相似 但是提供了块作用域
  let person5 = {
    sayHi() {
      console.log("hi,let");
    },
  };

  person3.sayHi();//hi
  person4.sayHi();//hi,es6
  person5.sayHi();//hi,let

对象拓展运算符（…）

拓展运算符（…）用于取出参数对象所有可遍历属性然后拷贝到当前对象。

 let person6 = {
    name: "qq",
    age: 33,
    ahh() {
      console.log("1");
    },
    akk: [1, 2, 3],
  };
  let person7 = { ...person6 };
  console.log(person7);//

 // 合并对象
  let yourName = { name: "yyy" };
  let yourAge = { age: 222 };
  let person8 = { ...yourName, ...yourAge };
  console.log(person8);//{name: "yyy", age: 222 }

箭头函数

  var f1 = function (a) {
    return a;
  };
  console.log(f1(2));
// 箭头函数
  var f2 = a => a;
  console.log(f2(3));
  /// 当箭头函数没有参数或者有多个参数，要用 () 括起来
 // 当箭头函数函数体有多行语句，用 {} 包裹起来，表示代码块，
// 当只有一行语句，并且需要返回结果时，可以省略 {} 和 return