JavaScript对象根据自定义属性进行排序

138 阅读1分钟

先看下需求。

我想把这很长一大段的带有markdown格式的字符串里包含的image标签的文件名和url解析出来,连同文件名中包含的序号,一起存储到一个数组中。

var input = “image3.png” + “\n” +

image1.png” + “\n” +

image2.png”;

然后对这个数组根据序号进行排序,比如上图的image标签顺序是image3, image1和image2,但我希望排序后的顺序是image1, image2和image3.

下面是我的代码。

<html>
<script>

var input = "![image3.png](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/8876ef19bc86413a939b224db0161d53~tplv-k3u1fbpfcp-zoom-1.image)" + "\n" + 

"![image1.png](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/9b29f5206bc0409aabcb14c49e7cab26~tplv-k3u1fbpfcp-zoom-1.image)" + "\n" + 

"![image2.png](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/9c63befc8a2742b7b157fa14b8d43bbb~tplv-k3u1fbpfcp-zoom-1.image)";

var IMAGE_PATTERN = /^!\[(.*)\]\((.*)\)$/;
var IMAGE_INDEX = /^image(\d+).*$/;

function MyImage(index, name, url){
	this.index = index;
	this.name = name;
	this.url = url;
}

var imagePool = [];


function sortByIndex(v1,v2){
		if(v1.index < v2.index ){
			return -1;
		}
		else if(v1.index > v2.index ){
			return 1;
		}
		else return 0;
}


function getParsedImage(input) {

	if (input.indexOf("https://upload-images.jianshu.io") < 0 ) {
		return;
	} 
	
	var result = IMAGE_PATTERN.exec(input);
	if( result.length != 3){
		return;
	}

	var imageIndex = IMAGE_INDEX.exec(result[1]);
	console.assert(imageIndex.length === 2);
	return new MyImage(imageIndex[1], result[1], result[2]);
}
			
var raw = input.split("\n");

for( var i = 0; i < raw.length; i++){
	var each = getParsedImage(raw[i]);
	if( !!each){
		imagePool.push(each);
	}
}

imagePool.sort(sortByIndex);
debugger;

</script>
</html>

第58行传入数组原生的sort方法的参数是一个排序函数:

执行完之后,就按照我期望的MyImage对象里index属性进行排序了:

要获取更多Jerry的原创文章,请关注公众号"汪子熙":