В каком виде надо получить цвета? Если нужны строки (значения свойства name), то
[...new Set(data.variations.map(n => n.color.name))]
Если же нужны сами объекты, тогда
Object.values(Object.fromEntries(data.variations.map(n => [ n.color.name, n.color ])))
// или
Object.values(data.variations.reduce((acc, { color: n }) => (acc[n.name] ??= n, acc), {}))
// или
data.variations.map(n => n.color).filter(function(n) {
return !(this[n.name] = this.hasOwnProperty(n.name));
}, {})
Можно решить задачу и в более общем виде - сделаем функцию, параметрами которой будут итерируемый объект (помимо массивов можно будет уникализировать строки, NodeList'ы и т.п.) и функция, принимающая его элемент и возвращающая значение, по которому осуществляется уникализация:
function unique(data, key = n => n) {
const getKey = key instanceof Function ? key : n => n[key];
const keys = new Set;
const result = [];
for (const n of data) {
const k = getKey(n);
!keys.has(k) && keys.add(k) && result.push(n);
}
return result;
}
// получаем массив уникальных имён цветов
const uniqueStrColors = unique(data.variations.map(n => n.color.name));
// получаем массив объектов цветов, свойства name которых уникальны
const uniqueObjColors = unique(data.variations.map(n => n.color), n => n.name);
