. Advertisement .
..3..
. Advertisement .
..4..
Sometimes, amid your programming, the message “Invalid shorthand property initializer” pops up even though nothing in your code looks out of place. What just happened, and how to fix it? Scroll down for more details.
How to Fix The “Invalid shorthand property initializer” Error?
How to fix this error? We suggest you correct the value assignment assigned to object properties. The colon (:) will help you with this task. Unfortunately, most programmers choose to type in the assignment operator (=) (or EqualTo) instead of (:) (Object Initializer), which leads to syntax errors.
Here is an example of such mistakes:
Example 1:
<!doctype html>
<html>
<body>
<h1>JavaScript - SyntaxError: Invalid shorthand property initializer</h1>
<script>
var msg = "";
var mango = [type="fruit", native="India"];
console.log(mango.type);
</script>
</body>
</html>
As expected, the error will occur:
Example 1: Error
Uncaught SyntaxError: Invalid shorthand property initializer
at render (javascript-editor.php?file=test:126)
at submitCode (javascript-editor.php?file=test:149)
at HTMLButtonElement.onclick (javascript-editor.php?file=test:68)
The bug lies in this line: 10 var mango = [type=”fruit”, native=”India”];
Our correct one should replace “=” with “:”, like this:
var mango = [type:”fruit”, native:”India”];
Example 1: Solution
<!doctype html>
<html>
<body>
<h1>JavaScript - SyntaxError: Invalid shorthand property initializer</h1>
<script>
var msg = "";
var mango = [type:"fruit", native:"India"];
console.log(mango.type);
</script>
</body>
</html>
Let’s look at another example to help you understand these approaches! Suppose you write the codes as follows:
Example 2:
var http = require('http');
// makes an http request
var makeRequest = function(message) {
var options = {
host: 'localhost',
port = 8080,
path : '/',
method: 'POST'
}
// make request and execute function on recieveing response
var request = http.request(options, function(response) {
response.on('data', function(data) {
console.log(data);
});
});
request.write(message);
request.end();
}
module.exports = makeRequest;
However, once you run the module, it sends back this error message:
Example 2: Error
$ node make_request.js
/home/pallab/Desktop/make_request.js:8
path = '/',
^^^^^^^^^^
SyntaxError: Invalid shorthand property initializer
at Object.exports.runInThisContext (vm.js:76:16)
at Module._compile (module.js:542:28)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.runMain (module.js:604:10)
at run (bootstrap_node.js:394:7)
at startup (bootstrap_node.js:149:9)
at bootstrap_node.js:509:3
Where does the problem lie? Similar to example 1, the culprit is the “:”.
We need to use “=” for option objects to assign a value to the port. Instead, in the codes above, we chose “:” to assign property values for the object, which led to the syntax error. Change it back to “=” to fix the issue:
Example 2: Solution
var options = {
host: 'localhost',
port: 8080,
path: '/',
method: 'POST'
}
Conclusion
This article has instructed you to fix the “Invalid shorthand property initializer” error. As you can see from the two different examples above, the solution is fairly straightforward. You only need to change “=” into “:” and let the system do the rest! To check if your object comes up empty, use some tips from this article.
Leave a comment