es6语法

Let ：等价var，功能为对变量的声明定义

let 的特点：
（1）let 不能定义重复的变量；
（2）let 修饰的变量必须先定义后使用；
（3）块级作用域；
（4）暂时性死区：:不同块级作用域可以重复定义；
const ：修饰的变量只能读不能修改，习惯上名字都大写，在定义时就必须初始化

this：函数的内置对象

（1）与事件连用时，代表触发事件的元素本身
（2）与普通函数(除了事件和构造方法)连用，代表调用该函数的对象本身

  1.  let json = {
  2.          "name":"安心如",
  3.          "age":18,
  4.          "fun":function(){
  5.              console.log(this.name,this.age);  //安心如  18
  6.          }               //this代表json
  7.      }
  9. json.fun();

bind：改变匿名函数的this指向

用法：匿名函数 . bind(被修改的this)

  1. document.onclick = function(){
  2.     this.style.display = "none";
  3. }.bind(oBox);  //this从document被修改为oBox

json对象和字符串的相互转换

1、json对象➡字符串：JSON.stringify(json名字)；

  1. let json = {"name":"卫一豪","age":18};
  2. let str = JSON.stringify(json);
  3. console.log(str);  //{"name":"卫一豪","age":18}  字符串型

2、字符串➡json对象：JSON.parse(str名字)；

  1. let str1 = '{"name":"韩超红","age":18}';
  2. let obj = JSON.parse(str1);
  3. console.log(obj.name,obj.age);  //韩超红 18

for…in 和 for…of

for…in 遍历下标(常用来遍历json对象)

  1. for(let index in json){
  2.     console.log(json[index]);
  3. }

for…of 遍历元素内容

  1. var arr = [5,4,6,7,8];
  3. for(let item of arr){
  4.     console.log(item);   //5  4  6  7  8
  5.     item = 1;   //item并不是当前元素本身，只是拥有当前元素数值的一个变量
  6.     console.log(item);   //1  1  1  1  1
  7. }
  9. console.log(arr);  //[5,4,6,7,8]

ES6字符串扩展方法：判断字符串是否包含在另一个字符串中

（1）str.includes(参数)：是否在字符串中找到了参数字符串，返回布尔值；
（2）str.startsWith(参数)：参数是否在字符串的开始位置，返回布尔值；
（3）str.endsWith(参数)： 参数是否在字符串的尾部位置，返回布尔值，最适合找后缀名

  1. let str = "wo shi han chao bo.js";
  3. console.log(str.includes("wo1"));  //false
  4. console.log(str.startsWith("wo sh"));  //true
  5. console.log(str.endsWith(".js"));  //true

（4）读取生僻字和十六进制码

  1. let str = "𡱖";
  2.     console.log(str.charAt(0));  //这种方法读不出来
  3.     console.log("\u{21c56}");  //超出UTF-16的汉字，百度十六进制码，
  4. ,需要用这种方法读
  5.     console.log(str.codePointAt(0).toString(16));  //str.codePointAt(0)
  6. 得到𡱖的十进制码； .toString(16)  十进制码转成十六进制码

箭头函数：匿名函数的另一种写法

  1. let fun = function(a,b){
  2.     console.log(a+b);
  3. }
  4. let fun = (a,b)=>{     //箭头函数的写法，与上面写法等价
  5.     console.log(a+b);
  6. }

a、箭头函数如果只有一个参数可以省略参数的( )

  1. let fun = a=>{
  2.     console.log(a);
  3. }

箭头函数函数体若只有一句,可以省略{ }
let fun = a=>console.log(a);
如果函数体只有一行代码还会自动return这行代码

  1. //之前写法：
  2. let fun = function(a){
  3.     return a += 5;
  4. }
  6. console.log(fun(100));  //105
  8. //箭头函数写法：
  9. let fun = a=> a += 5;
  11. console.log(fun(100));  //105
  13. let count = 0;
  14. setInterval(()=>console.log(++count),1000);  //每秒count加1

解构赋值：

a、解析结构进行赋值：等号左值和右值必须类型一致；

  1. //写法1：
  2. let x,y,z;    
  3.     x = 1;
  4.     y = 2;
  5.     z = 3;
  7. //写法2：
  8. let x=1,y=2,z=3;
  10. //解构赋值写法：
  11. let [x,y,z] = [1,2,3];
  14. //json对象的解构赋值写法:
  15. let {name,age} = {name:"韩超勃",age:18};
  16. console.log(name,age);   //韩超勃  18 
  19. let obj = {"name":"小王","age":666};
  20. let {name,age} = obj;
  21. console.log(name,age);  //小王 666

两个变量的交换

  1. //做法1：
  2. let [a,b] = [123,456];
  4.     a = a + b;
  5.     b = a - b;
  6.     a = a - b;
  8. console.log(a,b);   //456  123
  11. //解构赋值做法：
  12. let [a,b] = [123,456];
  13. [a,b] = [b,a];
  14. console.log(a,b);   //456  123

set 集合：不能存储相同的元素，没有下标，去重

定义：let set = new Set(数组)；

  1. let set = new Set([1,2,3,4,1,2,3,4,5]);  
  2. console.log(set);   //Set(5) {1, 2, 3, 4, 5}

将集合转成数组类型：
Array.from(set);
数组去重：

  1. let arr = [1,2,3,4,1,2,3,4,5];
  2. let set = new Set(arr);
  3. arr = Array.from(set);  //将集合转成数组类型
  4. console.log(arr);  [1,2,3,4,5]

add(参数)： 向集合中添加一个元素；
delete(值) ：删除集合中某个数；
has(值) ：判断集合中是否含有某个值，返回布尔值；
clear() ：清空集合;

  1. et set = new Set([1,2,3,4,1,2,3,4,5]);
  3.     set.add(11);  //增加11
  5.     set.delete(5);  //删除5
  7.     console.log(set.has(22));  //false
  9.     set.clear();  //清空
  11.     for(let item of set){  //用for...of遍历set
  12.         console.log(item);
  13.     }

map

map:容器,映射表.所有操作都通过key

  1. let map = new Map();
  3.     map.set("A","liuyisi");
  4.     map.set("B",{"name":"鲍威尔"});
  5.     map.set("C","霍利菲尔康");
  6.     map.set("A","刘康");
  8.     console.log(map);
  10.     console.log(map.get("B").name);
  12.     map.delete("B");
  14.     map.clear();
  16.     for(let item of map){
  17.         console.log(item[0],item[1]);
  18.     }
  20.     console.log(map.has("asdasd"));

ES6字符串模板

  1. //如果字符串模板出现了变量用${变量}
  1. let oUl = document.querySelector("ul");
  3.     let i = 6;
  4.     //oUl.innerHTML = "<li>"+i+"</li>";
  5.     //如果字符串模板出现了变量用${变量}
  6.     oUl.innerHTML = `<li>${i}</li>`;
  8.     for(let i=0; i<10; i++){
  9.         oUl.innerHTML += `<li class='price'>${i}</li>
  10.                           <p class='t'>
  11.                              <span>${i+1}</span>
  12.                           </p>`;
  13.     }