7.11笔记 symbol、set、map、数组对象的一些方法

笔记

1. symbol

• ES5的对象属性名都是字符串，这容易造成属性名冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin模式），新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是ES6引入symbol的原因

• 是一个新的变量类型 。ES6引入了一种新的原始数据类型symbol，表示独一无二的值。它属于JavaScript语言的数据类型之一，其他数据类型是undefined、null、布尔值（Boolean）、字符串（string）、数值（number）、大整数（bigInt）、对象（Object）

• 用于生成唯一的值，至于如何保证是唯一的值，是js解释器的事情Symbol的参数只是用于描述当前Symbol生成的唯一的值的含义，并没有实际意义

• symbol函数可以接受一个字符串作为参数，表示对symbol实列的描述，主要是为了在控制台显示，或者转为字符串时，比较容易区分

					//symbol的参数只是用于描述当前symbol生成的唯一的值的含义，并没有实际意义
					let  watchData = Symbol('compile');
					console.log(watchData);//生成一个独一无二的值
					console.log(typeof watchData);

					let Compile = Symbol('compile');
					console.log(Compile);
					console.log(typeof Compile);
					//symbol只要执行一次就会生成一个唯一的值，所以下面两个不相等
					console.log(watchData  ==  Compile);

set

• 创建set：new Set()
• 就是一个对象，就是键值对，键和值是相等的，带来的后果是：set里面没有重复的值
• 对象里面的属性名 不能重复

				   let set = new Set();
				   console.log(set);
				   set.add(100);
				   set.add(200);
				   set.add(300);
				   console.log(typeof set);//类型
				   console.log(set.size);//3

				   set.delete(200);

				   //把数组转换为set
				   let set1 = new Set([100, 200, 300]);
				   console.log(set1);

• 可以用于数组的去重

				   let arr = [5,6,5,6,4,8894,521,5,56,54,5];
				   console.log(Array.from(new Set(arr)));//[5, 6, 4, 8894, 521, 56, 54]
				   console.log([...new Set(arr)]);//数组去重最简单的方式

• 方法的使用

				//用构造函数的原型思想去理解所有的方法
			   let set = new Set();
			   set.add(500);
			   console.log(set);
			   console.log(set.has(300));//false has判断里面是否包含这个数300
			   console.log(set.has(500));//true
			   console.log(set.keys());
			   console.log(set.entries());//可以观察到键值对是相等的

			        let 
						arr1 = [1, 2, 2, 2, 3, 4, 32, 56, 78, 90], 
						arr2 = [2, 2, 33, 5, 89, 90, 23, 45];
					//求数组的并集 数组合并并去重
					console.log([...new Set([...arr1, ...arr2])]);//[1, 2, 3, 4, 32, 56, 78, 90, 33, 5, 89, 23, 45]

					//求数组的交集
					console.log([...new Set(arr1.filter(n => arr2.includes(n)))]);//[2, 90]

2.Map

• 创建map：new Map（）；
• 就是一个对象，就是键值对；键可以是任意类型
• 注意：只有对同一个对象的引用，Map才将其视为同一个键

		let obj={
					username:'小红',
					age:18,
					gender:'female'
				};

• Map 的键实际上是跟内存地址绑定的，只要内存地址不一样，就视为两个键

3.数组对象的一些方法

es5 ： push pop shift unshift splice ……
es6 ：find inludes findIndex fill entries keys values flat ……

tips:这些是我自己做的一点笔记，可能不是特别详细（也可能有错，望指正），若想了解的更深入一些，建议查看官网。

1. find：返回数组中第一个满足测试条件的元素的值，否则返回undefined

        // find
        let arr=[3,454,56,67,2];
        let found=arr.find(function(el){
            if(el>50){
                return true
            }
        })
        console.log(found);//454

2. includes:判断一个数组中是否包含一个指定的值，如果包含返回true，否则返回false

		//includes
        let arr=[23,4,5,54];
        console.log(arr.includes(4));//true
        console.log(arr.includes(3));//false

3. findIndex:返回数组中满足测试条件的第一个元素的索引，没有找到则返回-1

        // findIndex
        let arr=[23,4,5,54];
        let findMax=arr.findIndex(function(el){
            if(el<20){
                return el;
            }
        })
        console.log(findMax);//1

        let arr=[23,4,5,54];
        let findMax=arr.findIndex(function(el){
            if(el<2){
                return el;
            }
        })
        console.log(findMax);//-1

4. fill: 固定值填充一个数组从起始索引到终止索引内的全部元素，但是不包括终止索引

        // fill(value[,start[, end]])
        let arr=[23,4,5,54];
        console.log(arr.fill("a",2,3));//[23, 4, 'a', 54]
        console.log(arr.fill("b",1));//[23, 'b', 'b', 'b']
        console.log(arr.fill("c"));//['c', 'c', 'c', 'c']

5. entries keys values了解即可

• entries：返回一个新的Array Iterator对象，这个对象包含了数组中的每个索引的键/值对
• keys：返回一个包含数组中每个索引键的Array Iterator对象
• values：返回一个新的 Array Iterator 对象，该对象包含数组每个索引的值

        // entrys keys values
        let arr=[23,4,5,54];
        console.log(arr.entries());
        /*
            Array Iterator {}
            __proto__:Array Iterator
            next:ƒ next()
            Symbol(Symbol.toStringTag):"Array Iterator"
            __proto__:Object
        */ 
       
        for(let key of arr.keys()){
            console.log(key);//0 1 2 3
        }

        for(let value of arr.values()){
            console.log(value);//23 4 5 54
        }

6. flat：按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回

        //flat
        let arr=[23,5,[546,656,67,[54,65,5],6],245,63];
        console.log(arr.flat());//[23, 5, 546, 656, 67, Array(3), 6, 245, 63]
        console.log(arr.flat(2));//[23, 5, 546, 656, 67, 54, 65, 5, 6, 245, 63]