Adding Runtime Property in Object doesn't show in "this" context - javascript

Just wondering , why when this is printed on console , doesn't show the dynamic property, which is added using Object.defineProperty
Here is a Decorator example. It's working as expected but the success, error property is not shown in this. I guess this is javascript behaviour and has nothing to do with decorators.
May I get a glimpse of this behaviour?

Try to assign true to 'enumerable' property of property descriptor object.

Related

'get' on proxy: property 'items' is a read-only and non-configurable data property on the proxy target but the proxy did not return its actual value

What does this JavaScript error actually mean? I'm not asking about my specific case, just generally how is this error message meant to be understood?
TypeError: 'get' on proxy: property 'items' is a read-only and non-configurable data property on the proxy target but the proxy did not return its actual value (expected '[object Array]' but got '[object Array]')
I don't understand why JavaScript would care what the proxy returns? Why does it matter if its "its actual value" or something else? Isn't what what proxies are (sometimes) used for - returning data in place of the original result?
Additionally - in my specific version of this error message, it appears that the expected type is the same as the returned type so that confuses me even more.
Apparently the restriction that causes this error comes from the ECMAScript spec for Proxies, see this section.
[[Get]] for proxy objects enforces the following invariants:
The value reported for a property must be the same as the value of the corresponding target object property if the target object property is a non-writable, non-configurable own data property.
The value reported for a property must be undefined if the corresponding target object property is a non-configurable own accessor property that has undefined as its [[Get]] attribute.
So if a property of an object is non-writable and non-configurable, the proxy that wraps this object must return the exact same value that the property of the source object holds when the property is read.
In my case the issue was caused by Vue reactifying a non-writable and non-configurable object property and returning the property's value wrapped in another proxy, which broke that rule.
The rule kind of makes sense if you see the proxy as "the same" as the source object. If that source object's property is read-only and not configurable, then any proxy for that object should also not be able to change the value of that property. I'm not sure if I agree, however, because at the end of the day the proxy is not the source object and so I think it should be up to it to decide whether or not to follow the rules of the source object, but maybe I'm missing something.

What object has a String representation of `{name=value}` in JavaScript?

I receive a complex value in JavaScript (inside the JDK Nashorn engine), that I have to interact with. That value prints to the console as {shown=true}. When I say typeof value I receive object as an answer. When I say Object.keys(value); I receive a TypeError: {shown=true} is not an Object in .... Whey I say value.shown or value["shown"] I always receive a null.
What is type is this mysterious object, and how do I access the value of the "shown" property correctly?
Unfortunately, it is not easy to create a simple example and I cannot debug interactively... Any help is highly appreciated!
Edit:
JDK is JavaSE-1.8.
Calling JSON.parse(value); results in
javax.script.ScriptException: SyntaxError: Invalid JSON: <json>:1:1 Expected , or } but found s
{shown=true}
^
Assuming what you got is a Java object, you should be able to call value.getClass() to get its Java class.
From its string representation, it might be an instance of java.util.HashMap or similar. If so, you should be able to access the value of the "shown" property via value.get("shown").

Returns undefined on a object prop even though it exists-JS

I'm having the same issue as mentioned here: Can't access object property, even though it exists. Returns undefined
However in my case it's a property with data.hostId.id, where data comes in as full object and hostId is shown undefined when its actually present in the json object, here's how it looks:
As you can see, I'm trying to access the qgUSerHost(at the very end) from the object and it throws undefined. I tried setTimeout, not working…
I also tried the solution mentioned in that post but nothing helped.
Any ideas on this one?
I think you should access that property like this.hostAsset["qgUserHost.id"] because of the . in the property name, so it wouldn't try to access the property id from some qgUserHost object.
'this.hostAsset.qgUserHost.id' != 'this.hostAsset.qgUserHost'

How to identify javascript undeletable properties?

In Javascript strict mode
Deleting an undeletable property is not allowed
To make sure that one do not delete such an undeletable property, how do one figure out property X is deletable and property Y is undeletable
The concept behind it is......?
The concept behind this is...?
Property attributes. Every property that has its configurable attribute set to false cannot be deleted (which fails silently in sloppy mode and throws in strict mode).
How to figure out whether a property is deletable?
You can use the Object.getOwnPropertyDescriptor() function to access the attributes as an object:
var isDeletable = Object.getOwnPropertyDescriptor(obj, "propName").configurable;
Notice that this will only work for own properties of obj, not inherited ones; for those you will have to call the function on the respective prototype.

Does Object.defineProperty check if the property is defined?

I need to define property for a javascript object.
var obj = {};
obj['prop1'] = 1
In the above way, we can define the property.
Now, let us use Object.defineProperty
var obj = {};
Object.defineProperty(obj,'prop1',{value:1});
this is alternate way.
what is the difference between the two?
Does Object.defineProperty check if the property is already defined or not??
I believe obj['prop1'] = 1 checks for the property
thanks :)
EDIT
Any performance variation in between those?
Neither a direct object access, nor Object.defineProperty will "check" for existing properties. The only difference between those two is the possbility, to modify property descriptor values.
Property descriptors are
enumerable
configurable
writable
which are all set to true by using direct property access. With Object.defineProperty you have the option to set these properties individually. I suggest you read this MDN article to get an idea about the meanings.
If for instance, a propertie owns the flag configurable=false, you cannot overwrite or delete it (which might be the case for your issue).
Concerning performance:
Since Object.defineProperty is a function which needs to get executed each time, it has to be slower than a direct access on the object. I created this little benchmark:
http://jsperf.com/property-access-with-defineproperty
However, even if the difference looks drastically, you may not forget the value and reason for Object.defineProperty.
Mozilla says:
When the property already exists, Object.defineProperty() attempts to modify the property according to the values in the descriptor and the object's current configuration. If the old descriptor had its configurable attribute set to false (the property is said to be "non-configurable"), then no attribute besides writable can be changed. In that case, it is also not possible to switch back and forth between the data and accessor property types.
If a property is non-configurable, its writable attribute can only be changed to false.
A TypeError is thrown when attempts are made to change non-configurable property attributes (besides the writable attribute) unless the current and new values are the same.
in both cases, if property exists it's value will be overwritten, otherwise it will be created

Categories