This commit is contained in:
Ilya Kantor 2016-07-28 19:41:51 +03:00
parent 0831ea228f
commit 168a0d5d0f
9 changed files with 246 additions and 20 deletions

View file

@ -1,33 +1,159 @@
# JSON methods, toJSON
# JSON methods, toJSON [todo: after Date]
The [JSON](http://en.wikipedia.org/wiki/JSON) is mostly used to represent an object as a string.
The [JSON](http://en.wikipedia.org/wiki/JSON) (JavaScript Object Notation) format is used to represent an object as a string.
When we need to send an object over a network -- from the client to server or backwards, this format is used almost all the time.
When we need to send an object over a network -- from the client to server or in the reverse direction, this format is the most widespread.
Javascript provides built-in methods to convert objects into JSON and back, which also allow a few tricks that make them even more useful.
[cut]
## Формат JSON
## JSON.stringify
Данные в формате JSON ([RFC 4627](http://tools.ietf.org/html/rfc4627)) представляют собой:
JSON, despite its name (JavaScript Object Notation) is an independent standard. It is described as [RFC 4627](http://tools.ietf.org/html/rfc4627). Most programming languages have libraries to encode objects in it. So it's easy to use JSON for data exchange when the client uses Javascript and the server is written on Ruby/PHP/Java/Whatever.
- JavaScript-объекты `{ ... }` или
- Массивы `[ ... ]` или
- Значения одного из типов:
- строки в двойных кавычках,
- число,
- логическое значение `true`/`false`,
In Javascript, the native method [JSON.stringify(value)](mdn:js/JSON/stringify) accepts a value and returns it's representation as a string in JSON format.
For instance:
```js run
let student = {
name: 'John',
age: 30,
isAdmin: false,
courses: ['html', 'css', 'js'],
wife: null
};
let json = JSON.stringify(student);
alert(typeof json); // string
alert(json);
/*
{
"name": "John",
"age": 30,
"isAdmin": false,
"courses": ["html", "css", "js"],
"wife": null
}
*/
```
The JSON-encoded object has several important differences from the original variant:
- Strings use double quotes. No single quotes or backticks in JSON. So `'John'` became `"John"`.
- Object property names are double-quoted also. Also obligatory. So `name` became `"name"`.
`JSON.stringify` can be applied not only to objects, but to other values:
```js run
// a number in JSON is just a number
alert( JSON.stringify(1) ) // 1
// a string in JSON is still a string, but double-quoted
alert( JSON.stringify('test') ) // "test"
// double quotes are escaped
alert( JSON.stringify('"quoted"') ) // "\"quoted\"" (inner quotes are escaped with \")
// array of objects
alert( JSON.stringify([{name: "John"},{name: "Ann"}]) ); // [{"name":"John"},{"name":"Ann"}]
```
The supported JSON types are:
- Objects `{ ... }`
- Arrays `[ ... ]`
- Primitives:
- strings,
- numbers,
- boolean values `true/false`,
- `null`.
Почти все языки программирования имеют библиотеки для преобразования объектов в формат JSON.
In the examples above we can see them all.
Основные методы для работы с JSON в JavaScript -- это:
JSON format does not support any other values.
- `JSON.parse` -- читает объекты из строки в формате JSON.
- `JSON.stringify` -- превращает объекты в строку в формате JSON, используется, когда нужно из JavaScript передать данные по сети.
For instance, functions and `undefined` values, symbolic properties are skipped by `JSON.stringify`:
## Метод JSON.parse
```js run
let user = {
sayHi() { // ignored
alert("Hello");
},
[Symbol("id")]: 123, // ignored
something: undefined // ignored
};
alert( JSON.stringify(user) ); // {} (empty object)
```
### Custom "toJSON"
Normally, an object is represented with a list of its properties.
But it may provide its own JSON-transformation by implementing method `toJSON`.
For instance:
```js run
let room = {
number: 23
};
event = {
title: "Conference",
date: new Date(Date.UTC(2017, 0, 1)),
room
};
alert( JSON.stringify(event) );
/*
{
"title":"Conference",
*!*
"date":"2017-01-01T00:00:00.000Z", // (1)
*/!*
"room": {"number":23} // (2)
}
*/
```
Please note that `date` `(1)` became a string. That's because all dates have a built-in `toJSON` method.
Обратим внимание на два момента:
1. Дата превратилась в строку. Это не случайно: у всех дат есть встроенный метод `toJSON`. Его результат в данном случае -- строка в таймзоне UTC.
2. У объекта `room` нет метода `toJSON`. Поэтому он сериализуется перечислением свойств.
Мы, конечно, могли бы добавить такой метод, тогда в итог попал бы его результат:
```js run
var room = {
number: 23,
*!*
toJSON: function() {
return this.number;
}
*/!*
};
alert( JSON.stringify(room) ); // 23
```
If our object wants to provide its own logic for JSON conversion TOJSON
The result of `JSON.stringify` is a string. We can send it over the wire or put in the plain data storage.
To turn a JSON-string back into the object, we need another method named [JSON.parse](mdn:js/JSON/parse).
## JSON.parse
Вызов `JSON.parse(str)` превратит строку с данными в формате JSON в JavaScript-объект/массив/значение.

View file

@ -136,7 +136,9 @@ alert(`Length: ${arr.length}`); // 5, remember, length is the last index + 1
````
## Summary [todo]
Futher in the chapter <info:map-set-weakmap-weakset> we will meet other data structures `Map` and `Set` that also implement methods `keys()`, `values()` and `entries()`.

View file

@ -1,4 +1,5 @@
# TODO: Code quality
# Code quality
This chapter goes early to explain coding practices that we'll use further in the development.
In this chapter we cover common, but very important things. Probably you'll want to reread some chapters later when you learn more about the language and write more code.

View file

@ -42,7 +42,8 @@ data-types
number (rounding, precision, isFinite, isNaN, parse*, Math.*)
string (quotes, search, substring, tagged template notice)
<<< object-descriptors
<<< property-descriptors
array-methods (TODO: translate tasks)
map-set-weakmap-weakset

96
1-js/plan3.txt Normal file
View file

@ -0,0 +1,96 @@
getting-started
introduction
editor
devtools
first-steps
hello-world (intro, ext scripts)
structure
use strict
variables (const, name things right)
types (no objects, but typeof)
type-conversions (conversions string/number/boolean, no objects)
operators
comparison (no objects)
uibasic
logical-ops
while-for (labels, no objects)
switch
function-basics (decl, shadowing, naming, default params)
function-expressions-arrows (function expr, arrow, todo: move new Function out of this?)
javascript-specials (TODO, remove it? migrate all function* to separate chapter?)
object-basics
object(props, for-in, refs, assign)
garbage-collection
object-methods (this, method syntax, no call/apply)
primitives-methods (on-the-fly objects)
symbol
object-toprimitive
array
iterable
<<< json
more-syntax
function-arguments-rest-spread
destructuring-assignment (also func params destructuring)
advanced-loops (iterators over objects, arrays)
code-quality
debugging-chrome (TODO)
coding-style (TODO)
write-unmaintainable-code (TODO)
test-driven-development (TODO)
polyfills (TODO)
data-types
number (rounding, precision, isFinite, isNaN, parse*, Math.*)
string (quotes, search, substring, tagged template notice)
<<< property-descriptors
array-methods (TODO: translate tasks)
map-set-weakmap-weakset
date (TODO: tasks)
deeper
recursion
running execution context = where + lexical environment = envrec + outer
context stack
pow task
traverse list task
task: traverse list back
closures
LE outer
returning a function
garbage collection
var
window
function-object
name property (obj props, methods, assignments - set it)
length property
custom properties
new function
scheduling: settimeout, setinterval
recursive settimeout
call-apply-decorators
bind
-------
<<< descriptors (TODO: LATER, need JSON to output, better after inheritance to explain getOwnProps)
<<< getter setter
constructors
classes
instanceof
после 4-object сделать
descriptors
more-features
try..catch
setTimeout
JSON
======
class A extends Object != class A