关于JS数组去重的探索

关于JS数组去重的问题：

重点就是如何判断“重复”

判断是否重复的条件：每个元素类型&值都相同

思路：通过遍历或indexof查找每个元素的类型+值是否相同

 

我们先来看一下检测数据类型的方法：

1.typeof:检测基本数据类型：String,Number,Object,Null,Undefined,无法判断function(有些浏览器会出错),array,RegExp

console.log(typeof []);//object
console.log(typeof {});//object
console.log(typeof /\d/);//object
console.log(typeof null);//object
console.log(typeof '');//string
console.log(typeof 1);//number
console.log(typeof undefined);//undefined
console.log(typeof true);//boolean
console.log(typeof function(){});//function

2.instanceof:检测引用类型，判断Array和RegExp，无法准确判断Function，无法判断String和Number

console.log([] instanceof Array);//true
console.log({} instanceof Object);//true
console.log(/\d/ instanceof RegExp);//true

console.log(function(){} instanceof Object);//true
console.log(function(){} instanceof Function);//true

console.log('' instanceof String);//false
console.log(1 instanceof Number);//false

3.Object.prototype.toString用于精确区分数据类型

var type=Object.prototype.toString
console.log(type.call(''));//object String
console.log(type.call([]));//object Array
console.log(type.call({}));//object Object
console.log(type.call(false));//object Boolean
console.log(type.call(null));//object Null
console.log(type.call(undefined));//object Undefined
console.log(type.call(function(){}));//object Function

4.constructor属性返回对创建此对象的数组函数的引用

console.log("".constructor == String);//true
console.log((1).constructor == Number);//true
console.log(false.constructor == Boolean);//true
console.log([].constructor == Array);//true
console.log({}.constructor == Object);//true
console.log(function(){}.constructor == Function);//true

console.log(/\d/.constructor==RegExp);//true
console.log(RegExp.constructor==Function);//true

5.JSON.stringify

官网的描述是这样的：

关于序列化，有下面五点注意事项：

• 非数组对象的属性不能保证以特定的顺序出现在序列化后的字符串中。
• 布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值。
• undefined、任意的函数以及 symbol 值，在序列化过程中会被忽略（出现在非数组对象的属性值中时）或者被转换成 null（出现在数组中时）。
• 所有以 symbol 为属性键的属性都会被完全忽略掉，即便 replacer 参数中强制指定包含了它们。
• 不可枚举的属性会被忽略

JSON.stringify({});                             // '{}'
JSON.stringify(true);                          // 'true'
JSON.stringify(123);                          // '123'
JSON.stringify("123")                         //'"123"'
JSON.stringify([1, "false", false]);       // '[1,"false",false]'
JSON.stringify({x: 5, y: 6});              // "{"x":5,"y":6}"

 

大部分情况下，数组内元素为对象或数组或值，JSON.stringify序列化后，可以区分不同的对象，数组，值，所以采用该方法比较简单

<script type="text/javascript">
      function unquie1(arr){
           var result=[];
           var hash={}; //创建hash对象，代替indexof 
           for(var i=0;i<arr.length;i++){
                var key=JSON.stringify(arr[i])+arr[i] ;
                //若对象中的key属性值不为1(对象hash中不存在key属性)，就把arr[i]压入结果数组，并设置hash的key属性值为1
                if(hash[key]!==1){
                       result.push(arr[i]);
                       hash[key]=1;
                }
           }
           console.log(result)
      }
      window.onload=function(){
           var arr=[
                     {name:'apple',type:'1'},["name:apple","type:1"],{name:'apple',type:1},{name:'apple',type:'1'},
                     [123,"123"],[123,123],[123,'123']
                   ]
           unquie(arr)
      }
</script>

 输出结果如下：

 可以看到对于多维数组，对象数组的“重复”判断还是比较精准的

 

如若有误，欢迎指正