ES6学习
- 参考地址: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);//zhangsan
console.log(obj.age);// 18
console.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);//undefiend
console.log(obj.age);//undefiend
console.log(obj);//obj
- const 使用冻结对象
const obj = Object.freeze({
name: 'zhangsan',
age : 18
});
console.log(obj.name);//zhangsan
console.log(obj.age);//18
console.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,失败回调reject
let 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]