Comment injecter des valeurs d'un tableau dans un objet en utilisant JavaScript?

Je voudrais extraire des valeurs d'un objet (done), qui sont placées dans un tableau (done), puis ces valeurs sont modifiées (par une bibliothèque d'interpolation) et me sont renvoyées sous forme de tableau de valeurs.

I souhaite réinsérer ces valeurs dans un objet de la même forme d'où elles proviennent.

Mais je suis coincé sur quelque chose d'assez basique, et certainement faisable.

I avoir un exemple d'état, comme ceci (cela pourrait être une forme totalement différente, ceci n'est qu'un exemple):

  // make sure tweened values are in an array
  var valuesArr = Array.isArray(tweenedValues) ? tweenedValues : [tweenedValues]
  // this object will hold tween values of current frame/progress, 
  // set to original state for now... we'll update it's values from 
  // valuesArr later
  var tweenedState = self.state
  // set the newState properties with new values from valuesArr
  // (newState is the state passed into the tweenState() method)
  Object.keys(newState).forEach((key, index) => {
    if (typeof newState[key] === "object") {
      Object.keys(newState[key]).forEach(key2 => {
        tweenedState[key][key2] = valuesArr[index]
      })
    } else {
      tweenedState[key] = valuesArr[index]
    }
  })
  console.log("tweenedState: ", tweenedState)

J'ai un nouvel état, dans lequel je veux passer ma méthode d'interpolation:

tweenedState = { 
  ignore: "me",
  count: 50.1231,
  foo: 34.43543,
  bar: {
    baz: 456.4543
  }
}

Il y a une bibliothèque d'interpolation dans la méthode tweenState , qui produit un tableau de ces valeurs à chaque "image" de l'animation :

// NOTE: I only pass in the properties I wanna tween!!

myApp.tweenState({ count: 100, foo: 50, bar: { baz: 999 } })

// internally, the tween lib produces something like this on each frame:

tweenedValues = [ 50.1231, 34.43543, 456.4543 ]

Je voudrais insérer ces valeurs interpolées dans un objet de la même forme que l'objet d'état que j'utilise, pour créer ceci sur chaque image (comme par exemple état ci-dessus):

var newState = { 
  count: 100,
  foo: 50,
  bar: {
    baz: 999
  }
}

... jusqu'à présent, je n'ai que ce terrible code (appelé sur chaque frame):

var state = { 
  ignore: "me",
  count: 0,
  foo: 10,
  bar: {
    baz: 99
  }
}

Qui a ces problèmes évidents:

• non récursif, ne peut pas aller plus de 2 niveaux dans un objet
• dans tous les cas, la ligne tweenedState [key] [key2] = valuesArr [index] ne définit pas la valeur comme prévu
• quand je l'ai transformé en fonction récursive, il a bouclé pour toujours et s'est écrasé

J'ai donc besoin d'une fonction qui prend le tableau et insère les valeurs au bon endroit - à savoir les propriétés passées au début (ce qui crée l'objet tweenedState ).

EDIT: De toute évidence, l'objet d'état peut sembler totalement différent - celui donné n'est qu'un exemple - Il peut avoir plusieurs niveaux de profondeur, et peut contenir d'autres éléments NON transmis. Le point clé est que je me retrouve avec un objet d'état exactement comme l'original, mais avec les valeurs interpolées insérées à la place.

Et je le répète - la bibliothèque Tween crée le tableau de valeurs, pas moi, pas mon choix. Et oui, je sais que les propriétés des objets ne sont pas toujours dans le même ordre.

EDIT 2: ce code doit être isomorphe - fonctionne dans les navigateurs récents (ne se soucient pas d'IE) et em > Node 10 ou version ultérieure, idéalement sans polyfills ...

EDIT 3: MAINTENANT RÉSOLU:

NinaScholz et mashi ont fourni des réponses qui ont fonctionné pour moi (après avoir corrigé un bug ailleurs ).

Ninas answer a des exigences de version JS plus strictes, et est un peu moins portable que la réponse mashis. Sur cette base, j'ai accepté la réponse mashis, bien que la réponse de Ninas soit également très gentille.

Merci.