Как зациклить присвоение цветов в массив объектов?

Question

[newked]

У меня есть вот такой простенький код:

<script>
        var colors = ["#ccc","#333","#666"];
        var data = [
            { name: "Семен" },
            { name: "Роман" },
            { name: "Николай" },
            { name: "Аркадий" },
            { name: "Жорж" }
        ]
        var result = data.map((x,i)=>{return {...x, color: colors[i]}})
    </script>

После того как код отработал в result запишется это:

[
    { "name": "Семен", "color": "#ccc" },
    { "name": "Роман", "color": "#333" },
    { "name": "Николай", "color": "#666" },
    { "name": "Аркадий", "color": undefined },
    { "name": "Жорж", "color": undefined }
]

А надо чтобы записалось это:

[
    { "name": "Семен", "color": "#ccc" },
    { "name": "Роман", "color": "#333" },
    { "name": "Николай", "color": "#666" },
    { "name": "Аркадий", "color": "#ccc" },
    { "name": "Жорж", "color": "#333"  }
]

Ну то есть надо зациклить присвоение цветов.

Answer 1

[newked]

Всем спасибо, ответ найден:

<script>
        var colors = ["#ccc","#333","#666"];
        var data = [
            { name: "Семен" },
            { name: "Роман" },
            { name: "Николай" },
            { name: "Аркадий" },
            { name: "Жорж" }
        ]
        var result = data.map((x,i)=>{return {...x, color: colors[i % colors.length]}})
    </script>