0

I'm confused by the = vs. : when assigning a value to a property in an object

Now I know that there are a couple ways to create an object:

  • Object Literal
  • Object Constructor

With an object Literal you would use ":" to assign a value to a property:

var myObject = {firstName: "John", lastName="Smith" };

There we are using ":" to set the value to the property.

I also know a function itself is an object. And you can probably expose public properties from there as part of the function being an object?

So is it if you're assigning a function to a property that you'd use "="? I am assuming yet but what about something like this:

var phantom = require('phantom');

var World = function World(callback) {

    phantom.create("--web-security=no", "--ignore-ssl-errors=yes", { port: 12345 }, function (ph) {
        var phantomProcess = ph;

        createBrowserPage = function(){
            phantomProcess.createPage(function(page) {

                this.headlessPage = page;
            })
        };
    });

    callback();
};

module.exports.World = World;

I assume I have this right in that I want to expose createBrowserPage through exports. I wouldn't use createBrowserPage: and use a ":" instead of "=" to assign that anonymous function to the createBrowserPage property right?

Improve this question

2 Answers 2

Reset to default
0

= is used for assignment in a Javascript statement as in:

variable = "foo";

: is used in an object literal declaration between a property name: value as in:

var obj = {
    prop1: value1,
    prop2: value2
};

If you want to expose your createBrowserPage() function through exports, you have several options, some of which involve creating an object and some of which involve assigning a property to an object. Which you choose and how you declare it leads to whether you use : or =. It depends upon which way you choose to write the javascript code that exposes createBrowserPage(). There is no single answer there. I will offer you a couple options.

If, in one statement, you want to assign one new property to the exports object, then you would use = like this:

module.exports.myFunc1 = myLocalFunction1;

If, in one statement, you wish to assign all your exported functions, then you would assign an object that was assigned with =, but used : in the declaration of the object like this:

module.exports = {
    myFunc1: myLocalFunction1,
    myfunc2: myLocalFunction2
};

In the first example, you are adding one new property to the exports object and assigning that property a value.

In the second example, you are declaring a new Javascript literal object (which uses prop: value syntax to declare its properties. And, then you are assigning that whole object to module.exports which actually replaces the entire existing exports object with a new one and this new object has two properties on it.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

could you also do module.exports = { myFunc1: function(){...code here}, myFunc2: function(){...code here}}; and assign anonymous functions in object literals? I assume the answer is yet.
So also is there a third option. Lets say you did module.exports.myFunc1 = someOtherVariable where myFunc1 is an -existing- method on the exports object and here you're overriding that one method and overwriting that method with your someOtherVariable. In otherwords you can update / overwrite -existing- properties or methods with = too right?
@WeDoTDD - yes, = will replace a previously existing value too and yes the functions could be inline anonymous functions rather than a reference to a named function. In Javascript a function reference can be either a named function or an inline anonymous function.
0

Your question is a bit confusing, but if you're interested in the precise meaning and grammar of : and = it's like this:

The colon (:) symbol is not an operator, it is part of the litteral object notation syntax and separates property names (a litteral string or simple identifier) from their value (any expression). Colons are only used in that context and as part of the trinary conditional operator (?:).

Something in curly brackets is parsed as a litteral object if and only if the { is not the first character in the instruction (otherwise it defines a block) and does not follow a function expression or declaration.

The assignment operator (=) (spec) is a binary operator, it can be used in any expression as long as its left operand is a valid left-hand-side expression, and it returns the value of the right operand. Unless strict mode is used, it will silently fail to assign a value to read-only properties.

Improve this answer

2 Comments

Thanks, the other guy kinda gave me more and answered it clearer for me but thanks for your answer regardless.
also good point on the strict mode in the behavior that happens with and without strict.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.