CODEWITHSUNDEEP
javascriptvue.jsecmascript-6
Alexander Solonik
Alexander Solonik

Reputation: 10240

Spread operator used in conjuction with a function in ES6 , inside Vue.js

I was just going through habitica code (a vue.js app) and came across the below spread operator usage like so HERE. Inside computed you have the following:

computed: {
  ...mapState({
    user: 'user.data',
    castingSpell: 'spellOptions.castingSpell',
    isRunningYesterdailies: 'isRunningYesterdailies',
  }),
}

Now i've never seem the spread operator used in conjuction with a function , not sure whats happning here, the mapState happnens to be a function present in another file, that looks like so:

export function mapState (states) {
  const res = {};

  normalizeMap(states).forEach(({ key, val }) => {
    res[key] = function mappedState () {
      return typeof val === 'function' ?
        val.call(this, this.$store.state, this.$store.getters) :
        get(this.$store.state, val);
    };
  });

  return res;
}

I understand the spread operator when used with an Array or an Object, but what exactly is happening here with a function ?

Upvotes: 0

Views: 569

Answers (1)

Code Maniac
Code Maniac

Reputation: 37745

Your function is returning an Object which is being getting spread-ed,

You can understand with a simple example

  • Here func is a function which creates an object based on value passed to it
  • inside me object i have one property called info which i want to set as an object, so i simply call func with name and age and spread

let func = (name,age)=> ({name,age})

let me = {
  info: {...func('code maniac', 24)}
}

console.log(me)

Upvotes: 2

Related Questions