These are my JSON objects.
({
"0":"http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F86040788&",
"1":"http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F87126537&",
"2":"http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F84915833&",
"3":"http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F87317484&",
"4":"http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F86548283&"
})
I fetched them with Ajax and this is how I get to them:
data[0] to data[4].
Why is data.1, etc not working? I don't understand why I can access the objects like this data[0], because they are not arrays.
Why is data.1, etc is not working?
Thats because data.1 is an invalid syntax according to the grammar of Javascript. Open your browsers console and try:
var obj = {};
obj[0] = "test";
obj.0; //SyntaxError: Unexpected number
I don't get why I can acess the objects like this data[0], because they are not arrays.
In javascript, arrays and map/dictionary/association array are the same thing. You can access by either object[key] syntax or object.key syntax. Only restriction is that it should be parseable by the parser (it should be an identifier), otherwise it would fail -- like the case you have. Another example:
var obj = {"test-data":1, "test": 2};
obj["test"] // 2
obj.test // 2
obj["test-data"]; // 1
obj.test-data //ReferenceError: data is not defined
//^ is a <MINUS> character, parsed as (obj.test - data)
Working with objects: Objects and properties
An object property name can be any valid JavaScript string, or
anything that can be converted to a string, including the empty
string. However, any property name that is not a valid JavaScript
identifier (for example, a property name that has space or dash, or
starts with a number) can only be accessed using the square bracket
notation. This notation is also very useful when property names are to
be dynamically determined (when the property name is not determined
until runtime). Examples are as follows:
because json var name could not start from digit
Related
This question already has answers here:
How to access a numeric property?
(3 answers)
Closed 5 years ago.
PHP:
echo json_encode(array("apple", "banana"), JSON_FORCE_OBJECT);
AJAX (client side javascript with jQuery):
$.ajax({
...
...
success: function (data) {
console.log(data);
data1 = JSON.parse(data);
console.log(data1["0"]);
},
});
CONSOLE:
{"0":"apple", "1":"banana"}
apple
My Question:
If I replace console.log(data1["0"]) with console.log(data1.0) it doesn't pick up apple and I get an error missing ) after argument list. Why does only the array notation work, why doesn't the object notation work as well?
(I suspect it has something to do with the "pure array" -- i.e. not "associative array" -- nature of the original array that was encoded to JSON inside PHP. Is there a name for this kind of object literal that Javascript interprets as a pure array instead of an object?)
JavaScript properties that begin with a digit cannot be referenced with dot notation; and must be accessed using bracket notation.
The following explanation is directly taken from:
https://developer.mozilla.org/en/US/docs/Web/JavaScript/Reference/Global_Objects/Array
Accessing array elements
JavaScript arrays are zero-indexed: the first element of an array is at index 0, and the last element is at the index equal to the value of the array's length property minus 1. Using an invalid index number returns undefined.
var arr = ['this is the first element', 'this is the second element', 'this is the last element'];
console.log(arr[0]); // logs 'this is the first element'
console.log(arr[1]); // logs 'this is the second element'
console.log(arr[arr.length - 1]); // logs 'this is the last element'
Array elements are object properties in the same way that toString is a property, but trying to access an element of an array as follows throws a syntax error because the property name is not valid:
console.log(arr.0); // a syntax error
There is nothing special about JavaScript arrays and the properties that cause this. JavaScript properties that begin with a digit cannot be referenced with dot notation; and must be accessed using bracket notation. For example, if you had an object with a property named '3d', it can only be referenced using bracket notation. E.g.:
var years = [1950, 1960, 1970, 1980, 1990, 2000, 2010];
console.log(years.0); // a syntax error
console.log(years[0]); // works properly
renderer.3d.setTexture(model, 'character.png'); // a syntax error
renderer['3d'].setTexture(model, 'character.png'); // works properly
Note that in the 3d example, '3d' had to be quoted. It's possible to quote the JavaScript array indexes as well (e.g., years['2'] instead of years[2]), although it's not necessary. The 2 in years[2] is coerced into a string by the JavaScript engine through an implicit toString conversion. It is, for this reason, that '2' and '02' would refer to two different slots on the years object and the following example could be true:
console.log(years['2'] != years['02']);
Similarly, object properties which happen to be reserved words(!) can only be accessed as string literals in bracket notation(but it can be accessed by dot notation in firefox 40.0a2 at least):
var promise = {
'var' : 'text',
'array': [1, 2, 3, 4]
};
console.log(promise['var']);
I am receiving some JSON from PHP like this (previewed in Firefox tools):
1:Object
0:Object
1:Object
2:Object
3:Object
Name: "SomeName"
I now want to iterate through the objects, but not the Name key. It seems if I do an $.each it includes the key/value pair. How can I avoid it? Also why can I choose a numerical value for the first Object (I have it "1") but not assign a value to it? I wish it could look like this for example
1:SomeNameIGaveIt
0:Object
1:Object
2:Object
3:Object
That would make my Name k/v pair obsolete.
JSON
{"1": {"Name":"SomeName", "0":{"data":"data"}. "1":{"data":"data"}}}
In JavaScript, a String is a "subclass" of Object. Lucky for you, there's the typeof operator;
in the Chrome console
var a = "foo" //makes a String
var b = {} //makes an empty Object
typeof a
"string"
typeof b
"object"
Using this, you can check to ensure something is not a string before doing an operation on it.
Other option: instead of iterating using the json $.each call, you could just iterate over it via a JavaScript for-loop. If you know the number of elements inside your SomeNameIGaveIt object is fixed, you could use a fixed number of iterations and then use the array indexing operator (SomeNameIGaveIt[index]), or use a for-in loop (for (var i in array){...})
If you use a for-in loop, you can check if the index is a number using typeof as mentioned above. Any of these approaches is going to yield pretty similar results, so pick whatever suits you best.
I have a multidiminsional array that I have created in php that is passed back to a jQuery script. I need to iterate through this array and process the data.
In Firebug I can see that the data is located at data.data.items. I've tried finding the length of the array using data.data.items.length, but it comes back as undefined. Interestingly, this worked prior to my php portion working correctly when it passed back an array of 8 empty items. Now that it's populated (and the indexes are strings), length doesn't work. There is also an object in each of the items. What's breaking this?
An Array in JavaScript is an object nonetheless. When setting values using strings (or anything that isn't an integer), you are actually setting a property of the object (you are actually doing this when setting it with integer keys as well, but it's handled slightly differently).
To the issue of its sudden breakage after using strings as keys, I would expect that PHP realizes when you have an honest-to-goodness array versus an associative array, thus it sends arrays (surrounded by []) when all keys are integers, and objects (surrounded by {}) otherwise. I believe in the string-keyed case, PHP is generating objects, and thus .length becomes undefined (rather than 0 as in an empty array).
To answer your question, there is a simple way to count the "length" of this data:
var i = 0;
for (var item in data.data.items) {
i++;
}
Which will iterate through each property of data.data.items and count them. Note that if you (or any library you include) adds a property to the Object prototype, this will not produce expected results. This is fairly uncommon, but you must be aware of it when using for..in.
You can address this by using the method Nagh suggested, which ignores properties not defined on that particular object:
var i = 0;
for (var item in data.data.items) {
if(data.data.items.hasOwnProperty(item)) {
i++;
}
}
You can always use "foreach" kind of loop. In this case, you don't need to know what array length is there or even is it array or not, since you can iterate over object properties aswell.
As Joe already has pointed, javascript doesn't have associative arrays and when you trying to use one - you end up with object with properties. However, if u sure, that only properties this object got - is your array you can use code like that:
for (i in arr) {
if (arr.hasOwnProperty(i)) {
//do something with arr[i]
}
}
However if you really need an array, consider using integer as an array index.
I encoded a mysql result from php to json.. I need to decode it in javascript. Say my string returned is
[{"0":"x","1":"z"},{"0":"xs","1":"zz"}]
Please help me on how to get the value of a particular row and column.. for instance how to get the value of "0" of the second row.
EDIT:
Sorry for bothering friends my mistake.. the typeof returned as string JSON.parse(data) did the trick..
var data = [{"0":"x","1":"z"},{"0":"xs","1":"zz"}];
alert (data[1]["0"]);
gives you the xs
The [] represents an array structure, with each {} being an element in the array. Then, within each object there is a set of attributes, which you get it via the attribute's identifier. In this case, it's 0, so it could have just be 0 as well.
Why make objects? It is very poor coding standard to NAME attributes with a number.
Since it obviously are arrays do this instead
var x = [["x","z"],["xs","zz"]]
Then
x[1][0] will give you xs
I know this has been asked a few times but please bear with me.
I have a google maps object which is rather complex (it contains various nodes, coordinates, etc) and I am trying to pass it as a query string.
I need a play javascript/jQuery solution.
I have tried the .param method which gives a jQuery error. The only thing that works is the "stringify" method which then creates a string that when appearing as a url looks a bit like this: %7B%5C"shape_1%5C"%3A%7B%5C"color%5C"%3A%5C"%237F0000%5C"%2C%5C"data%5C"%3A%7B%5C"b%5C"%3A%5B%7B%5C"Na%5C"%3A51.56727431757122%2C%5C"Oa%5C"%3A-0.10462402858888709%7D%2C....
php translates that as:
{\\"shape_1\\":{\\"color\\":\\"#7F0000\\",\\"data\\":{\\"b\\":[{\\"Na\\":51.56727431757122,\\"Oa\\":-0.10462402858888709},...
but having said that I don't want to use PHP, I am just showing you what it does in case it helps you see what stringify did to the object.
After I unescape with Javascript it looks a bit more normal like:
{\"shape_1\":{\"color\":\"#7F0000\",\"data\":{\"b\":[{\"Na\":51.56727431757122,\"Oa\":-0.10462402858888709},..
So as you can see, the unescaped sequence has these slashes everywhere.
When I try to evaluate that into a JSON object I get "Illegal token \". The parse method also fails. I just can't find any way to put this string back into the complex JSON object that it was.
I have looked online for various suggestions but they fail. I also don't understand why stringify injects all these slashes which simply shouldn't be there.
If anyone has an idea how to take that object, put it in a query string and then parse it back I would be very grateful.
Nick
Update:
The answer is this:
encodeURIComponent(JSON.stringify(myObject));
And then on the receiving end:
var a = querySt("data");
var b = decodeURIComponent(a);
var c = unescape(b);
var d = JSON.parse(c);
or all in one line
JSON.parse(unescape(decodeURIComponent(querySt("data"))));
Nick
See http://php.net/manual/de/security.magicquotes.php - you have to turn off magic quotes. They are old, deprecated stuff, they are insecure and break stuff.
Magic Quotes is a process that automagically escapes incoming data to the PHP script. It's preferred to code with magic quotes off and to instead escape the data at runtime, as needed.
Howto: http://www.php.net/manual/de/security.magicquotes.disabling.php
Try this to convert query string into json object
var queryStringToJSON = function (url) {
if (url === '')
return '';
var pairs = (url || location.search).slice(1).split('&');
var result = {};
for (var idx in pairs) {
var pair = pairs[idx].split('=');
if (!!pair[0])
result[pair[0].toLowerCase()] = decodeURIComponent(pair[1] || '');
}
return result;
}
You can use jQuery.param method to covert json object back to query string