중화사전망 - 자전 검색 - JS 를 사용하여 JSON 객체 배열을 객체 속성별로 정렬하는 방법

JS 를 사용하여 JSON 객체 배열을 객체 속성별로 정렬하는 방법

이번에는 JSON 을 사용하여 객체 속성별로 JSON 객체 배열을 정렬하는 방법을 보여 드리겠습니다. JSON 을 사용하여 객체 속성별로 JSON 객체 배열을 정렬할 때 고려해야 할 사항은 무엇입니까? 다음은 실제 사례입니다. 한번 봅시다.

실제 작업에서 백그라운드에서 반환된 배열에 I 개의 JSON 데이터가 있고 JSON 의 항목 중 하나에 따라 배열을 정렬해야 하는 문제가 자주 발생합니다.

예를 들어 반환된 데이터 구조는 다음과 같습니다.

{

결과: [

{id: 1, 이름:' 중국은행'},

{id:3, 이름:' 베이징은행'},

{id:2, 이름:' 허베이 은행'}

{id: 10, 이름:' 보정 은행'},

{id:7, 이름: "물은행"}

] 을 참조하십시오

} 이제 비즈니스 요구 사항에 따라 id 의 크기에 따라 정렬하고 id 가 작은 JSON 에서 id 가 큰 JSON 으로 배열 순서를 다시 정렬해야 합니다.

Js 에 정렬 방법을 추가하려면 다음과 같이 하십시오.

여기에 JavaScript sort () 메서드가 사용됩니다. 먼저 정렬 방법을 설명합니다.

구문: array object. sort(sort by)

Sortby: 선택 사항, 정렬 순서를 지정합니다. 함수임에 틀림없다.

이 메서드를 매개 변수 없이 호출하면 배열의 요소가 알파벳순으로 정렬되거나 더 정확하게 문자 인코딩 순서로 정렬됩니다. 이렇게 하려면 먼저 배열의 모든 요소를 문자열 (필요한 경우) 로 변환하여 비교해야 합니다.

다른 기준에 따라 정렬하려면 두 값을 비교한 다음 두 값의 상대 순서를 설명하는 숫자를 반환하는 비교 함수를 제공해야 합니다. 비교 함수에는 다음과 같은 값을 반환하는 두 개의 매개 변수 a 와 b 가 있어야 합니다.

A 가 b 보다 작으면 a 는 정렬 배열에서 b 앞에 나타나야 하며 0 보다 작은 값을 반환합니다.

A 가 b 이면 0 을 반환합니다.

A 가 b 보다 크면 0 보다 큰 값을 반환합니다.

Sort(sort by) 를 사용하여 정렬하고 콘솔에 인쇄하겠습니다.

함수 sortId(a, b ){

A.id-b.id 를 반환합니다

}

Result.sort (sortid);

Console.log (결과); 전체 테스트 샘플 코드:

& lt! DOCTYPE html & gt

& lthtml & gt

& lthead & gt

& lt 메타 charset = "utf-8" >

& lttitle & gtWww.gxlcms.com JSON 배열 정렬

& lt/head & gt;;

& ltbody & gt

& lt 스크립트 & gt

Var 결과 = [

{id: 1, 이름:' 중국은행'},

{id:3, 이름:' 베이징은행'},

{id:2, 이름:' 허베이 은행'},

{id: 10, 이름:' 보정 은행'},

{id:7, 이름: "물은행"}

] 을 참조하십시오

함수 sortId(a, b ){

A.id-b.id 를 반환합니다

}

Result.sort (sortid);

Console.log (결과);

& lt/스크립트 >

& lt/body & gt;;

& lt/html & gt;; 그런 다음 콘솔을 검사하여 정렬이 성공했는지 확인합니다.

이 사건을 다 보고 나면, 너는 이미 방법을 익혔다고 믿는다. 더 멋진 Gxl 의 다른 관련 문장 들을 주목해 주세요!

추천 읽기:

Vuex 시작하기 자습서 단계에 대한 자세한 설명

고급 방식으로 vuex 를 사용하는 방법

Vue 관리 템플리트를 사용한 최적화 단계에 대한 자세한 설명