Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

JavaScriptの子オブジェクトのプロパティに基づく配列のグループ化


一部の車に関するデータを含むオブジェクトの配列があります。配列は次のように与えられます-

const cars = [{
   company: 'Honda',
   type: 'SUV'
}, {
   company: 'Hyundai',
   type: 'Sedan'
}, {
   company: 'Suzuki',
   type: 'Sedan'
}, {
   company: 'Audi',
   type: 'Coupe'
}, {
   company: 'Tata',
   type: 'SUV'
}, {
   company: 'Morris Garage',
   type: 'Hatchback'
}, {
   company: 'Honda',
   type: 'SUV'
}, {
   company: 'Tata',
   type: 'Sedan'
}, {
   company: 'Honda',
   type: 'Hatchback'
}];

typeプロパティの値が同じであるすべてのオブジェクトが一緒に表示されるように、オブジェクトをグループ化するプログラムを作成する必要があります。

タイププロパティに従って配列を並べ替えるだけで、オブジェクトはタイププロパティのアルファベット順に並べられます。

これを行うための完全なコードは-

になります
const cars = [{
   company: 'Honda',
   type: 'SUV'
}, {
   company: 'Hyundai',
   type: 'Sedan'
}, {
   company: 'Suzuki',
   type: 'Sedan'
}, {
   company: 'Audi',
   type: 'Coupe'
}, {
   company: 'Tata',
   type: 'SUV'
}, {
   company: 'Morris Garage',
   type: 'Hatchback'
}, {
   company: 'Honda',
   type: 'SUV'
}, {
   company: 'Tata',
   type: 'Sedan'
}, {
   company: 'Honda',
   type: 'Hatchback'
}];
const sorter = (a, b) => {
   return a.type.toLowerCase() > b.type.toLowerCase() ? 1 : -1;
}
cars.sort(sorter);
console.log(cars);

コンソールの出力は-

になります
[
   { company: 'Audi', type: 'Coupe' },
   { company: 'Honda', type: 'Hatchback' },
   { company: 'Morris Garage', type: 'Hatchback' },
   { company: 'Tata', type: 'Sedan' },
   { company: 'Suzuki', type: 'Sedan' },
   { company: 'Hyundai', type: 'Sedan' },
   { company: 'Honda', type: 'SUV' },
   { company: 'Tata', type: 'SUV' },
   { company: 'Honda', type: 'SUV' }
]

  1. JavaScriptでオブジェクトプロパティ名の配列を置き換える

    以下は、JavaScriptでオブジェクトプロパティ名の配列を置き換えるコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style&g

  2. JavaScriptのimage()オブジェクト。

    画像オブジェクトはHTML要素を表します。 以下はJavaScriptの画像オブジェクトのコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> &