JSFiddle - React, Tailwind, and code Playground

HTML

<table id="reservations" border="2px;">
        <thead>
            <tr>
                <th>Date\Mesurment</th><th>MCHC</th><th>CBC</th><th>Pulse rate</th><th>weight</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
  </table>

JavaScript

var reservations = [
    {"date":"22-12-2013","MCHC":"22","Pulse rate":"75","weight":"50" },
    {"date":"11-12-2013","CBC":"5"},
    {"date":"11-12-2013","weight":"55"}
];

changedReservations = uniqueReservation(reservations);

var tbody = $('#reservations tbody'),
    props = ["date", "MCHC", "CBC", "Pulse rate", "weight"];
$.each(changedReservations, function(i, reservation) {
  var tr = $('<tr>');
  $.each(props, function(i, prop) {
    $('<td>').html(reservation[prop]).appendTo(tr);  
  });
  tbody.append(tr);
});

function uniqueReservation(reservations) {
    var results = [],
        cache = {}, 
        reservation,date;
    
    for (var i=0;i<reservations.length;i++) {
        reservation = reservations[i];
        date = reservation.date;
        
        if (!cache[date]) {
            cache[date] = {};
            results.push(cache[date]);
        } else {
            cache[date] = cache[date];
        }
      
        
        for (var k in reservation) {
            cache[date][k] = reservation[k];
        }
    }
 
 console.log('results',results);
 return results;
}