JavaScript SyntaxError - Missing ':' after property id

This JavaScript exception missing : after property id occurs if objects are declared using the object's initialization syntax.

Message:

SyntaxError: Expected ':' (Edge)
SyntaxError: missing : after property id (Firefox)

Error Type:

SyntaxError

Cause of Error: Somewhere in the code, Objects are created with object initializer syntax, and colon (:) is used to separate keys and values for the object's properties, Which is not used so.

Case 1: Missing Colon in Object Literal

Error Cause:

A common cause is omitting the colon between a property name and its value.

Example:

const exampleObject = {
    property1 "value1",
    property2: "value2"
};

Output:

SyntaxError: Missing ':' after property id

Resolution of Error:

Add the missing colon.

const exampleObject = {
    property1: "value1", // Correct usage
    property2: "value2"
};
console.log(exampleObject);

{ property1: 'value1', property2: 'value2' }

Case 2: Incorrect Property Definition

Error Cause:

Another cause is incorrect formatting or syntax when defining properties in an object literal.

Example:

const exampleObject = {
    property1 = "value1", // Using = instead of :
    property2: "value2"
};

Output:

SyntaxError: Missing ':' after property id

Resolution of Error:

Use the correct syntax with a colon.

const exampleObject = {
    property1: "value1", // Correct usage
    property2: "value2"
};
console.log(exampleObject);

{ property1: 'value1', property2: 'value2' }

Case 3: Missing Value After Colon

Error Cause:

A property name followed by a colon but without a value can also cause syntax issues.

Example:

const exampleObject = {
    property1:, // Missing value
    property2: "value2"
};

Output:

SyntaxError: Unexpected token ','

Resolution of Error:

Provide a value for the property.

const exampleObject = {
    property1: "value1", // Correct usage
    property2: "value2"
};
console.log(exampleObject);

{ property1: 'value1', property2: 'value2' }