从 ionic3 中的数组中按名字对 alist 进行排序

Posted 2023-03-13

【中文标题】从 ionic3 中的数组中按名字对 alist 进行排序

【英文标题】：sort alist by firstName from array in ionic3

【发布时间】：2019-07-03 08:50:03

【问题描述】：

如何从数组中按firstName 对列表进行排序

my.ts 文件

initializeItems()
    this.items = [
       avatar: '../../assets/imgs/profile1.jpg', firstName:'Sterlian', lastName:'Victorian',  date:new Date().toLocaleDateString(), chat:'Life is beautiful...', component: TetherPage ,
       avatar: '../../assets/imgs/profile2.jpg', firstName:'Alexis', lastName:' Fournier ', date:'Yesterday', chat:'If you are going to use a passage...', component: TetherPage ,
       avatar: '../../assets/imgs/profile3.jpg', firstName:'Alma', lastName:'  Henry ', date:'10/1/2019', chat:'There are many variations of pass', component: TetherPage ,
       avatar: '../../assets/imgs/profile4.jpg', firstName:'Clara', lastName:' Damian ', date:'Today', chat:'nice to see you after log time ', component: TetherPage ,
       avatar: '../../assets/imgs/profile5.jpg', firstName:'James', lastName:' Charlie ', date:'Yesterday', chat:'Hi!..Have a nice day', component: TetherPage ,
       avatar: '../../assets/imgs/profile6.jpg', firstName:'Ellen', lastName:' Rhystem ', date:'2/1/2019', chat:'It is long establish fact...', component: TetherPage ,
       avatar: '../../assets/imgs/profile7.jpg', firstName:'Irene', lastName:' Reeceem ', date: new Date().toLocaleDateString(), chat:'I think we can all do with a bit more spark', component: TetherPage ,
       avatar: '../../assets/imgs/profile8.jpg', firstName:'Thomas', lastName:' Joe ', date:'Yesterday', chat:'you’re fired up ready to have the best day ever…', component: TetherPage ,
       avatar: '../../assets/imgs/profile9.jpg', firstName:'Charlie', lastName:' Kyle ', date:'3:45 am', chat:'Create the highest, grandest vision possible for your life, because you become what you believe', component: TetherPage ,
       avatar: '../../assets/imgs/profile10.jpg', firstName:'Jacob', lastName:' Henry ', date: new Date().toLocaleDateString(), chat:'Wherever life plants you, bloom with grace', component: TetherPage ,
       avatar: '../../assets/imgs/profile11.jpg', firstName:'Harry', lastName:' Callum ', date:'1/2/2019', chat:'One at a time. Just let your pile of good things grow', component: TetherPage ,
       avatar: '../../assets/imgs/profile12.jpg', firstName:'Oliver', lastName:' Jake ', date: new Date().toLocaleDateString(), chat:'Little by little, day by day, what is mean for you WILL find its way”', component: TetherPage ,
       avatar: '../../assets/imgs/profile13.jpg', firstName:'Jack', lastName:' Connor ', date:'Yesterday', chat:'Learn from yesterday, live for today, hope for tomorrow', component: TetherPage ,
       avatar: '../../assets/imgs/profile14.jpg', firstName:'Julia', lastName:' Margaret ', date: new Date().toLocaleDateString(), chat:'Take time to do what makes your soul happy', component: TetherPage ,
       avatar: '../../assets/imgs/profile15.jpg', firstName:'Jack', lastName:' Tracy ', date:'Today', chat:'Be so happy that when others look at you, they become happy too', component: TetherPage 
    ];
    this.modifiedData = JSON.parse(JSON.stringify(this.items));

【参考方案1】：

你可以这样做：

let items = [   firstName:'Random', lastName:' Fournier ', date:'Yesterday', chat:'If you are going to use a passage...', ,   firstName:'Alma', lastName:' Henry ' ,   firstName:'Clara', lastName:' Damian '  ];

items = sortByKey(items, 'firstName');

function sortByKey(array, key) 
 return array.sort(function(a, b) 
    var x = a[key]; var y = b[key];
    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
 );

【参考方案2】：

您可以使用Array.sort 和自定义比较函数使用String.localCompare 对列表进行排序：

const sorted = items.sort((a, b) => a.firstName.localeCompare(b.firstName));

请参阅有关 Array.sort 和 String.localCompare 的 MDN 文档。

const TetherPage = ;
const items = [
       avatar: '../../assets/imgs/profile1.jpg', firstName:'Sterlian', lastName:'Victorian',  date:new Date().toLocaleDateString(), chat:'Life is beautiful...', component: TetherPage ,
       avatar: '../../assets/imgs/profile2.jpg', firstName:'Alexis', lastName:' Fournier ', date:'Yesterday', chat:'If you are going to use a passage...', component: TetherPage ,
       avatar: '../../assets/imgs/profile3.jpg', firstName:'Alma', lastName:'  Henry ', date:'10/1/2019', chat:'There are many variations of pass', component: TetherPage ,
       avatar: '../../assets/imgs/profile4.jpg', firstName:'Clara', lastName:' Damian ', date:'Today', chat:'nice to see you after log time ', component: TetherPage ,
       avatar: '../../assets/imgs/profile5.jpg', firstName:'James', lastName:' Charlie ', date:'Yesterday', chat:'Hi!..Have a nice day', component: TetherPage ,
       avatar: '../../assets/imgs/profile6.jpg', firstName:'Ellen', lastName:' Rhystem ', date:'2/1/2019', chat:'It is long establish fact...', component: TetherPage ,
       avatar: '../../assets/imgs/profile7.jpg', firstName:'Irene', lastName:' Reeceem ', date: new Date().toLocaleDateString(), chat:'I think we can all do with a bit more spark', component: TetherPage ,
       avatar: '../../assets/imgs/profile8.jpg', firstName:'Thomas', lastName:' Joe ', date:'Yesterday', chat:'you’re fired up ready to have the best day ever…', component: TetherPage ,
       avatar: '../../assets/imgs/profile9.jpg', firstName:'Charlie', lastName:' Kyle ', date:'3:45 am', chat:'Create the highest, grandest vision possible for your life, because you become what you believe', component: TetherPage ,
       avatar: '../../assets/imgs/profile10.jpg', firstName:'Jacob', lastName:' Henry ', date: new Date().toLocaleDateString(), chat:'Wherever life plants you, bloom with grace', component: TetherPage ,
       avatar: '../../assets/imgs/profile11.jpg', firstName:'Harry', lastName:' Callum ', date:'1/2/2019', chat:'One at a time. Just let your pile of good things grow', component: TetherPage ,
       avatar: '../../assets/imgs/profile12.jpg', firstName:'Oliver', lastName:' Jake ', date: new Date().toLocaleDateString(), chat:'Little by little, day by day, what is mean for you WILL find its way”', component: TetherPage ,
       avatar: '../../assets/imgs/profile13.jpg', firstName:'Jack', lastName:' Connor ', date:'Yesterday', chat:'Learn from yesterday, live for today, hope for tomorrow', component: TetherPage ,
       avatar: '../../assets/imgs/profile14.jpg', firstName:'Julia', lastName:' Margaret ', date: new Date().toLocaleDateString(), chat:'Take time to do what makes your soul happy', component: TetherPage ,
       avatar: '../../assets/imgs/profile15.jpg', firstName:'Jack', lastName:' Tracy ', date:'Today', chat:'Be so happy that when others look at you, they become happy too', component: TetherPage 
];

const sorted = items.sort((a, b) => a.firstName.localeCompare(b.firstName));
console.log(sorted);