JSFiddle - React, Tailwind, and code Playground

HTML

<p>Show me: <select data-bind="options: uniqueSelect"></select></p>

JavaScript

var people = [
    {
    name: "Contact 1",
    address: "1, a street, a town, a city, AB12 3CD",
    tel: "0123456789",
    email: "[email protected]",
    type: "family"},
{
    name: "Contact 2",
    address: "1, a street, a town, a city, AB12 3CD",
    tel: "0123456789",
    email: "[email protected]",
    type: "friend"},
    {
    name: "Contact 3",
    address: "1, a street, a town, a city, AB12 3CD",
    tel: "0123456789",
    email: "[email protected]",
    type: "friend"}
];


function ContactsViewModel(people) {

    var self = this;
    self.contacts = ko.observableArray(people);

    self.uniqueSelect = ko.dependentObservable(function() {
        var types = ko.utils.arrayMap(self.contacts(), function(item){ return item.type})
        return ko.utils.arrayGetDistinctValues(types).sort();
    });
}

ko.applyBindings(new ContactsViewModel(people));