js数组对象去重处理

js数组对象去重处理

js的数组去重,是js常谈的问题,网上的解决办法很多例如这里边用的先排序的方式再去重的,还有一些ES6的方式这里暂不介绍了,下边还是保持es5的语法处理数组对象的去重,就像数据里边有歌曲,歌曲去重一样,可能有更加便捷方案,下放这个方案能解燃煤之急,有不足之处希望能指出,共同进步

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>js数组对象去重处理</title>
	</head>
	<body>
	</body>
	<script type="text/javascript">
		
		var arr1 = [
			{
				id: 1,
				name: '张 杰',
				wife: '谢娜',
				song: '第一夫人'
			},
			{
				id: 2,
				song: '淋雨一直走',
				name: '张韶涵'
			},
			{
				id: 2,
				name: '张韶涵',
				song: '淋雨一直走'
			},
			{
				name: '张杰',
				id: 1,
				wife: '谢娜 ',
				song: '第一 夫人'
			},
			{
				name: '张韶涵',
				song: '淋   雨一直走',
				id: 2
			},
			{
				name: '张杰',
				wife: '谢	娜',
				id: 3,
				song: '第一夫人',
			},
			{
				name: '张韶涵',
				id: 4,
				song: '淋雨一直走'
			}
		];
		// 运行对象去重
		console.log(unRepeatObject(arr1));
		/**
		 * 数组对象去重
		 * @param {Array} arr 数组
		 * @return {Array} newArr 数组
		 */
		function unRepeatObject(arr){
			var tmepArr = [];
			// 将数组对象转成数组字符串
			var newStr = changeArrStr(arr);
			newStr.sort();
			// 数组去重
			for(var i=0;i<newStr.length;i++){
				if(newStr[i] !== tmepArr[tmepArr.length-1]){
					tmepArr.push(newStr[i]);
				}
			}
			var newArr = [];
			// 新数组字符串转成数组对象
			for(var i=0;i<tmepArr.length;i++){
				newArr.push(JSON.parse(tmepArr[i]));
			}
			return newArr;
		}
		
		/**
		 * 数组内容对象转成字符串,去空,排序
		 * @param {Object} arr
		 * @return {Array} newArr
		 */
		function changeArrStr(arr){
			var newArr = [];
			if(arr.length !== 0){
				for(var i=0;i<arr.length;i++){
					var thisObj = sortObjectFun(arr[i]);
					var thisStr = JSON.stringify(thisObj);
					thisStr = thisStr.replace(/(\s|[\\t])/g,''); // 去除空格及\t空白字符
					newArr.push(thisStr);
				}
			}
			return newArr;
		}
		/**
		 * 对象排序
		 * @param {Object} obj
		 * @return {Object} newObj
		 */
		function sortObjectFun(obj){
			var keyArr = [];// 对象的key
			for(var item in obj){
				keyArr.push(item);
			};
			keyArr.sort(); // 降序
			var newObj = {};
			for(var i=0;i<keyArr.length;i++){
				newObj[keyArr[i]] = obj[keyArr[i]]
			}
			return newObj;
		}
	</script>
</html>

有不足指出还望广大技术大牛指出
发布了34 篇原创文章 · 获赞 5 · 访问量 5万+

猜你喜欢

转载自blog.csdn.net/jason_renyu/article/details/79288932
今日推荐