创建JavaScript函数的替代方法

Question

I came across the following script, and do not understand the first line. It apparently either returns JSON.stringify or an anonymous function. Is it best to do it this way, or using the traditional the function printObj(obj) ? Also, where does JSON get defined? Thanks

var printObj = typeof JSON != "undefined" ? JSON.stringify : function(obj) {
  var arr = [];
  $.each(obj, function(key, val) {
    var next = key + ": ";
    next += $.isPlainObject(val) ? printObj(val) : val;
    arr.push( next );
  });
  return "{ " +  arr.join(", ") + " }";
};

$("#log").append( printObj(object1) );

Answer 1

var printObj = // setting the variable printObj
               typeof JSON != 'undefined' // if this is true then set printObj to
                    ? JSON.stringify // <- ...this function
               : function( obj ) {
                   // otherwise let's build it ourselves...
               };

typeof JSON != 'undefined' will return true or false whether the identifier JSON has been defined. typeof x will not cause a reference error if x has not been defined.

Answer 2

JSON is already a function that exists in javascript. (It has stringify and parse which you are most likely to use)

The first line, just makes sure that a function exists for stringify, if it doesn't then it passes the object to a function function that attempts to parse the JSON object and return it as a JSON string.

(I believe that the function "hack" that you are using, is done to fix an IE8 compatibility issue , where IE8 doesn't have a JSON object. You can avoid using that altogether if you set in your page:

<meta http-equiv="X-UA-Compatible" content="IE=8" />

Also, the structure of that first line assignment, uses something called ternary operator assignment .

For example:

var t = 1 == 1 ? 1 : 0;

Answer 3

JSON is a variable automatically defined by some of the Web browsers, like FireFox and Chrome. Old versions of IE do not define JSON, and a lot of annoying users still have these versions, and that is why it is defined manually in this case.

I think the best solution, is to just add a reference to the json library. Can be found here : http://www.json.org/js.html

Answer 4

It defines a printObj function that can always be used :

• if JSON.stringify is defined, printObj is this function
• if JSON.stringify isn't available, the new function is used

Note that

• this can only make sense if you want to support IE7 as modern browsers all have JSON.stringify
• the replacement function cannot work correctly if obj is an array (it build a string {...} )

Answer 5

"I came across the following script, and do not understand the first line. It apparently either returns JSON.stringify or an anonymous function. "

Seems that you do understand the first line.

"Is it best to do it this way, or using the traditional the function printObj(obj) ? "

Simply defining the function will have a different outcome, since the native JSON.stringify would be ignored, and should be preferred over a shim.

The alternate given in the question isn't a full shim, and even if it was, the native would most certainly perform better.

"Also, where does JSON get defined?"

It's defined in ECMAScript 5 environments by default.

Answer 6

Using this syntax, you're able to create a function at the same time as checking for the existence of a suitable built in method. JSON is an object that some modern browsers have built into the engine, and much like Window or Location. Older browsers wouldn't have JSON, and and therefore would return undefined, and allowing the custom anonymous function to be used.