es6学习了解

1、var和const，let的区别
2、箭头函数
3、array
4、Object
5、set
6、class
7、Symbol
8、模板字符串
9、Array
10、对象简洁表示法
11、箭头函数
12、promise(坡没思)

---

1、var和const，let的区别

 // let {left: L, top: T, width: W, height: H} = getComputedStyle(document.body);
        // console.log(L,T)


        // 区别：
        // var a;
        // let b;
        // const c;

        // 区别
        // const c=1
        // c=10;

        // const c={a:1}
        // c.a=10;
        // console.log(c)

        // 区别
        // var aa={a,b:'ccc'};
        // let {a,b} = {b:'aaaa'}
        // let [,,p] = [1,2,'aaaa']
        // console.log(aa.a)
        // console.log(a,b)
        // console.log(p)


        // null和undefined
        // console.log(a)
        // var a 
        // let b
        // console.log(a)
        // console.log(b)

2、箭头函数

// let fn1 = x =>{
        //     console.log(x+100);
        // }
        // fn1(1);
        // // console.log(fn1())
        // let fn2 = x =>{
        //     return x+100;
        // }
        // fn2(1);
        // console.log(fn2(1))
        // let fn3 = x => x+100
        // console.log(fn3(1))
        // let fn = (x) =>{
        //     console.log(this)
        // }
        // fn(1)
        // let a = Symbol(1);
        // let b = Symbol(1);

        // console.log(b==a)
        // console.log(a)
        // console.log(b)

3、array

 // let arr1 = [1,22,31,5,8,7,15];
        // var arr1=[['$6'],['$12'],['$12']]
        // forEach方法
        // arr1.forEach(function(v,k){
        //     console.log(v,k)
        //     let a=[...v]
        //     console.log(a)     
        //     arr1.reduce( function( prev , current){},0)
        //   return prev+current; 
        // },0); //0表示初始值
        // console.log(rs);       
        // },arr1);//this指向谁取决于forEach最后的参数，默认指向Windows
    
        // every方法  有的不满足的就  假
        // let rs = arr1.every( v =>{
        //     return v > 5;
        // });
        // console.log(rs);

        // [...xxxx]类数组转换数组的方法

        
        // some  方法     有一个就满足就为真
        // let rs = arr1.some( v =>{
        //     return v > 5;
        // });
        // console.log(rs);

        // filer  方法     满足条件的过滤出去
        // let rs = arr1.filer( v =>{
        //     return v > 5;
        // });
        // console.log(rs);

        // map  方法     更换arr1数据的大小
        // let rs = arr1.map( v =>{
        //     return v *10;
        // });
        // console.log(rs);

        // reduce  方法     累加
        // let rs = arr1.reduce( function( prev , current){
        //     // return prev;
        //     let e = prev;
        //     let ee = ','+current;
        //     return [e+ee]

            // return current;
        //   return prev+current; 
        // },); //0表示初始值
        // console.log(rs);
        

4、Object

// obj1=['a','b','c','d','a','p','c'];
        // obj2={};
        // assign  方法     合并  注意事项：浅拷贝
        // var obj = Object.assign({},{x:1,y:2})
        // console.log(obj)
        // Object.assign(obj2,obj1)
        // console.log(obj2)

        // create  方法    创建对象原型
        // let obj3=Object.create({a:1,b:2})
        // console.log(obj3)

5、set

		// console.log(a);
        // console.log(red);
        let arr1=new Set(['a','b','c','d','a','p','c']);
        
        // arr1=[...new Set(arr1)];
        arr1.add(1).add(150).add('aaaa')
        console.log(arr1)
        // console.log(arr1);
        // arr1.forEach(function(v,k,s){
        //     console.log(v,k,s)
        //     console.log(this)
        // },arr1);//this指向谁取决于forEach最后的参数，默认指向Windows
    
        
        // let a = 1;
        // let a = 2;

6、class

// es5写法
        // const ma = function(a,b){
        //     this.a=a;
        //     this.b=b;
        //     return this;
        // };
        // ma.prototype = {
        //     constructor : ma,
        //     print:function(){
        //         console.log(this.a+' '+this.b)
        //     }
        // };
        // ma.prototype.getName = function(){
        //         console.log(this.a+' '+this.b)
        //     }
        // };
        // const mai = new ma('hello','world').print()
        // se6写法：
        // class ma{
        //     constructor(a,b){
        //         this.a=a;
        //         this.b=b;
        //         return this;
        //     }
        //     print(){
        //         console.log(this.a+' '+this.b);
        //     }
        // }
        // const mai = new ma('hello','world').print();

7、Symbol

// Symbol无法被循环
    // 区别:
    // let ss = Symbol('ss');
    // const date ={
    //     [ss] :'aaaaacs'
    // }
    // console.log(date)
    // console.log(date[ss])
    // const date2 ={
    //     [Symbol()] :'aaaaacs'
    // }
    // console.log(date2)
    // console.log(date2[Symbol()])

8、模板字符串

// 模板字符串：``返引号
        // let flag =true;
        // let html = `<ul>
        //                 <li>
        //                     <span>${'首页'}</span>
        //                     <span></span>
        //                     <span></span>
        //                     <span></span>
        //                     <span class = "${flag ? 'show' : 'hide'}"></span>
        //                 </li>
        //             </ul>`;
        // console.log(html)
        
        // (入皮次)repeat属性
        // (ing哭路次)includes    (思达思 喂次)startsWith    (n的无喂思)endsWith
        // let str1 = `a`;
        // let str2 = str1.repeat(3);
        // console.log(str2)；

        // let str = `gaomiao`;
        // //是否包含
        // console.log(str.includes('ao')); 
        // console.log(str.includes('asd'));
        // //是否开头有
        // console.log(str.startsWith('g')); 
        // console.log(str.startsWith('a'));
        // //是否结尾有
        // console.log(str.endsWith('ao')); 
        // console.log(str.endsWith('m'));

9、Array

// from
        // var ils =document.querySelectorAll('li')
        // var lis2 = Array.from(lis)
        // console.log(lis2)

        // Array.of()
        // console.arr = Array.of(1);
        // console.log(arr)

        // find(fai嗯的)查找  findIndex()
        // const arr = [1,2,3,4];
        // let res = arr.find(function(a){
        //     return a<2
        // });
        // console.log(res)
        // let res = arr.findIndex(function(a){
        //     return a<2
        // });
        // console.log(res)

        // fill(飞了)
        // const arr = [1,2,3,4,7,56,9]
        // arr.fill('abc',1,3)
        // console.log(arr)

10、对象简洁表示法

// 对象简洁表示法
        // let a= 1;
        // const obj = {
        //     a ；a
        // }
        // const obj = {a}
        // console.log(obj)

        // const obj = {
        //     fn:function(){
        //         console.log(1);
        //     },
        //     fn2(){
        //         console.log(2);
        //     }
        // }
        //  obj.fn();
        //  obj.fn2()

        // Object.is
        // console.log(Object.is(NaN,NaN))
        // console.log(Object.is(+0,-0))

        // Object.assign
        // let obj1 ={a:1}
        // let obj2 ={a:2,b:3}
        // let obj3 ={c:'abc'}
        // Object.assign(obj1,obj2,obj3)
        // console.log(obj1)

11、箭头函数

// function fn(a=0,b=10){
//     console.log(a+b)
// }
// fn()

// function sum(...arr){
//     var res = 0;
//     for(var i = 0;i<arr.length;i++){
//         res +=arr[i]
//     }
//     console.log(res)
// }
// sum(10,2,5,2,3,5,50,55)

// const fn = a=>a;
// const fn2=function(a){
//     return a;
// }
// console.log(fn(1))
// console.log(fn2(2))

// const fn =( a , b)=>{
//     a= a*2;
//     b= b*3;
//     return a+b
// };
// console.log(fn(5,4))

// var arr = [5,3,6,8,4,3,5,21,64,9];
// arr.sort(function(a,b){
//     return a - b;
// })
// console.log(arr)

// arr.sort((a,b)=>a-b);
// console.log(arr)


// function fn(){
//     setTimeout(function(){
//         console.log(this);
//     },1000)
//     setTimeout(()=>{
//         console.log(this);        
//     },1000)
// }
// let nb = 1;
// fn.call(nb)
// 箭头函数无法使用call apply bind 去改变内部this的指向


// 箭头函数没有 arguments  对象可以用Rest参数替代
// function fn(){
//     setTimeout(function(){
//         console.log(arguments)
//     },1000)
//     setTimeout(()=>{
//         console.log(arguments)
//     },1000)
// }
// fn(1,2,3)

12、promise

/* let imgs = [
        'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2930820613,1775350667&fm=26&gp=05.jpg',
        'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595940402982&di=c649cef2483c30e767a8b70d7716384d&imgtype=0&src=http%3A%2F%2Fwww.autoimg.cn%2Falbum%2F2010%2F5%2F29%2F4d424a4b-7211-434d-836a-9d27c1c64592.gif',
        'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595940517707&di=c2a09d64d49f10c92d9d9241ba258248&imgtype=0&src=http%3A%2F%2Fww2.sinaimg.cn%2Fthumb180%2F6e690447gw1f6aro62306j20m80hx78b.jpg'
        ]
       new Promise(cd)   状态：pending(进行中) resolved  (成功)rejected  (失败)   方法then      catch
        let p = new Promise((成功执行-resolved,失败执行-rejected)=>{})
        let p = new Promise((aaa,bbb)=>{
            let img = new Image();
            img.src = imgs[0];
            img.οnlοad=function(){
                aaa(this);
            };
            img.onerror = function(){
                bbb(new Error('失败'))
            }
        });
        console.log(123)
        p.then(function(img){
        console.log('成功')
            document.body.appendChild(img)
        }).catch((err)=>{
            console.log(err)
        })
        console.log(456) 
        
        xxx(imgs[0]).then((img)=>{
        console.log('成功')
            document.body.appendChild(img)loadImg
        })
        
        */
         
        /*function xxx(url){
            let p = new Promise((aaa,bbb)=>{
            let img = new Image();
            img.src = url;
            img.οnlοad=function(){
                aaa(this);
            };
            img.onerror = function(){
                bbb(new Error('失败'))
            }
            });
            return p;
        }     
        
        let xxxx = Promise.all([xxx(imgs[0]),xxx(imgs[1]),xxx('')]);
        xxxx.then((datas)=>{
            console.log(datas)
            datas.forEach((item,i)=>{
                document.body.appendChild(item)
            })
        }).catch((err)=>{
            console.log(err)
        })
        Promise.resolve(xxx(imgs[0])).then((img)=>{
            document.body.appendChild(img)
    })
*/

13、map