mirror of
https://github.com/fofolee/uTools-Manuals.git
synced 2026-04-24 11:22:42 +08:00
语法高亮，滚动条美化，设置页面调整
This commit is contained in:
fofolee
@@ -5,7 +5,7 @@
|
||||
<div><iframe class="interactive interactive-js" frameborder="0" height="250" src="https://interactive-examples.mdn.mozilla.net/pages/js/json-parse.html" width="100%"></iframe></div>
|
||||
<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a class="external" href="https://github.com/mdn/interactive-examples" rel="noopener">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p>
|
||||
<h2 id="Syntax" name="Syntax">语法</h2>
|
||||
<pre class="syntaxbox">JSON.parse(<em>text</em>[, <em>reviver</em>])</pre>
|
||||
<pre><code class="language-javascript">JSON.parse(<em>text</em>[, <em>reviver</em>])</code></pre>
|
||||
<h3 id="Parameters" name="Parameters">参数</h3>
|
||||
<dl>
|
||||
<dt><code>text</code></dt>
|
||||
@@ -19,18 +19,18 @@
|
||||
<p>若传入的字符串不符合 JSON 规范，则会抛出 <a href="Reference/Global_Objects/SyntaxError" title="SyntaxError 对象代表尝试解析语法上不合法的代码的错误。"><code>SyntaxError</code></a> 异常。</p>
|
||||
<h2 id="Examples" name="Examples">示例</h2>
|
||||
<h3 id="Example:_Using_JSON.parse" name="Example:_Using_JSON.parse">使用 <code>JSON.parse()</code></h3>
|
||||
<pre class="brush: js">JSON.parse('{}'); // {}
|
||||
<pre><code class="language-javascript">JSON.parse('{}'); // {}
|
||||
JSON.parse('true'); // true
|
||||
JSON.parse('"foo"'); // "foo"
|
||||
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
|
||||
JSON.parse('null'); // null
|
||||
JSON.parse('1'); // 1
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p> </p>
|
||||
<h3 id="Example:_Using_the_reviver_parameter" name="Example:_Using_the_reviver_parameter">使用 <code>reviver</code> 函数</h3>
|
||||
<p>如果指定了 <code>reviver</code> 函数，则解析出的 JavaScript 值（解析值）会经过一次转换后才将被最终返回（返回值）。更具体点讲就是：解析值本身以及它所包含的所有属性，会按照一定的顺序（从最最里层的属性开始，一级级往外，最终到达顶层，也就是解析值本身）分别的去调用 <code>reviver</code> 函数，在调用过程中，当前属性所属的对象会作为 <code>this</code> 值，当前属性名和属性值会分别作为第一个和第二个参数传入 <code>reviver</code> 中。如果 <code>reviver</code> 返回 <code>undefined</code>，则当前属性会从所属对象中删除，如果返回了其他值，则返回的值会成为当前属性新的属性值。</p>
|
||||
<p>当遍历到最顶层的值（解析值）时，传入 <code>reviver</code> 函数的参数会是空字符串 <code>""</code>（因为此时已经没有真正的属性）和当前的解析值（有可能已经被修改过了），当前的 <code>this</code> 值会是 <code>{"": 修改过的解析值}</code>，在编写 <code>reviver</code> 函数时，要注意到这个特例。（这个函数的遍历顺序依照：从最内层开始，按照层级顺序，依次向外遍历）</p>
|
||||
<pre class="brush: js">JSON.parse('{"p": 5}', function (k, v) {
|
||||
<pre><code class="language-javascript">JSON.parse('{"p": 5}', function (k, v) {
|
||||
if(k === '') return v; // 如果到了最顶层，则直接返回属性值，
|
||||
return v * 2; // 否则将属性值变为原来的 2 倍。
|
||||
}); // { p: 10 }
|
||||
@@ -48,12 +48,12 @@ JSON.parse('{"1": 1, "2": 2,"3": {"4": 4, "5": {"6": 6}}}', function (k, v) {
|
||||
// 5
|
||||
// 3
|
||||
// ""
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h3 id="JSON.parse()_不允许用逗号作为结尾"><code>JSON.parse()</code> 不允许用逗号作为结尾</h3>
|
||||
<pre class="example-bad brush: js">// both will throw a SyntaxError
|
||||
JSON.parse("[1, 2, 3, 4, ]");
|
||||
JSON.parse('{"foo" : 1, }');
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h2 id="Specifications" name="Specifications">规范</h2>
|
||||
<table class="standard-table">
|
||||
<tbody>
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
<div></div>
|
||||
<p><code><strong>JSON.stringify()</strong></code> 方法是将一个JavaScript值(对象或者数组)转换为一个 JSON字符串，如果指定了replacer是一个函数，则可以替换值，或者如果指定了replacer是一个数组，可选的仅包括指定的属性。</p>
|
||||
<h2 id="Syntax" name="Syntax">语法</h2>
|
||||
<pre class="syntaxbox"><code>JSON.stringify(<em>value</em>[, <em>replacer</em> [, <em>space</em>]])</code>
|
||||
</pre>
|
||||
<pre><code class="language-javascript"><code>JSON.stringify(<em>value</em>[, <em>replacer</em> [, <em>space</em>]])</code>
|
||||
</code></pre>
|
||||
<h3 id="Parameters" name="Parameters">参数</h3>
|
||||
<dl>
|
||||
<dt><code>value</code></dt>
|
||||
@@ -28,7 +28,7 @@
|
||||
<li>所有以 symbol 为属性键的属性都会被完全忽略掉，即便 <code>replacer</code> 参数中强制指定包含了它们。</li>
|
||||
<li>不可枚举的属性会被忽略</li>
|
||||
</ul>
|
||||
<pre class="brush: js">JSON.stringify({}); // '{}'
|
||||
<pre><code class="language-javascript">JSON.stringify({}); // '{}'
|
||||
JSON.stringify(true); // 'true'
|
||||
JSON.stringify("foo"); // '"foo"'
|
||||
JSON.stringify([1, "false", false]); // '[1,"false",false]'
|
||||
@@ -76,7 +76,7 @@ JSON.stringify(
|
||||
);
|
||||
|
||||
// "{"y":"y"}"
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h3 id="replacer参数"><code>replacer参数</code></h3>
|
||||
<p>replacer参数可以是一个函数或者一个数组。作为函数，它有两个参数，键(key)值(value)都会被序列化。</p>
|
||||
<ul>
|
||||
@@ -96,25 +96,25 @@ JSON.stringify(
|
||||
}
|
||||
|
||||
var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
|
||||
var jsonString = JSON.stringify(foo, replacer);</code></pre>
|
||||
var jsonString = JSON.stringify(foo, replacer);</code></code></pre>
|
||||
<p>JSON序列化结果为 <code>{"week":45,"month":7}</code>.</p>
|
||||
<h4 id="例子(array)">例子(array)</h4>
|
||||
<p><code>如果replacer是一个数组，数组的值代表将被序列化成JSON字符串的属性名。</code></p>
|
||||
<pre><code>JSON.stringify(foo, ['week', 'month']);
|
||||
// '{"week":45,"month":7}', 只保留“week”和“month”属性值。</code></pre>
|
||||
// '{"week":45,"month":7}', 只保留“week”和“month”属性值。</code></code></pre>
|
||||
<h3 id="space_参数"><code>space</code> 参数</h3>
|
||||
<p>space 参数用来控制结果字符串里面的间距。如果是一个数字, 则在字符串化时每一级别会比上一级别缩进多这个数字值的空格（最多10个空格）；如果是一个字符串，则每一级别会比上一级别多缩进用该字符串（或该字符串的前十个字符）。</p>
|
||||
<pre class="brush: js">JSON.stringify({ a: 2 }, null, " "); // '{\n "a": 2\n}'</pre>
|
||||
<pre><code class="language-javascript">JSON.stringify({ a: 2 }, null, " "); // '{\n "a": 2\n}'</code></pre>
|
||||
<p>使用制表符（\t）来缩进：</p>
|
||||
<pre class="brush: js">JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
|
||||
<pre><code class="language-javascript">JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
|
||||
// '{ \
|
||||
// "uno": 1, \
|
||||
// "dos": 2 \
|
||||
// }'
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h3 id="toJSON_方法">toJSON 方法</h3>
|
||||
<p>如果一个被序列化的对象拥有 <code>toJSON</code> 方法，那么该 <code>toJSON</code> 方法就会覆盖该对象默认的序列化行为：不是那个对象被序列化，而是调用 <code>toJSON</code> 方法后的返回值会被序列化，例如：</p>
|
||||
<pre class="brush: js">var obj = {
|
||||
<pre><code class="language-javascript">var obj = {
|
||||
foo: 'foo',
|
||||
toJSON: function () {
|
||||
return 'bar';
|
||||
@@ -122,7 +122,7 @@ var jsonString = JSON.stringify(foo, replacer);</code></pre>
|
||||
};
|
||||
JSON.stringify(obj); // <code>'"bar"'</code>
|
||||
JSON.stringify({x: obj}); // <code>'{"x":"bar"}'</code>
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h3 id="JSON.stringify用作_JavaScript"><code>JSON.stringify</code>用作 JavaScript</h3>
|
||||
<p>注意JSON不是javascript严格意义上的子集，在JSON中不需要省略两条终线(Line separator和Paragraph separator)但在JavaScript中需要被省略。因此，如果JSON被用作JSONP时，下面方法可以使用：</p>
|
||||
<pre><code>function jsFriendlyJSONStringify (s) {
|
||||
@@ -146,10 +146,10 @@ eval('(' + jsFriendlyJSONStringify(s) + ')');
|
||||
|
||||
// console.log in Firefox unescapes the Unicode if
|
||||
// logged to console, so we use alert
|
||||
alert(jsFriendlyJSONStringify(s)); // {"a":"\u2028","b":"\u2029"}</code></pre>
|
||||
alert(jsFriendlyJSONStringify(s)); // {"a":"\u2028","b":"\u2029"}</code></code></pre>
|
||||
<h3 id="使用_JSON.stringify_结合_localStorage_的例子">使用 JSON.stringify 结合 localStorage 的例子</h3>
|
||||
<p>一些时候，你想存储用户创建的一个对象，并且，即使在浏览器被关闭后仍能恢复该对象。下面的例子是 <code>JSON.stringify</code> 适用于这种情形的一个样板：</p>
|
||||
<pre class="brush: js">// 创建一个示例数据
|
||||
<pre><code class="language-javascript">// 创建一个示例数据
|
||||
var session = {
|
||||
'screens' : [],
|
||||
'state' : true
|
||||
@@ -170,7 +170,7 @@ var restoredSession = JSON.parse(localStorage.getItem('session'));
|
||||
|
||||
// 现在 restoredSession 包含了保存在 localStorage 里的对象
|
||||
console.log(restoredSession);
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h2 id="规范">规范</h2>
|
||||
<table class="standard-table">
|
||||
<tbody>
|
||||
|
||||
Reference in New Issue
Block a user