Preface:
A recent project encountered a need to show a device in the required data format out of the front page, user-friendly configuration. Beginning a simple format to write data to the pretag, but the tag data written by the pre code format is not very elegant visualized on. For the foregoing reasons, so we create a global data format configuration file, through es6 to implementation of the template string, this would resolve the code is not elegant visual problems. But later they increased the demand for a dynamic data format, so that it can not be solved by a string template, so there is this article about by jsformat painting JSONprogram data, this article is intended to record programs to achieve methods to facilitate their later encounter the same requirements directly copy and paste, but also hope to help farmers to meet code requirements like me.
Effect example is as follows:
Preview Address: JS achieve JSON formatted data
jsFormatting JSONprocess data are as follows, wherein each of the code blocks and what is meant specifically indicated complete functions are described in detail by way of comment.
1 // Format Method 2 // public methods . 3 function transitionJsonToString (jsonObj, the callback) { . 4 // jsonObj receptor converted object . 5 var _jsonObj = null ; . 6 // Analyzing the object is not passed jsonObj string, string objects need to be converted, and then converted to a string, this string is to ensure that the converted double quote . 7 IF (Object.prototype.toString.call (jsonObj)! == "[Object string]" ) { . 8 the try { . 9 _jsonObj = the JSON.stringify (jsonObj); 10 } the catch (error) { . 11 // conversion failed error message 12 is console.error ( 'json you pass the data format is incorrect, please check ...' ); 13 is console.error (error); 14 the callback (error); 15 } 16 } the else { . 17 the try { 18 is jsonObj = jsonObj .replace (/ (\ ') / G,' \ " ' ); . 19 _jsonObj = the JSON.stringify (the JSON.parse (jsonObj)); 20 is } the catch (error) { 21 is // conversion failed error message 22 is console.error ( 'you pass the json data format is incorrect, please check ...' ); 23 console.error (error); 24 the callback (error); 25 } 26 is } 27 return _jsonObj; 28 } 29 // the callback time data formatting error handling function 30 function formatJson (jsonObj, the callback) { 31 is // regular expression formula variable matching rule 32 var REG = null ; 33 is // string variable converted 34 is var formatted = '' ; 35 // transducer median line indentation 36 var PAD = 0 ; 37 [ //A space corresponding to the number of bits tab 38 is var PADDING = '' ; 39 // JSON object into a string variable 40 var JSONString = transitionJsonToString (jsonObj, the callback); 41 is IF (! JSONString) { 42 is return JSONString; 43 is } 44 is // string that requires special handling storage section 45 var the _index = []; 46 is // "re-start position in the array variable storage requires special handling index 47 var _indexStart = null ; 48 // storage requires special handling" re-array variable index end position 49 var= _indexEnd null ; 50 // the string contents by JSONString \ r \ n symbols into arrays 51 is var JSONArray = []; 52 is // regular matched to {} symbols added on both sides of the carriage return line 53 is JSONString = JSONString. Replace (/ ([\ {\}]) / G, '\ R & lt \ n-$. 1 \ R & lt \ n-' ); 54 is // regular match to [,] is added on either side of the symbol row carriage return 55 JSONString = jsonString.replace (/ ([\ [\]]) / G, '\ R & lt \ n-$. 1 \ R & lt \ n-' ); 56 is // regular matched symbol is added on both sides of carriage return line 57 is JSONString jsonString.replace = (/ ( \,) / G, '$. 1 \ R & lt \ n-' ); 58 // regular matched to more than one line need to wrap line 59 = jsonString.replace JSONString (/ (\ R & lt \ n-\ R & lt \ n-) / G, '\ R & lt \ n-' ); 60 // regular line is matched to the individual, the need to remove the wrap when symbols, placed peer 61 is JSONString jsonString.replace = (/ \ R & lt \ n-\, / G, ',' ); 62 is // content of double quotes special treatment 63 is JSONArray = jsonString.split ( '\ R & lt \ n-' ); 64 JSONArray. forEach ( function (Node, index) { 65 // Get the current string segment "number 66 var ? node.match NUM = (/ \" / G) node.match (/ \ "/ G) .length: 0 ; 67 // determines whether an odd num to determine whether special treatment 68 iF (2% num &&! {_indexStart) 69 = _indexStart index 70 } 71 is IF (NUM% 2 && && _indexStart _indexStart! = index) { 72 _indexEnd = index 73 is } 74 // the actually stored position and end position information of the string segments that require special handling, and the corresponding weight when set variable start and end 75 IF (_indexStart && _indexEnd) { 76 _index.push ({ 77 start: _indexStart, 78 end: _indexEnd 79 }) 80 _indexStart = null 81 _indexEnd = null 82 } 83 }) 84 // begin processing contents double quotes, excess "Remove 85 _index.reverse (). ForEach ( function (Item, index) { 86 var newArray = jsonArray.slice (item.start, Item +. 1 .end ) 87 jsonArray.splice - (item.start, item.end +. 1 item.start, newArray.join ( '' )) 88 }) 89 // array connector after treatment by the prize \ r \ n recombinant string of 90 JSONString = jsonArray.join ( '\ R & lt \ n-' ); 91 is // will match to: increase the parentheses is replaced CRLF increase colon bracket 92 JSONString jsonString.replace = (/ \: \ R & lt \ n-\ {/ G, ': {' ); 93 // will match to: after CRLF is replaced with a colon in square brackets in square brackets 94 JSONString jsonString.replace = (/ \: \ R & lt \ n-\ [/ G, ': [' ); 95 // above the converted string again \ r \ n into the array 96 JSONArray = jsonString.split ( '\ r \ n' ); 97 // convert the string to complete the combination into the final form according PADDING value 98 JSONArray. forEach ( function (Item, index) { 99 the console.log (Item) 100 var I = 0 ; 101 // number of bits representing indented, counts as a tab 102 var indent = 0 ; 103 // represents indented digit counts as a space 104 var padding = ''; 105 IF (item.match (/ \ {$ /) || item.match (/ \ [$ / )) { 106 // matched to the time and to the end of {[indent plus. 1 107 indent +. 1 = 108 } the else IF (item.match (/ \} $ /) || item.match (/ \] $ /) || item.match (/ \}, $ /) || item.match (/ \], $ / )) { 109 // matched to and}] when the end of the indent Save. 1 110 IF (PAD == 0! ) { 111 PAD -. 1 = 112 } 113 } the else { 114 indent = 0 115 } 1 16 for(I = 0; I <PAD; I ++ ) { 117 padding + = PADDING 1 18 } 119 formatted + = padding + Item + '\ R & lt \ n-' 120 PAD + = indent 121 }) 122 // returned data is necessary to remove both sides spaces 123 return formatted.trim (); 124 }