【问题标题】:How to filter/sort an array of objects based on a single object property如何根据单个对象属性过滤/排序对象数组
【发布时间】:2021-02-04 20:50:17
【问题描述】:

我是 React.js 的新手,正在寻找一种快速简便的方法来过滤和排序我正在构建的网站的一些用户数据。基本上,我试图找到一种方法来基于 React.js 中的单个对象属性对对象数组进行排序(使用钩子)。

我有一组名为tutors 的用户。它的设置如下:const [tutors, setTutors] = useState<tutor[]>(null); 它包含tutor 对象的多个实例,该对象具有以下属性:

export interface tutor {
  lock: boolean,
  nonce: string,
  id: string,
  first_name: string,
  last_name: string,
  bio: string,
  contact_info: any,
  setup_intent: string,
  profile_pic: string,
  default_schedule: any,
  timezone_offset: string,
  education: { school: string, degree: string }[],
  subjects: string[],
  price: number,
  zoom_link: string,
  viewed: []
};

我的目标是根据用户 ID 对 tutors 进行排序(如 id 所示),以便将具有所需用户 ID 的对象推送到 tutors 数组的开头。然后我可以返回这个排序好的数组。我有一个我想要保留的用户 ID 列表,这些用户 ID 已经存储在一个名为 pinTutor 的字符串数组中。不知何故,我想根据字符串数组pinTutor 对对象数组tutors 进行排序。但是,我很难做到这一点。以下是我迄今为止尝试过的一些事情:

let arrTutors = tutors;

// Function for storing/transferring some data
function Tutor(id) {
    this.id = id;
    this.props = "";
}

// now we have tutors with IDs from "0" to "tutors.length"
for (let i = 0; i < tutors.length; i++) {
    arrTutors.push(new Tutor(i.toString()));
}

//function for sorting by pins
function sortByStar(arr){ 

    //Array for storing filtered object of arrays with userIDs from pinTutor
    let filteredtutors = []

    //Filtering
    pinTutor.forEach((tutorID) => {
        filteredtutors = arr.push(arrTutors.find(tutor => tutor.id === tutorID));
    });

    //Array for storing sorted object of arrays with userIDs from pinTutor at the start
    let sortedtutors = [];

    //Sorting
    for (let k = 0; k < tutors.length; k++) {
        for (let j = 0; j < filteredtutors.length; j++){
            if (filteredtutors[j]===tutors[k].id){
                sortedtutors = tutors.sort();
            }
        }
    }

    return sortedtutors;
}

我无法在最后根据 ID 对数组进行排序。关于如何实施的任何建议?

【问题讨论】:

  • 你知道Array.prototype.sort()吗?它与 React 和 hooks 无关,但可能有助于解决您的问题,例如 const sortedTutors = [...tutors].sort(({id:a}, {id:b}) =&gt; a-b)
  • 我知道这种方法,但不知道如何使用它对特定用户 ID 进行排序。不过,我肯定在尝试这些方面的东西,是的

标签: javascript arrays reactjs sorting object


【解决方案1】:

我假设 'id' 属性是数字,即使它是字符串数据类型。这应该适合你:

arr.sort((a,b) => (+a.id - +b.id)); 

对于 'id' 作为字母数字字符串,请使用以下代码:

arr.sort((a,b) => (+ascii(a.id) - +ascii(b.id))); 

function ascii (str: string)  {
    str = str.toUpperCase();
    let ret : string = "";
    for (var i = 0; i < str.length; i++) {
        ret += str.charCodeAt(i);
    }
    return ret;
}

请注意,打字稿中 Number 数据类型的最大数值为“9007194749250991”,因此这不适用于大于 8 个字符的字符串。

【讨论】:

  • 是数字和字母的组合,即“5b1ty21f”。有没有办法用这样的 ID 进行排序?
  • @Alex Ross,根据您的查询编辑了上面的回复。
【解决方案2】:

如果id属性是一个字符串,并且你想根据idslexicographical顺序对数组进行排序,你可以使用:

arr.sort((a,b) => (a.id.localeCompare(b.id))); 

【讨论】:

    猜你喜欢
    • 2018-12-25
    • 2021-04-15
    • 2018-07-06
    • 2017-05-25
    • 1970-01-01
    相关资源
    最近更新 更多