JavaScript对象根据自定义属性进行排序-阿里云开发者社区

开发者社区> 开发者小助手-bz5> 正文

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

简介: JavaScript对象根据自定义属性进行排序
+关注继续查看

先看下需求。


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


var input = “” + “\n” +


“” + “\n” +


“”;


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


下面是我的代码。

<html>
<script>

var input = "![image3.png](https://upload-images.jianshu.io/upload_images/2085791-4d8b2cda3a057fb6.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)" + "\n" + 

"![image1.png](https://upload-images.jianshu.io/upload_images/2085791-9aa6232b1426df28.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)" + "\n" + 

"![image2.png](https://upload-images.jianshu.io/upload_images/2085791-04f2773c126194fe.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)";

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属性进行排序了:

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
给JavaScript的单个对象定义属性和属性的元数据
给JavaScript的单个对象定义属性和属性的元数据
6 0
从零开始学 Web 之 DOM(三)innerText与innerHTML、自定义属性
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程。此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注。在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。
1052 0
javascript学习之路之元素获取和设置属性
收拾心情,学习学习js!总结下自己的学习所得! 现有的有三种方法可以获取元素的节点,分别是通过元素ID,通过标签名和类名来获取的 1.GetElmentById:将返回一个与那个有给定ID属性的值的元素节点对应的对象,方法只有一个参数,元素的id属性的值必须放在单引号或双引号里 documrnt.
693 0
java 分解arraylist中单个对象 的属性名与值
引用:http://hi.baidu.com/%CD%F5%C7%E7%CB%EF/blog/item/0791fbc89aa0c7e252664f8d.html /** * 获取对象属性,返回一个字符串数组     *  * @param  o 对象 * @return String[]...
520 0
《JavaScript启示录》——1.4 用户自定义/非原生对象构造函数
关于构造函数比较复杂的一点就是this值在函数内部的使用方式。请记住,构造函数只是一个饼干模具,在将它与new关键字一起使用时,它会创建一个拥有构造函数内部定义的属性和值的对象。在使用new关键字时,this值的字面意思是基于构造函数内部的语句创建的新对象/新实例。
1028 0
精通SpringBoot——第十一篇:使用自定义配置
spring boot 实现自定义配置的几种方式
2809 0
使用ElementUi的table组件自定义添加升序、降序按钮和点击事件及排序
使用ElementUi的table组件自定义添加升序、降序按钮和点击事件及排序
7916 0
JavaScript之函数定义以及类型
今天在网上做到一道面试题,代码如下: var f = function g() { return 23; }; typeof g(); 问:以上代码的输出结果是() A “number” B “undefined” C “function” D Error 我第一反应选择的答案是A/C。
571 0
2497
文章
0
问答
来源圈子
更多
+ 订阅
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载