CODEWITHSUNDEEP
javascriptobjectvue.js
maya91
maya91

Reputation: 39

What does curly braces inside parentheses mean in javascript?

I'm relatively new to javascript and I'm learning VueJS.. When initiating a new vue object I realized the code is similar to this:

new Vue({
    el: ‘#app’,
    data: {
        title: ‘hello World’
    }
});

I know from working with js objects is that we can initiate objects with curly braces like this:

var car = {
   type: "Fiat", 
   model: "500", 
   color: "white"
};

and I also know that parentheses are used for functions and we can have curly braces inside parentheses like so:

connect({ name: "testing" });

but the next notation in vue confused me because I know vue is an object not a function so I dont know why there are paranthesis, can someone clarify this part to me: 

new Vue({});

Thank you.. Any reply is appreciated

Upvotes: 2

Views: 2087

Answers (1)

Jack Bashford
Jack Bashford

Reputation: 44107

Yep - just the same as your usage here:

connect({ name: "testing" })

new signifies a constructor, which is called like a function, so you use parentheses. And the Vue constructor expects an object, which is signified by the curly braces. So this:

new Vue({})

Means you're passing no options to the Vue constructor.

If you're confused about why Vue "isn't a function", then it's because using new with the name of a class constructs an instance of that class. If you're using an ES5-style constructor function:

function Construction(option) {
  this.option = option;
}

Then it's fairly obvious how that happens. Class constructors are a little different, but there's no difference whatsoever in how they're created - just like a function call. And like any function, you can pass an object.

Upvotes: 2

Related Questions