箭头函数、字符串、Symbol 类型、set、map

2022-01-01 13:04:56 阅读：151 来源： 互联网

标签：map set console log Symbol 解构遍历 key var

箭头函数

如果函数中只有一句话，并且是使用return 返回的，可以省略{}
    var sum=(a,b)=>a+b;

 如果函数中有且仅有一个参数时，可以省略()
 var getSum=a=>a+10;

如果函数中没有参数，或者有1个以上的参数时，必须使用()
var getSum=()=>10;

箭头函数中 this指向
this指向当前箭头函数外上下文环境的this指向

箭头函数中 this指向

this指向当前箭头函数外上下文环境的this指向

解构赋值

数组解构

 var arr=[1,2,3,4];
        var [a,b]=arr;
        数组解构，将会将数组的元素按位传入到前面的变量上一一赋值，原数组不改变
        没有对应的值就是undefined
         var [a,b,c,d,e=10]=arr;
         如果e没有解构获得值是，默认值为10

           var a=2,b=1;
        var [a,b]=[b,a];

对象解构

对象解构赋值是按照对象的属性解构,不区分先后顺序

var obj={a:1,b:2};
        var {c,d,a,b}=obj;


         var obj={
        a:1,
        b:{
            a:3
        }
    }
 a:a1 这种是起别名  有相同的属性名时必须起别名
    b=5 这种是附默认值，就是解构后没有赋值的默认为5
 var {a,b:{a:a1,b=5,c:c1=10}}=obj;
    console.log(a,a1)

function fn({a,b}){

    }

    fn({b:10,a:1});

    这样写可以不用考虑参数先后顺序

 function fn({a,b,c=10}={a:1,b:2,c:5}){
        console.log(a,b,c);
    }
    fn({b:5,a:6});//6,5,10
    如果没有给参数时，才会启用后面的对象对前面的参数做解构赋值
    fn();//1,2,5

字符串

判断某个字符是不是在字符串的最前面
str.startsWith("a")

判断某个字符是不是在字符串的最后
str.endsWith("f)

判断num是否长度达到两位，如果不足就在前面补0
num.padStart(2,"0");

判断num是否长度达到两位，如果不足就在后面补0
num.padEnd(2,"0");

将某个字符串重复n次
str.repeat(3)

字符串模板

 var str=`
            <div>
                <span></span>
        `
    
    插值
    var str=`小明今年${age}岁了`

    ul.innerHTML=arr.reduce((v,t)=>v+`<li><a href='http://${t.url}'>${t.site}</a></li>`,"")

Symbol 类型永不重复

去除魔术字符串，让判断的内容是唯一的

对象的key可以是string和symbol，如果不是这两种会隐式转换为string类型

这里可以将对象中key作为唯一key使用，不会产生冲突
        var a=Symbol(),b=Symbol(),c=Symbol();
        var obj={
            [a]:1,
            [b]:2,
            [c]:3
        }
        console.log(obj[a])
        console.log(obj.a);

set 集合类似于数组

数组是一种紧密结构，插入删除速度慢，数组会有重复元素，优点就是可以排序，根据某个元素找到前一位和后一位元素内容

Set 插入删除速度快，无序，可以只存储数据不需要有key，不会重复，并且有存储数据总数

这四个都是迭代器类型**

arguments  
HTMLCollection
NodeList
Array

var s=new Set(iterable);
        s.add(4); 添加一个元素放在set中
        s.add(3);
        s.clear(); 清空set集合
        s.delete(2);删除元素
    遍历元素
     s.forEach(t=>{
            console.log(t)
        })

         console.log(s.has(2)) 判断在集合中是否有这个元素

         s.size  集合的长度 等同于数组的length

 遍历迭代器类型
         for(let value of s){
             
         }

WeakSet 弱引用Set 只能存储引用类型，不能遍历

Map 类似于object

Object 松散结构，键值对结构，添加删除速度快，无法排序，只能使用string和symbol作为键，对象没有长度

Map 有长度，key可以是任意类型

var m=new Map()
m.set("a",1); 添加键和值

console.log(m.get("a")) 根据键获取值

m.clear() 清除所有的内容

m.delete("a"); 删除键所对应的值

遍历键和值
m.forEach((value,key)=>{
            console.log(value,key)
        })


console.log( m.has("a")) 判断是否有a这个键

console.log(m.size) 判断map中的存储数量

通过for of遍历
 for(var [key,value] of m){
            console.log(key,value)
        }
只遍历值不遍历键
 for(var value of m.values()){
            console.log(value)
        }
只遍历键不遍历值
        for(var key of m.keys()){
            console.log(key)
        }

WeakMap 弱引用Map 只能使用引用类型作为键和值

标签：map,set,console,log,Symbol,解构,遍历,key,var
来源： https://www.cnblogs.com/ciyisheng/p/15755241.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9