1.let const
let 声明的变量只在 let 命令所在的代码块内有效。
//var 会造成变量穿透，如下
for(var i = 0;i<10;i++){
console.log(i);
}
console.log(i);//打印输出 i = 10,而原本在上面的循环中i只能到9
for(let j = 0;j<10;j++){
console.log(j);// 0-9
}
console.log(j);// ReferenceError: j is not defined
const 声明一个只读的常量，一旦声明，常量的值就不能改变。
let a = "小明";
console.log(a);
const PI = 3.14159;
PI = 2.3;
console.log(PI);//报错，常量不能修改 TypeError: Assignment to constant variable.
2.对象解构赋值
解构模型：解构源，解构目标
解构的源，解构赋值表达式的右边部分。
解构的目标，解构赋值表达式的左边部分。var [ 目标 ] = { 源 }
数组解构
//一维数组解构
let nums = [1, 2, 3];
let [a, b, c] = nums;
console.log(a);//1
console.log(b);//2
console.log(c);//3
//二维数组解构，嵌套解构,使用...rest相当于可变参数，解构剩下的
let tNums = [[9, 8, 7], [6, 5, 4], [3, 2, 1]];
let [[a00, a01, a02], ...rest] = tNums;
console.log(a00);//9
console.log(a01);//8
console.log(a02);//7
console.log(...rest);//[6, 5, 4] , [3, 2, 1]
字符串解构
//字符串解构
let str = "hello!";
let [h,i,j,k,l,m] = str;
console.log(h);//h
console.log(i);//e
console.log(j);//l
console.log(k);//l
console.log(l);//o
console.log(m);//!
//使用部分解构
let [n,...rest2] = str;
console.log(n); //h
console.log(rest2); //['e', 'l', 'l', 'o', '!']
对象解构
var name = "小白";
var sex ="男";
var age =21;
let person = {
name,
sex,
age,
};
//传统取元素的方法 . 和 []
console.log(person.name); //小白
console.log(person.sex); //男
console.log(person.age); //21
//es6的对象解构
var {
name,sex,age} =person;
console.log(name); //小白
console.log(sex); //男
console.log(age); //21
//对象解构例子
let peoples = {
p1:{
name:"张三",age:34},p2:{
name:"李四",age:33},p3:{
name:"白云飞",age:18}};
let {
p1,p2,p3} = peoples;
console.log(p1); //{name: '张三', age: 34}
console.log(p2); //{name: '李四', age: 33}
console.log(p3); //{name: '白云飞', age: 18}
let {
p: [x, {
y }] } = {
p: ['hello', {
y: 'world'}] };
console.log(x);//hello
console.log(y);//world
3.模板字符串
传统字符串拼接 ，首先字符串由 ""或者''包裹，然后用+来拼接。
es6提供的新的拼接方式 ,字符串由 ``来包裹，然后只需要使用${}来提取你所要的值进行拼接即可。
//传统字符串拼接
var p1 = {
name:"白云飞",age:18,id:"2020040411"};
let str = "今天上课"+p1.name+"听的很认真！";
console.log(str);
//es6模板字符串拼接
let str2 = `今天上课${
p1.name}听的很认真！`;
console.log(str2);
//在es6中模板字符串，回车换行也会被记录进去
let str3 = `今天上课
${
p1.name}
听的很认真！`;
console.log(str3);
4.Map Set
Map对象
Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
Map 中的键值是有序的（FIFO 原则）先进先出==>队列，Map 的键值对个数可以从 size 属性获取。
map的set 和遍历
let p1 = {
name:"白云菲",age:20,sid:"040416"};
let p2 = {
name:"叶子君",age:21,sid:"040417"};
let p3 = {
name:"张三",age:22,sid:"040418"};
let mapList = new Map();
//以学号为key，学生信息为value压入map中
mapList.set(p1.sid,p1);
mapList.set(p2.sid,p2);
mapList.set(p3.sid,p3);
//Map迭代遍历
// 1. for of
for (let mapListElement of mapList) {
console.log(mapListElement);
};
// 2.for each
mapList.forEach(function (value, key) {
console.log(key+"--");
for (let e in value) {
console.log(e+":"+value[e]);
};
});
for of遍历结果
for each遍历结果
map的合并和复制
map复制
//map的复制
var map1 = new Map([["200102", "春"], ["200106", "夏"]]);
var map2 = new Map(map1);
for (let map2Element of map2) {
console.log(map2Element);
}
map合并
var map1 = new Map([["200102", "春"], ["200106", "夏"]]);
var map2 = new Map([["030311", "小白"], ["030316", "小飞"],["200106","小云"]]);
var mapUnion = new Map([...map2,...map1]);
for (let mapUnionElement of mapUnion) {
console.log(mapUnionElement);
}
//注意合并时如果有重复的键，那么后面的会覆盖前面的 夏 覆盖 小云
Map和数组的转换
Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象。
使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组。
var arr1 = [["key1", "value1"], ["key2", "value2"]];
// Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象
var map1= new Map(arr1);
for (let map1Element of map1) {
console.log(map1Element);
}
// 使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组
var arr2 = Array.from(map1);
console.log(arr2);
Set对象
Set 对象，不重复且无序，常用于数组的去重，取交集并集差集（和数学中的概念是一样的）。
set的去重，取并交差集
var a = new Set([1,2,3,4,1,2]);
console.log(a);// 1,2,3,4
var b = new Set([5,6,7,8]);
//将a,b两个一维数组合并为一个二维数组
var union =new Set([...a,...b]);
console.log(union);// 1, 2, 3, 4, 5, 6, 7, 8
//取a,c的交集
var c = new Set([1,2,6,4]);
var interSet = new Set([...a].filter(x => c.has(x)));
console.log(interSet);// 1 ,2 ,4
//取a,c的差集
var diffSet = new Set([...a].filter(x => !c.has(x)));
console.log(diffSet);// 3
//取c,a的差集
var diffSet2 = new Set([...c].filter(x => !a.has(x)));
console.log(diffSet2);// 6
--------------------------------------------------未完待续--------------------------------------------------
