將元素移動到數組的第一個位置

Question

我有一個這樣的對象：

var data = [
    { id: "fmgbwe45", age: 24, gender: "male"   },
    { id: "kjregh23", age: 27, gender: "female" }, 
    { id: "kjfdhg87", age: 30, gender: "male" }, 
    { id: "lsdjfk43", age: 10, gender: "female" }, 
]

我想對對象進行排序，這是我的預期輸出：

var data = [
    { id: "kjfdhg87", age: 30, gender: "male" },  //only one record will match in my sort
    { id: "fmgbwe45", age: 24, gender: "male"   },
    { id: "kjregh23", age: 27, gender: "female" }, 
    { id: "lsdjfk43", age: 10, gender: "female" }, 
]

我試過這個：

$scope.sort_by = function (newSortingOrder) {
    var stringToFilter = newSortingOrder.toString();   //this holds 'kjfdhg87'
    var obj = data.sort(function(o) { return o.id - stringToFilter; });
    var finalObj = [obj];
    sortedData = finalObj;
    console.log(sortedData ); //sorting is not working as expected where im doing wrong.
}

Answer 1

由於您只是將一項移動到頂部，因此我將只使用splice()和unshift()該項：

 var data = [ { id: "fmgbwe45", age: 24, gender: "male" }, { id: "kjregh23", age: 27, gender: "female" }, { id: "kjfdhg87", age: 30, gender: "male" }, { id: "lsdjfk43", age: 10, gender: "female" }, ] data.forEach(function(item,i){ if(item.id === "kjfdhg87"){ data.splice(i, 1); data.unshift(item); } }); console.log(data);

Answer 2

您可以使用unshift方法。

 var data = [ { id: "fmgbwe45", age: 24, gender: "male" }, { id: "kjregh23", age: 27, gender: "female" }, { id: "kjfdhg87", age: 30, gender: "male" }, { id: "lsdjfk43", age: 10, gender: "female" }, ] var stringToFilter = 'kjfdhg87'; //this holds 'kjfdhg87' data.unshift(data.splice(data.findIndex(item => item.id === stringToFilter), 1)[0]) console.log(data);

Answer 3

這是一種不同的非變異方法。 我僅將 TypeScript 用於 Person 定義，但除此之外只是 ES6。

基本上我們只需要：

1. 從原始數組中過濾出人物
2. 在開頭再次插入

movePersonInArray(person: Person, arrayOfPersons: Person[]): Person[] {
    // remove the item from the array
    const filteredArrayOfPersons = arrayOfPersons.filter((p: Person) => p.id !== person.id);
    // add it at the beginning
    return [{ ...person }, ...filteredArrayOfPersons];
}

如果您不介意稍微混合一些東西，您可以避免使用擴展運算符並使用unshift代替。 我特別不喜歡將改變數組的函數與不改變數組的函數混合使用，但在某些情況下，您可能會獲得一些性能改進。 例如，對於一個很長的數組，原始方法中的以下更改將在保持易讀性的同時加快速度。

movePersonInArray(person: Person, arrayOfPersons: Person[]): Person[] {
    // remove the item from the array
    const filteredArrayOfPersons = arrayOfPersons.filter((p: Person) => p.id !== person.id);
    // add it at the beginning
    filteredArrayOfPersons.unshift({...person});
    return filteredArrayOfPersons;
}

這兩種方法都不會改變arrayOfPersons數組，而是返回帶有更改的副本。 在這里您可以了解有關數組變異方法的更多信息https://doesitmutate.xyz/

附注。 Person類型可以是這樣的：

export interface Person {
id: string;
name: string;
age: number;
}

和平！