What is an Invalid shorthand property initializer Error?
Invalid shorthand property initializer: When we use an equal sign(=) instead of a colon(:) to separate the values in an object, we get the “Invalid shorthand property initializer” error. To correct the mistake, put colons between the keys and values of an object when declaring it.
For example:
const object = { EmpId:2122, EmpName:'John' }
console.log(object);
Output:
{ EmpId: 2122, EmpName: 'John' }
When Does This Error Occur?
// Here we are giving equal sign(=) instead of a colon(:)
// between the keys and values of an object
// Hence Invalid shorthand property initializer error occurs
const object = { EmpId = 2122, EmpName = 'John' }
console.log(object);
Output:
const object = { EmpId = 2122, EmpName = 'John' }
^^^^^^^^^^^^
SyntaxError: Invalid shorthand property initializer
at Module._compile (internal/modules/cjs/loader.js:723:23)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:623:3)
Explanation:
Here we are giving equal sign(=) instead of a colon(:) between the keys and values of an object Hence Invalid shorthand property initializer error occurs
Handling the Invalid shorthand property initializer Error
Uncaught syntaxerror invalid shorthand property initializer: To Handle this see the below code as explained in the above concept:
For example:
const object = { EmpId:2122, EmpName:'John' }
console.log(object);
Output:
{ EmpId: 2122, EmpName: 'John' }
It’s worth noting that we used an equal sign(=) to separate the object’s key-value pairs.
A colon(:) should be used to separate key-value pairs when declaring an object.
Using equal sign(=) to Add a New Key-Value Pair
If you wish to add a new key-value pair to the object, however, you must use the equal sign(=).
Approach:
- Give the object containing key-value pairs and store it in a variable
- Add a new key-value pair to the above object using the equal sign(=)
- Print the object after adding a key-value pair to the object on the console.
- The Exit of the Program.
Below is the implementation:
// Give the object containing key-value pairs and store it in a variable
const object = { EmpId:2122, EmpName:'John' }
// Add a new key-value pair to the above object using the
// equal sign(=)
object.EmpSalary = 50000;
// Print the object after adding a key-value pair on the console
console.log(object);
Output:
{ EmpId: 2122, EmpName: 'John', EmpSalary: 50000 }
Using the Bracket Notation instead of Dot Notation
When adding a key-value pair to an object, use bracket notation rather than dot notation if the key contains spaces, begins with a number, or contains a special character.
Example:
Approach:
- Give the object containing key-value pairs and store it in a variable
- Add a new key-value pair to the above object using the bracket notation instead of dot notation(.)
- Print the object after adding a key-value pair to the object on the console.
- The Exit of the Program.
Below is the implementation:
// Give the object containing key-value pairs and store it in a variable
const object = { EmpId:2122, EmpName:'John' }
// Add a new key-value pair to the above object using the
// bracket notation instead of dot notation(.)
object['Employee Address'] = 'Gachibowli, Hyderabad';
// Print the object after adding a key-value pair on the console
console.log(object);
Output:
{ EmpId: 2122,
EmpName: 'John',
'Employee Address': 'Gachibowli, Hyderabad' }
Conclusion:
To avoid the “Invalid shorthand property initializer” problem, use a colon instead of an equal sign between the key-value pairs of an object literal, such as
const object = { EmpId:2122, EmpName:'John' }