I am here playing with the local Storage. And Want it to get or set the value of local storage inside an object. I know the set or get item is the recommended operations for this but somewhere i found that :
LocalStorage can also be set by using : localStorage.myvalue = "something";
And for getting the current value we simply call : localStorage.myvalue;
Now I put this in an object like :
var myObj = {
myval: localStorage.myvalue
}
When i set the value of myObj.myval="somethingAgain";
Then this doesn't Works, Normally the objects can be easily set or get by this method,but in this case why it so happens??
The retrieval of the value is working by calling myObj.myval but why i am not able to set the value here??
So Suggest me where I am Wrong ?
First
localStorage.a = "value";
// create object
var ob = { a: localStorage.a };
console.log(ob.a); // "value"
When you doing things like that:
ob.a = "asfasf"
console.log(ob.a); // "asfasf"
console.log(localStorage.a); "value"
The value don't change because ob.a equal to value, IT NOT A REFERENCE its a VALUE,
you get the value by doing localStorage.a!
Working version
var ob = { a: function(value){ return localStorage.a = value; }};
ob.a("value"); // returns "value"
console.log(localStorage.a); // "value"
This seems like it could be accomplished with this following small adjustment.
Update:
Seemed too long for you, shorthand better?
var myObj = {
myval: function(val){
return (typeof (val) === 'undefined' ? localStorage.myvalue : localStorage.myvalue=val);
}
}
Than calling it like this to set
myObj.myval("Add this");
or to get
myObj.myval();
Fiddle: http://jsfiddle.net/4WsNx/
Hope this helps.
You could use the Object.prototype.__defineGetter__() and Object.prototype.__defineSetter__().
Or use the get and set operators.
But remember that those are not supported in older browsers!
Your concret problem is that you defined a primitive as attribute to the localStorage-object and not and object as an attribute to the localStorage so you do not have a reference but only a value.
A Solution could be to define the whole localStorage as attribute like this:
var obj = { store: localStorage };
obj.store.setItem('key','a value');
obj.store.getItem('key');
Related
I've got a feeling this might not be possible, but I would like to determine the original variable name of a variable which has been passed to a function in javascript. I don't know how to explain it any better than that, so see if this example makes sense.
function getVariableName(unknownVariable){
return unknownVariable.originalName;
}
getVariableName(foo); //returns string "foo";
getVariableName(bar); //returns string "bar";
This is for a jquery plugin i'm working on, and i would like to be able to display the name of the variable which is passed to a "debug" function.
You're right, this is very much impossible in any sane way, since only the value gets passed into the function.
This is now somehow possible thanks to ES6:
function getVariableName(unknownVariableInAHash){
return Object.keys(unknownVariableInAHash)[0]
}
const foo = 42
const bar = 'baz'
console.log(getVariableName({foo})) //returns string "foo"
console.log(getVariableName({bar})) //returns string "bar"
The only (small) catch is that you have to wrap your unknown variable between {}, which is no big deal.
As you want debugging (show name of var and value of var),
I've been looking for it too, and just want to share my finding.
It is not by retrieving the name of the var from the var but the other way around : retrieve the value of the var from the name (as string) of the var.
It is possible to do it without eval, and with very simple code, at the condition you pass your var into the function with quotes around it, and you declare the variable globally :
foo = 'bar';
debug('foo');
function debug(Variable) {
var Value = this[Variable]; // in that occurrence, it is equivalent to
// this['foo'] which is the syntax to call the global variable foo
console.log(Variable + " is " + Value); // print "foo is bar"
}
Well, all the global variables are properties of global object (this or window), aren't they?
So when I wanted to find out the name of my variables, I made following function:
var getName = function(variable) {
for (var prop in window) {
if (variable === window[prop]) {
return prop;
}
}
}
var helloWorld = "Hello World!";
console.log(getName(helloWorld)); // "helloWorld"
Sometimes doesn't work, for example, if 2 strings are created without new operator and have the same value.
Global w/string method
Here is a technique that you can use to keep the name and the value of the variable.
// Set up a global variable called g
var g = {};
// All other variables should be defined as properties of this global object
g.foo = 'hello';
g.bar = 'world';
// Setup function
function doStuff(str) {
if (str in g) {
var name = str;
var value = g[str];
// Do stuff with the variable name and the variable value here
// For this example, simply print to console
console.log(name, value);
} else {
console.error('Oh snap! That variable does not exist!');
}
}
// Call the function
doStuff('foo'); // log: foo hello
doStuff('bar'); // log: bar world
doStuff('fakeVariable'); // error: Oh snap! That variable does not exist!
This is effectively creating a dictionary that maps variable names to their value. This probably won't work for your existing code without refactoring every variable. But using this style, you can achieve a solution for this type of problem.
ES6 object method
In ES6/ES2015, you are able to initialize an object with name and value which can almost achieve what you are trying to do.
function getVariableName(unknownVariable) {
return Object.keys(unknownVariable)[0];
}
var foo = 'hello';
var output = getVariableName({ foo }); // Note the curly brackets
console.log(output);
This works because you created a new object with key foo and value the same as the variable foo, in this case hello. Then our helper method gets the first key as a string.
Credit goes to this tweet.
Converting a set of unique variable into one JSON object for which I wrote this function
function makeJSON(){ //Pass the variable names as string parameters [not by reference]
ret={};
for(i=0; i<arguments.length; i++){
eval("ret."+arguments[i]+"="+arguments[i]);
}
return ret;
}
Example:
a=b=c=3;
console.log(makeJSON('a','b','c'));
Perhaps this is the reason for this query
I think you can use
getVariableName({foo});
Use a 2D reference array with .filter()
Note: I now feel that #Offermo's answer above is the best one to use. Leaving up my answer for reference, though I mostly wouldn't recommend using it.
Here is what I came up with independently, which requires explicit declaration of variable names and only works with unique values. (But will work if those two conditions are met.)
// Initialize some variables
let var1 = "stick"
let var2 = "goo"
let var3 = "hello"
let var4 = "asdf"
// Create a 2D array of variable names
const varNames = [
[var1, "var1"],
[var2, "var2"],
[var3, "var3"]
]
// Return either name of variable or `undefined` if no match
const getName = v => varNames.filter(name => name[0] === v).length
? varNames.filter(name => name[0] === v)[0][1]
: undefined
// Use `getName` with OP's original function
function getVariableName(unknownVariable){
return getName(unknownVariable)
}
This is my take for logging the name of an input and its value at the same time:
function logVariableAndName(unknownVariable) {
const variableName = Object.keys(unknownVariable)[0];
const value = unknownVariable[variableName];
console.log(variableName);
console.log(value);
}
Then you can use it like logVariableAndName({ someVariable })
I've got a function to update an object:
_.each(user, function(value, key, obj) {
if (user[key] !== undefined) {
self.user[key] = user[key];
}
});
It lets me update users like this:
let user = new User();
user.verified = true;
self.sessionService.updateSession(user);
I only need to specify properties that are going to be updated by checking for undefined, can this be simplified or written more efficient?
You could do something like this using underscore:
_.assign(self.user, _.omit(user, _.isUndefined))
This works by creating an object where all the keys with undefined values are omitted using omit and the isUndefined predicate.
This object is then used with assign to update the self.user object.
I'm not sure if this is the answer you need, but you can set a variable to new value if it's undefined/null/"" like this:
myVar = myVar || newValue;
If myVar is defined, the old value will be kept. If not, it will be assigned to newValue.
It's difficult to explain the case by words, let me give an example:
var myObj = {
'name': 'Umut',
'age' : 34
};
var prop = 'name';
var value = 'Onur';
myObj[name] = value; // This does not work
eval('myObj.' + name) = value; //Bad coding ;)
How can I set a variable property with variable value in a JavaScript object?
myObj[prop] = value;
That should work. You mixed up the name of the variable and its value. But indexing an object with strings to get at its properties works fine in JavaScript.
myObj.name=value
or
myObj['name']=value (Quotes are required)
Both of these are interchangeable.
Edit: I'm guessing you meant myObj[prop] = value, instead of myObj[name] = value. Second syntax works fine: http://jsfiddle.net/waitinforatrain/dNjvb/1/
You can get the property the same way as you set it.
foo = {
bar: "value"
}
You set the value
foo["bar"] = "baz";
To get the value
foo["bar"]
will return "baz".
You could also create something that would be similar to a value object (vo);
SomeModelClassNameVO.js;
function SomeModelClassNameVO(name,id) {
this.name = name;
this.id = id;
}
Than you can just do;
var someModelClassNameVO = new someModelClassNameVO('name',1);
console.log(someModelClassNameVO.name);
simple as this
myObj.name = value;
When you create an object myObj as you have, think of it more like a dictionary. In this case, it has two keys, name, and age.
You can access these dictionaries in two ways:
Like an array (e.g. myObj[name]); or
Like a property (e.g. myObj.name); do note that some properties are reserved, so the first method is preferred.
You should be able to access it as a property without any problems. However, to access it as an array, you'll need to treat the key like a string.
myObj["name"]
Otherwise, javascript will assume that name is a variable, and since you haven't created a variable called name, it won't be able to access the key you're expecting.
You could do the following:
var currentObj = {
name: 'Umut',
age : 34
};
var newValues = {
name: 'Onur',
}
Option 1:
currentObj = Object.assign(currentObj, newValues);
Option 2:
currentObj = {...currentObj, ...newValues};
Option 3:
Object.keys(newValues).forEach(key => {
currentObj[key] = newValues[key];
});
I'm not really sure what's going on here, but in a nutshell I've seen this:
Object[key](value);
In line 1088 of bootstrap-datetimepicker:
$.fn.datetimepicker = function ( option, val ) {
return this.each(function () {
var $this = $(this),
data = $this.data('datetimepicker'),
options = typeof option === 'object' && option;
if (!data) {
$this.data('datetimepicker', (data = new DateTimePicker(
this, $.extend({}, $.fn.datetimepicker.defaults,options))));
}
// Line below:
if (typeof option === 'string') data[option](val);
});
};
Would anyone be able to answer what is going on?
I thought maybe it was assigning the value to the key in the object but when I tried doing something similar in the developer console (working in chrome v.33) it doesn't work.
Object is a Javascript object that you can declare like this:
var obj = {};
Then a property is created (whose name is contained in the key variable) with a function as its value:
var obj['myfunction'] = function() { alert('Hello!'); };
So now,you have a function stored in your object 'obj' in the 'myfunction' key.
Since it's a function you execute it using '()', which results in:
obj['myfunction']()
var property = 'method';
// multiple ways to access properties
object.method === object['method'] === object[property];
// and you can use any syntax to call the method
// These all call `object.method`:
object.method() === object['method']() === object[property]();
See also https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Member_Operators
To access properties of an object in JavaScript you can either use the dot notation. i.e: Object.property or the string notation (also called bracket notation) Object[property].
Both are valid, though the dot notation doesn't work with property names containing spaces for example, such as Object.property name is invalid, while Object['property name'] is valid.
Given your example, Object[key](value) you are accessing a property of which the name is stored in the key from the Object object. The property happens to be a method and you can execute it passing value as the parameter.
Imagine the object to look like this:
Object = {
myProp: function(newValue){
// do something with newValue
}
}
It would be perfectly fine to call it using the string notation if the method name is stored in a variable:
var key = 'myProp';
Object[key](value);
or if you don't need a variable you can also call it directly using the dot notation:
Object.myProp(value);
Resources: MDN on Property Accessors
Maybe just a hack to do something like:
var method = "create";
var prop = new String();
var str = Object[method](prop);
So you invoke a method create with parameter prop.
Let's I have next object
var o = { "foo" : {"bar" : "omg"} };
I can get value of key foo using
o["foo"] // return {"bar" : "omg"}
and I can get value of key bar inside foo using
o["foo"]["bar"] // return "omg"
Can I get value of key bar inside foo using brackets [] single time.
Somethong like
o["foo.bar"] // not working(
or
o["foo/bar"] // not working(
It is fairly common to create a getter function to do something like this. From the comment:
I have object o and string 'foo.bar', and i want get "omg".
var getProp = function (theObject, propString) {
var current = theObject;
var split = propString.split('.');
for (var i = 0; i < split.length; i++) {
if (current.hasOwnProperty(split[i])) {
current = current[split[i]];
}
}
return current;
};
http://jsfiddle.net/MXu2M/
Note: this is a thrown together example, you'd want to bullet proof and buff it up before dropping it on your site.
No, you must use o["foo"]["bar"] because it's an object inside another object. If you want to access it with "foo.bar", it means you must create the first object like this:
var o = {"foo.bar": "omg"}
o["foo.bar"] or o["foo/bar"] are not valid for your example. You could use this notation that is cleaner:
var bar = o.foo.bar // bar will contain 'omg'
there is a way, but I'm not sure this is what you asked for:
eval("o.foo.bar");
it is dangerous though, and doesn't use [] , but if what you want is to use a string for accessing any object it works
Unfortunately, you can only use o["foo"]["bar"] or o.foo.bar