zoukankan      html  css  js  c++  java
  • ES6学习笔记三

    1、Symbol

    ES5 的对象属性名都是字符串,这容易造成属性名的冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。

     {
         //声明
         let a1=Symbol();
         let a2=Symbol();
         console.log(a1===a2)  //false,生成的a1跟a2都是独一无二
         let a3=Symbol.for('a3');  //Symbol.for()里面有key时,先全局搜索一下,有的话就直接赋值,没有的话就生成一个a3的变量
         let a4=Symbol.for('a3');
         console.log(a3===a4);   //true    
     }
    
     // 应用场景
     {
         let a1=Symbol.for('abc');
         let obj={
             [a1]:'123',
             'abc':345,
             'c':456
         }
         console.log("obj",obj)   //{abc:'123',Symbol('abc'):345,c:456}
     }

    2、数据结构

    Set-Map数据结构

    定义:类似于数组的数据结构,成员值都是唯一且没有重复的值,数据结构====》》{"a", "b", "e", "f", "d"}

    应用场景

    去重字符串:[...new Set(str)].join("")
    去重数组:[...
    new Set(arr)]或Array.from(new Set(arr))

     

    知识点1:set集合

    add()新增

    {
        let list = new Set();
        list.add(5);
        list.add(7);
        console.log('size',list.size);   // 2 size计算长度
    }
    {
        let list = new Set();
        list.add(1);
        list.add(2);
        list.add(1);
        console.log('list',list);  //list Set(2) {1, 2}  // 不允许成员重复,所以还是[1、2]
    }

    应用场景去重,但是不做数据类型转换!!

    // 应用场景去重
    {
        let arr=[1,2,3,4,1,2];
        let list=new Set(arr); 
    
        console.log('unique',list);  //1,2,3,4
    
    }
    //set去重不做数据类型转换
    {
        let arr2=[1,2,3,4,1,'2'];
        let list2=new Set(arr2); 
    
        console.log('unique',list2);  //1,2,3,4,'2'
    
    }

    Set的几个方法 (add,delete,clear,has

    {
        let arr=['add','delete','clear','has'];
        let list=new Set(arr);
    
        console.log('has',list.has('add'));  //ture  是否存在这个元素
        console.log('delete',list.delete('add'),list);  //Set(3) {"delete", "clear", "has"}  //删除某个元素
        list.clear();   //Set(0) {}   清空元素
        console.log('list',list); //Set(0) {} 

    //数据如果存在。set直接修改数据本身,它只是引用,要是不确定的话,要用forEach来循环 }

    Set遍历的方法(其中val值跟key值相同)

    {
        let arr=['add','delete','clear','has'];
        let list=new Set(arr);
        for(let key of list.keys()){
            console.log('keys',key);
        }
        for(let value of list.values()){
            console.log('values',value);
        }
        for(let [key,value] of list.entries()){
            console.log('entries',key,value);
        }
        list.forEach(function(item){console.log(item);})
    }

    weakSet 和set支持的数据对象不同。weakSet必须是对象,其它不支持。是弱引用

    3、Map()数据结构

    map()跟set()的区别是map的key值可以是任何数据类型,而set的key值类型只能是字符串。set添加字符串的方法是add(),而map添加属性的方法是set()以键值的形式。获取的方法是get()!其它的查也是has(),删也是delete()!!!!

    map的定义方式1,不带参数

    {
        let map = new Map();
        let arr=['123'];
        map.set(arr,456);
        console.log('map',map,map.get(arr));   //Map(1) {Array(1) => 456} 456
    }

    map的定义方式2,带参数

    {
        let map = new Map([['a',123],['b',456]]);  //注意格式
        console.log('map args',map);  //map args Map(2) {"a" => 123, "b" => 456}
        console.log('size',map.size); //里面元素个数
        console.log('delete',map.delete('a'),map); 
        console.log('clear',map.clear(),map); 
    }

    4、数据结构Map跟Set与数组array跟对象Object的对比

    增、删、改、查

    map与数组比较

    {
        // 数据结构横向对比,增,查,改,删
        let map=new Map();
        let array=[];
        //
        map.set('t',1);
        array.push({t:1});
    
        console.info('map-array',map,array) //map-array Map(1) {"t" => 1} [{t,1}]
    
        //
        let map_exist=map.has('t');
        let array_exist=array.find(item=>item.t);
        console.info('map-array',map_exist,array_exist);
    
        //
        map.set("t",2);
        array.forEach(item=>item.t?2:'');
        console.info('map-array-modify',map,array);
    
        //
        map.delete('t');
        let index=array.findIndex(item=>item.t);
        array.splice(index,1);
        console.log('map-array-delete',map,array);
    }

     set与数组比较

    {
        let set=new Set();
        let array=[];
        //
        set.add({t:1});
        array.push({t:1});
    
        console.info('set-array',set,array);
    
        //
        let set_exist=set.has({t:1});
        let array_exist=array.find(item=>item.t);
        console.info('set-array',set_exist,array_exist);
    
        //
        set.forEach(item=>item.t?item.t=2:'');
        array.forEach(item=>item.t?item.t=2:'');
        console.info('map-array-modify',set,array);
    
        //
        set.forEach(item=>item.t?set.delete(item):'');
        let index=array.findIndex(item=>item.t);
        array.splice(index,1);
        console.info('map-array-empty',set,array);
    }

    set、map与对象比较

    {
        let item={'t':1};
        let set=new Set();  //唯一性时考虑
        let map=new Map();  //优先考虑
        let obj={};
    
        //
        set.add(item);
        map.set('t',1);
        obj['t']=1;
    
        console.log('map-set-obj',obj,map,set);
    
        //
        console.info({
            map_exist:map.has('t'),
            set_exist:set.has(item),
            obj_exist:'t' in obj
        })
    
        //
        map.set('t',2);
        item.t=2;  //set直接修改数据类型
        obj['t']=2;
        console.log('map-set-obj-modify',obj,map,set);
    
        // 删除
        map.delete('t');
        set.delete(item);
        delete obj['t'];
        console.log('map-set-obj-empty',obj,map,set);
    
    }
  • 相关阅读:
    selenium
    js兼容
    gcc 编译问题
    winrar 命令行 解压文件
    php 页面 不显示任何错误提示
    php 禁止谷歌蜘蛛抓取
    LINUX 实现端口转发
    phpredisadmin 莫名其妙错误,打开了无法显示任何数据
    Convert.ToInt32、(int)和int.Parse三者的区别
    C# 点击打开浏览器
  • 原文地址:https://www.cnblogs.com/qdlhj/p/9912130.html
Copyright © 2011-2022 走看看