Jump to content

Practical JSON


Fmdpa
 Share

Recommended Posts

There doesn't seem to be a whole lot of info on JSON on the web. I realize it can be used for things like APIs, but are there any native Javascript applications that use JSON? For example, could I do this:

document.body.style = {  color: 'green',  background: 'blue',  border: '1px solid yellow'}

Also, are there any JS methods for handling JSON?

Link to comment
Share on other sites

I'm not sure, that's more DOM manipulation, which I don't think work like that, since it's main function is for data exchange. I know jQuery accepts JSON syntax in the same fashion that you just posted. heres a link to the JSON site from the man that started it all.http://www.json.org/javascript itself understand JSON notation, in it's support of object(s) (literals);

var myObj = {  name : "me",  age	: "old",  life	 : "non"};

Edited by thescientist
Link to comment
Share on other sites

yup.

var person = {  name   : "me",  age	  : "old",  height  : "tallish",  hair	 :  "blondish"};for(var key in person){  print('key is: ' + key '.  value is: ' . person[key]);};

objects/JSON are really just associative arrays at their most simplest implementation.

Edited by thescientist
Link to comment
Share on other sites

You sound like you think JSON is something weird.
Yeah, I do think they are sort of weird. Unlike the dozens of PHP functions available for PHP associative arrays, JSON seems like it has no connection with JS (other than it being "supported"). You can do lots of stuff with JSON (as illustrated profusely in jQuery), but it seems like native JS doesn't allow you to do much with them unless you create functions and loops, etc. Basically what I'm trying to say is that you have to create your own functions, which is unlike PHP's interaction with associative arrays (I actually sort of enjoy extending Javascript's functionality like that, though). Your for..in example was helpful, thescientist. I still don't see why this doesn't work:
document.body.style = {  color: 'green',  background: 'blue',  border: '1px solid yellow'}

Since you are assigning this to "document.body.style", you'd access the color like this: "document.body.style.color". Since you are assigning the value of "green" to the color key, why isn't it the same as this: document.body.style.color = 'green'? Also, can I extend the JSON object?e.g.

JSON.prototype.count = function() {   return this.length}

Edited by Fmdpa
Link to comment
Share on other sites

Yeah, I do think they are sort of weird. Unlike the dozens of PHP functions available for PHP associative arrays, JSON seems like it has no connection with JS (other than it being "supported"). You can do lots of stuff with JSON (as illustrated profusely in jQuery), but it seems like native JS doesn't allow you to do much with them unless you create functions and loops, etc. Basically what I'm trying to say is that you have to create your own functions, which is unlike PHP's interaction with associative arrays (I actually sort of enjoy extending Javascript's functionality like that, though). Your for..in example was helpful, thescientist. I still don't see why this doesn't work:
document.body.style = {  color: 'green',  background: 'blue',  border: '1px solid yellow'}

Since you are assigning this to "document.body.style", you'd access the color like this: "document.body.style.color". Since you are assigning the value of "green" to the color key, why isn't it the same as this: document.body.style.color = 'green'? Also, can I extend the JSON object?e.g.

JSON.prototype.count = function() {   return this.length}

you make a good point about the DOM manipulation, I think a simple test would be easy enough to write up just to confirm. And, yes I believe since everything is pretty much considered an object in Javascript, and its commonly known as a prototypical language, then you can pretty much do anything to any object/function. However, with prototyping, every instance of JSON from that point forward will have that property and/or method.
Link to comment
Share on other sites

if you want a pretty wild read about the ins/outs of Javascript, you should check out the book Secrets of The Javascript Ninja by John Resig, the author of jQuery.

Edited by thescientist
Link to comment
Share on other sites

thinking about, the only reason that the DOM manipulation may or may not work depends on the actual interface of the DOM API. Being able to specify and set one property vs. multiple properties needs to built into the API itself. Chances are it would probably work, but it's just a matter of creating a test case.

Link to comment
Share on other sites

The .style property of elements is not an Object(), it's a StyleObject() (or something of that sort) so replacing it with an Object() will change its functionality.If you want to add a count() method to objects created with JSON, just add it to the Object() prototype:

Object.prototype.count = function() {  return this.length;}

Though the method is useless since a property like that already exists.

Link to comment
Share on other sites

it's definitely not a "casual" read, but it's well worth it if only just to see some of the advanced techniques that can be used. In fact, I think I ready for another read now that I've spent another year working closely with Javascript...

Edited by thescientist
Link to comment
Share on other sites

I think I'm ready for some meat! I've seen some useful little functions he's written (not to mention his large projects) and I'm very interested in the tricks he has up his sleeve.

Link to comment
Share on other sites

Once you convert a JSON string to a data structure, you can use it normally. JSON is just a way to represent arrays and objects. If you have a JSON string that represents an array, and you convert it back into an actual array, then you can use the normal array methods on it.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...