This question already has answers here:
Javascript object literal: what exactly is {a, b, c}?
(3 answers)
Closed 4 years ago.
I came across this function, called generateMessage which takes 2 parameters and returns and object. The function is as follows:
var generateMessage = (from, text)=>{
return {
from,
text,
createdAt: new Date().getTime()
}
};
module.exports = {generateMessage};
This does NOT throw any errors, and attaches 3 properties to the returned object: '.from' , '.text' and '.createdAt', I am confused about the '.from' and '.text' properties.
My question is why don't we write from: from , text:text, in this way the returned object will have a proto property of .from and .text, which will have their values as the from and text from the parameters.
Why does just writing from and text for the returned object work in this case?
That's ECMAScript's 'shorthand''s property and notation:
http://es6-features.org/#PropertyShorthand
http://es6-features.org/#ObjectMatchingShorthandNotation
It's as the name suggests, a shorthand method of object definition.
Related
This question already has answers here:
Object Using name of prototype function name instead of its property
(2 answers)
When I assign prototype to function I get undesired output
(4 answers)
Does Javascript writable descriptor prevent changes on instances?
(3 answers)
Closed 3 years ago.
Consider the code below. The d1 object so created, does not have name property but why ? However, if I remove the setting of prototype as function object, things works fine. please note that below code is deliberately written like that to test how JS reacts !
function Dog(name){
this.name = name;
}
// Notice that I am putting function object as prototype
Dog.prototype = function(){}
var d1 = new Dog("happy");
console.log(d1.name); //gives empty string
console.dir(d1); // `d1` does not have name property
console.log(d1 instanceof Dog);// returns true ??
This question already has answers here:
JavaScript property access: dot notation vs. brackets?
(17 answers)
Closed 3 years ago.
Let's say we need to add a property to an existing js object
var billingData = {}
In my case, I want to store input value in the js object
Here's the basic input
<input type="text" class="form-control" id="billingFullName">
We, basically, have two ways to add the property to the js object:
The first one:
billingData["billingFullName"] = document.getElementById('billingFullName').value
And the second one:
billingData.billingFullName = document.getElementById('billingFullName').value
What's the difference between them?
I'm asking, because when I was submitting the js object using AJAX to MVC Controller, where properties where added using the [] notation, the model in the Controller appeared to be null. Whereas, the dot notation appeared to solve the issue and I'm wondering why..
Typically you use bracket notation when you need to define a property dynamically such as with a variable or if the key is not in proper format for dot notation:
const obj = {}
const someKey = 'key'
obj[someKey] = 'somevalue'
console.log(obj.key) // 'somevalue'
console.log(obj.someKey) // undefined
Dot notation is when you already know the key:
const obj = {}
object.key = 'someValue'
This question already has answers here:
Javascript object bracket notation ({ Navigation } =) on left side of assign
(5 answers)
Closed 6 years ago.
I'm not sure if there is a specific name for this way to pull object properties into their own variable? If there is a name, does anyone know?
var object = {
something: 'a string',
another: 'another string',
}
var { something, another } = object;
This is called object destructuring.
Object destructuring, read up on it here:
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
A lot of this new syntax isn't fully implemented in all js engines, so be careful when using it!
If you want to learn more about it, checkout this tutorial:
https://www.eventbrite.com/engineering/learning-es6-destructuring/
This question already has answers here:
Accessing an object property with a dynamically-computed name
(19 answers)
Closed 6 years ago.
Title might be a little confusing, but I have following problem:
var propertyList = {
type1: {property1: 1},
type2: {property1: 2}
}
class Test {
constructor(typ){
this.property1 = propertyList.typ.property1;
}
}
var a = new Test('type1');
Code is pretty self-explanatory - I want to set property1 property of a object not by passing value manually in constructor, but rather chosing one of values from propertyList object literal by passing one of its key to constructor. I expected that when I run above code, object a will be created with property1 value set to 1. However instead of that I got Uncaught TypeError: Cannot read property 'property1' of undefined error. When I pust console.log(typ) in the first line of constructor, it correctly shows that value passed into constructor is type1. Why above code doesn't work and can it be fixed somehow?
Your syntax is a little off. You can't use the passed-in argument typ in your assignment like that because the code will then actually look for the property typ within propertyList (like propertyList { typ: }). To use your passed-in argument, wrap it in brackets:
this.property1 = propertyList[typ].property1;
This question already has an answer here:
Where can I get info on the object parameter syntax for JavaScript functions?
(1 answer)
Closed 7 years ago.
I was reading some tweets and I came across this tweet by Dan Abromov
The syntax has me confused.
const Font = ({ children }) =>
<Block...
What is the point of { } around children? Clearly its not an object. I presume its ES2015 feature.
Many thanks
It's a destructuring binding pattern. It indicates that the parameter children should be bound to the value of the children property of an object passed to the function.
Try this in an ES2015 environment:
function x({ foo }) {
console.log(foo);
}
x({ hello: "world", foo: "bar", well: "that's all"});
The string "bar" will be logged to the console, because that's the value of the "foo" property of the object passed to the function.
If the value passed to the function is an object with no "children" property, of if it's not an object at all, then the parameter will be undefined.