ES6学习
- 参考地址:
let
- 1.let可以声明变量
- 2.let 不存在变量提升
//es5 var a = []; for (var i = 0; i < 10; i++) { var c = i; a[i] = function () { console.log(c); } } a[4]();//9 //es6 var b = []; for (var j = 0; j < 10; j++) { let d = j; b[j] = function () { console.log(d); } } b[4]();//4
- 暂时性死区
- 只要块级作用域内存在let 命令,所有声明的变量就这在区域内,不爱外部的影响。
{ console.log(a); //undefined let a = 100; console.log(a); // 100 } var a = 100; { console.log(a); //undefined let a = 100; console.log(a); // 100 }
- 不允许重复声明变量
{ var a = 100; var a = 200; console.log(a); } console.log(a); { var b = 100; let b = 200; } console.log(b);//报错 { let c = 100; var c = 200; } console.log(c);//报错 { let d =100; let d = 200; } console.log(d);//报错
- 块级作用域
//es6 function fun() { let num = 100; if(true) { let num = 200; console.log(num); //200 } console.log(num); } fun();//100
const
- 定义常量
const pi = 3.149526;console.log(pi); pi =3; //报错console.log(pi);
- 块级作用域
if(true) { const pi = 3.1415926; } console.log(pi); //报错,pi is not defined
- 暂时性死区
if(true) { console.log(pi); //报错,pi is not defined const pi = 3.1415926; }
- 不可重复声明
{ var a = 1; const a =1; console.log(a); //报错 }
- const 定义对象
const obj = {};obj.name = "zhangsan";obj.age = 18;console.log(obj.name);//zhangsanconsole.log(obj.age);// 18console.log(obj);//Object {name: "zhangsan", age: 18} //错误用法 obj = {};
- const 定义数组
const arr = [];arr.push("hello"); //["hello"]console.log(arr);arr.length = 0;console.log(arr); //[""] //错误用法 arr = ["one"];
- const 冻结对象
const obj = Object.freeze({});obj.name = "zhangsan";obj.age = 18;console.log(obj.name);//undefiendconsole.log(obj.age);//undefiendconsole.log(obj);//obj
- const 使用冻结对象
const obj = Object.freeze({ name: 'zhangsan', age : 18});console.log(obj.name);//zhangsanconsole.log(obj.age);//18console.log(obj);//obj{name:'zhangsan', age:18}
- 彻底冻结函数
var constantize = (obj)=>{ Object.freeze(obj); Object.keys(obj).forEach((key, value)=>{ if(typeof obj[key] === 'object'){ constantize(obj[key]) } }) }
Rest 参数的学习和扩展
- 1.函数传参可以传多个
let sum = (...m) => { let total = 0; for (let i of m) { total += i; } console.log(`total:${total}`); //14}sum(2,3,4,5);
- 2....和数组结合称为函数的扩展
let arr = [1, 2]; console.log(...arr); // 1 2 let [a, b] = [4, 5]; console.log(...[a, b]); // 4 5
- 3:数组的扩展
//es5 let arr1 = [1, 3]; let arr2 = [4, 5]; let arr3 = arr1.concat(arr2); console.log(arr3); // 1, 3, 4, 5 //es6 let arr4 = [1, 3]; let arr5 = [4, 5]; let arr6 = [...arr4, ...arr5]; console.log(arr6); //1, 3, 4, 5 let [c, ...d]=[1,2,3,4,5]; console.log(c);//1 console.log(d);//2,3,4,5
4:变量的扩展
let str = 'es6'; let str1 = [...str]; console.log(str1);//["e", "s", "6"]
promise对象
//promise对象返回成功回调resolve,失败回调rejectlet checkLogin = () =>{ //一定要返回Promise对象 return new Promise((resolve, reject) => { let flag = document.cookie.indexOf('userId')>-1? true: false if(flag = true) { //revolve成功回调函数 resolve({ status: 0, result: true }) }else{ reject(`error`); } })}checkLogin().then((res) => { //成功请求回来 if(res.status ==0) { console.log(`login success`); }}).catch((error) => { console.log(`login faild:${error}`);})let getUserInfo = () => { return new Promise((resolve, reject) => { let userInfo = { userId:101 } resolve(userInfo) })}//promise 提供了all方法可以同时调用多个接口和请求Promise.all([checkLogin(),getUserInfo()]).then(([res1,res2])=> { if(res1.status==0){ console.log(`all:${res1.result}`);//all:true } console.log(res2.userId);//101})
es6 数组去重
let arr = [1,2,3,3,4,4,9];let permissionClusterRepeat = Array.from(new Set(arr));
*es6设置数组 的交集和差集
var Array1 = [5,6,7,8,18,9,90,81]; var Array2 = [10,415,54,87,98,65,81];let a = new Set(Array1);let b = new Set(Array2); // 并集let unionSet = new Set([...a, ...b]);// set转化为数组let unionSet1 = Array.from(unionSet);console.log(unionSet1);// 交集let intersectionSet = new Set([...a].filter(x => b.has(x)));// set转化为数组let intersectionSet1 = Array.from(intersectionSet);console.log(intersectionSet1);// 差集let differenceABSet = new Set([...a].filter(x => !b.has(x)));// set转化为数组let differenceABSet1 = Array.from(differenceABSet);console.log(differenceABSet1);
动态生成指定长度的数组
Array.from({length:10}, (v,k) => k);//[0,1,2,3,4,5,6,7,8,9]