diff --git a/docs/javascript/base/02-variables.md b/docs/javascript/base/02-variables.md index bb3fc55..98718a7 100644 --- a/docs/javascript/base/02-variables.md +++ b/docs/javascript/base/02-variables.md @@ -12,7 +12,7 @@ sidebar_position: 2 - const (константа, т.е. изменению не подлежит) - var (устаревший способ, подробности позже) -``` +```js let message; message = 'Hello'; // сохранить строку 'Hello' в переменной с именем message @@ -43,7 +43,7 @@ message = 'Hello'; Оператор typeof возвращает тип значения переменной, с двумя исключениями: -``` +```js typeof null == "object" // ошибка в языке typeof function(){} == "function" // именно для функций ``` \ No newline at end of file diff --git a/docs/javascript/base/03-type-conversion.md b/docs/javascript/base/03-type-conversion.md index 5bce62b..4af9ca2 100644 --- a/docs/javascript/base/03-type-conversion.md +++ b/docs/javascript/base/03-type-conversion.md @@ -5,14 +5,18 @@ sidebar_position: 3 # Преобразование типов ## Строковое преобразование -**String(value)** +```js +String(value) ``` +```js alert(typeof value); // string ``` ## Численное преобразование -**Number(str)** +```js +Number(str) ``` +```js let num = Number(str); // становится числом 123 ``` | Значение | Преобразуется в… | @@ -22,14 +26,16 @@ let num = Number(str); // становится числом 123 | true / false | 1 / 0 | | string | Пробельные символы (пробелы, знаки табуляции \t, знаки новой строки \n и т. п.) по краям обрезаются. Далее, если остаётся пустая строка, то получаем 0, иначе из непустой строки «считывается» число. При ошибке результат NaN. | -``` +```js alert( Number(" 123 ") ); // 123 alert( Number("123z") ); // NaN (ошибка чтения числа на месте символа "z") alert( Number(true) ); // 1 alert( Number(false) ); // 0 ``` ## Логическое преобразование -**Boolean(value)**\ +```js +Boolean(value) +``` Происходит в логических операциях, но также может быть выполнено явно с помощью функции Boolean(value). Правило преобразования: @@ -41,7 +47,7 @@ alert( Number(false) ); // 0 | 0, null, undefined, NaN, "" | false | | любое другое значение | true | -``` +```js alert( Boolean(1) ); // true alert( Boolean(0) ); // false alert( Boolean("Привет!") ); // true diff --git a/docs/javascript/base/04-operators.md b/docs/javascript/base/04-operators.md index 4229891..19590eb 100644 --- a/docs/javascript/base/04-operators.md +++ b/docs/javascript/base/04-operators.md @@ -32,8 +32,8 @@ sidebar_position: 4 ## Оператор «запятая» Оператор «запятая» предоставляет нам возможность вычислять несколько выражений, разделяя их запятой ,. Каждое выражение выполняется, но возвращается результат только последнего. -``` -let a = (1 + 2, 3 + 4); \ -alert( a ); // 7 (результат вычисления 3 + 4) \ +```js +let a = (1 + 2, 3 + 4); +alert( a ); // 7 (результат вычисления 3 + 4) ``` ❗ ***Запятая имеет очень низкий приоритет*** \ No newline at end of file diff --git a/docs/javascript/base/06-conditions-logic.md b/docs/javascript/base/06-conditions-logic.md index 8c3fb7b..4e86f4b 100644 --- a/docs/javascript/base/06-conditions-logic.md +++ b/docs/javascript/base/06-conditions-logic.md @@ -11,7 +11,7 @@ sidebar_position: 6 ***Несколько условий: «else if»*** ## Конструкция "switch" -``` +```js let a = 2 + 2; switch (a) { @@ -29,7 +29,7 @@ switch (a) { } ``` ## Условный оператор „?“ (тернарный) -``` +```js let result = условие ? значение1 : значение2; ``` ## Логические операторы @@ -45,14 +45,14 @@ let result = условие ? значение1 : значение2; - ??= (Оператор нулевого присваивания) ### || (ИЛИ) -``` +```js ( true || true ); // true ( false || true ); // true ( true || false ); // true ( false || false ); // false ``` ### ИЛИ "||" находит первое истинное значение -``` +```js ( 1 || 0 ); // 1 (1 - истинное значение) ( true || 'какая-то строка' ); // true ( null || 1 ); // 1 (первое истинное значение) @@ -61,7 +61,7 @@ let result = условие ? значение1 : значение2; ``` ### ||= (Логическое присваивание ИЛИ) -``` +```js a ||= b; ``` Оператор **||=** принимает два операнда и выполняет следующие действия: @@ -71,14 +71,14 @@ a ||= b; - Если ***a*** ложно, присваивает ***a*** значение ***b***. ### && (И) -``` +```js ( true && true ); // true ( false && true ); // false ( true && false ); // false ( false && false ); // false ``` #### И «&&» находит первое ложное значение -``` +```js result = value1 && value2 && value3; ``` Оператор **&&** выполняет следующие действия: @@ -103,7 +103,7 @@ result = value1 && value2 && value3; Несмотря на то, что вариант с && кажется более коротким, if более нагляден и, как правило, более читабелен. ### &&= (Логическое присваивание И) -``` +```js a &&= b; ``` Принцип действия **&&=** практически такой же, как и у оператора логического присваивания **ИЛИ ||=**. \ @@ -112,7 +112,7 @@ a &&= b; ### ! (НЕ) -``` +```js result = !value; ``` @@ -146,19 +146,19 @@ result = !value; По соображениям безопасности JavaScript запрещает использование оператора **??** вместе с **&&** и **||**, если приоритет явно не указан при помощи круглых скобок. -``` +```js let x = 1 && 2 ?? 3; // Синтаксическая ошибка ``` Используйте скобки, чтобы обойти это ограничение: -``` +```js let x = (1 && 2) ?? 3; // Работает без ошибок ``` ### Оператор нулевого присваивания (??=) Предположим, нам необходимо проверить, равна ли переменная null или undefined, и если это так — присвоить этой переменной какое-либо другое значение. -``` +```js let userAge = null; if (userAge === null || userAge === undefined) { @@ -167,10 +167,12 @@ if (userAge === null || userAge === undefined) { ``` Выглядит громоздко, правда? Существует оператор, более подходящий для подобных задач. -```x ??= y``` +```js +x ??= y +``` Оператор **??=** присвоит **x** значение **y** только в том случае, если **x** не определено (null/undefined). -``` +```js let userAge = null; userAge ??= 18; alert(userAge) // 18 diff --git a/docs/javascript/base/07-cycles.md b/docs/javascript/base/07-cycles.md index 04342c4..d4fd8bc 100644 --- a/docs/javascript/base/07-cycles.md +++ b/docs/javascript/base/07-cycles.md @@ -9,20 +9,20 @@ sidebar_position: 7 - **for…of** для перебора массивов и перебираемых объектов. ## Цикл «while» -``` +```js while (condition) { // код // также называемый "телом цикла" } ``` ## Цикл «do…while» -``` +```js do { // тело цикла } while (condition); ``` ## Цикл «for» -``` +```js for (let i = 0; i < 3; i++) { alert(i); } @@ -35,4 +35,6 @@ for (let i = 0; i < 3; i++) { ## Переход к следующей итерации: continue ❗ Нельзя использовать break/continue справа от оператора „?“ \ Обратите внимание, что эти синтаксические конструкции не являются выражениями и не могут быть использованы с тернарным оператором ?. В частности, использование таких директив, как **break/continue**, вызовет ошибку. -> (i > 5) ? alert(i) : continue; // continue здесь приведёт к ошибке \ No newline at end of file +```js +(i > 5) ? alert(i) : continue; // continue здесь приведёт к ошибке +``` \ No newline at end of file diff --git a/docs/javascript/base/_category_.json b/docs/javascript/base/_category_.json index 9262443..6d35d3a 100644 --- a/docs/javascript/base/_category_.json +++ b/docs/javascript/base/_category_.json @@ -1,5 +1,5 @@ { - "label": "Основа", + "label": "Введение", "position": 1, "link": { "type": "generated-index" diff --git a/docs/javascript/functions/01-intro.md b/docs/javascript/functions/01-intro.md index 4867473..348f957 100644 --- a/docs/javascript/functions/01-intro.md +++ b/docs/javascript/functions/01-intro.md @@ -2,10 +2,10 @@ sidebar_position: 1 --- -# Введение +# Общая информация #### Function Declaration: функция в основном потоке кода -``` +```js function sum(a, b) { let result = a + b; @@ -14,7 +14,7 @@ function sum(a, b) { ``` #### Function Expression: функция как часть выражения -``` +```js let sum = function(a, b) { let result = a + b; @@ -23,7 +23,7 @@ let sum = function(a, b) { ``` #### Стрелочные функции: -``` +```js // выражение в правой части let sum = (a, b) => a + b; diff --git a/docs/javascript/functions/02-func-declaration.md b/docs/javascript/functions/02-func-declaration.md index 2966c02..6727568 100644 --- a/docs/javascript/functions/02-func-declaration.md +++ b/docs/javascript/functions/02-func-declaration.md @@ -5,9 +5,9 @@ sidebar_position: 2 # Function Declaration Function Declaration (Объявление Функции): -``` +```js function имя(параметры, через, запятую) { - ...тело, код функции... + //...тело, код функции... } ``` Переменные, объявленные внутри функции, видны только внутри этой функции. diff --git a/docs/javascript/functions/03-func-expression.md b/docs/javascript/functions/03-func-expression.md index 068d432..e877661 100644 --- a/docs/javascript/functions/03-func-expression.md +++ b/docs/javascript/functions/03-func-expression.md @@ -6,7 +6,7 @@ sidebar_position: 3 **Function Declaration (Объявление Функции):** -``` +```js function sayHi() { alert( "Привет" ); } @@ -14,7 +14,7 @@ function sayHi() { **Function Expression (Функциональное Выражение).** -``` +```js let sayHi = function() { alert( "Привет" ); }; @@ -25,7 +25,7 @@ let sayHi = function() { Давайте повторим: независимо от того, как создаётся функция – она является значением. В обоих приведённых выше примерах функция хранится в переменной sayHi. -``` +```js function sayHi() { alert( "Привет" ); } @@ -48,7 +48,7 @@ alert( sayHi ); // выведет код функции ***Function Declaration может быть вызвана раньше, чем она объявлена.*** -``` +```js sayHi("Вася"); // Привет, Вася function sayHi(name) { @@ -57,7 +57,7 @@ function sayHi(name) { ``` ***Function Expression создаётся, когда выполнение доходит до него, и затем уже может использоваться.*** -``` +```js sayHi("Вася"); // ошибка! let sayHi = function(name) { // (*) магии больше нет diff --git a/docs/javascript/functions/04-arrow-func.md b/docs/javascript/functions/04-arrow-func.md index 0a55e17..cd1280a 100644 --- a/docs/javascript/functions/04-arrow-func.md +++ b/docs/javascript/functions/04-arrow-func.md @@ -6,7 +6,9 @@ sidebar_position: 4 Существует ещё один очень простой и лаконичный синтаксис для создания функций, который часто лучше, чем Function Expression. -``` let sum = (a, b) => a + b;``` +```js +let sum = (a, b) => a + b; +``` ## У стрелочных функций нет «this» Если происходит обращение к this, его значение берётся снаружи. @@ -23,7 +25,7 @@ sidebar_position: 4 ## Стрелочные функции не имеют «arguments» Это отлично подходит для декораторов, когда нам нужно пробросить вызов с текущими this и arguments. -``` +```js function defer(f, ms) { return function() { setTimeout(() => f.apply(this, arguments), ms) @@ -40,7 +42,7 @@ sayHiDeferred("John"); // выводит "Hello, John" через 2 секунд То же самое без стрелочной функции выглядело бы так: -``` +```js function defer(f, ms) { return function(...args) { let ctx = this; diff --git a/docs/javascript/objects/01-intro.md b/docs/javascript/objects/01-intro.md new file mode 100644 index 0000000..fdc3259 --- /dev/null +++ b/docs/javascript/objects/01-intro.md @@ -0,0 +1,120 @@ +--- +sidebar_position: 1 +--- + +# Объекты +Объекты – это ассоциативные массивы с рядом дополнительных возможностей. + +Они хранят свойства (пары ключ-значение), где: + +- Ключи свойств должны быть строками или символами (обычно строками). +- Значения могут быть любого типа. + +Чтобы получить доступ к свойству, мы можем использовать: + +- Запись через точку: obj.property. +- Квадратные скобки obj["property"]. Квадратные скобки позволяют взять ключ из переменной, например, obj[varWithKey]. + +Дополнительные операторы: + +- Удаление свойства: delete obj.prop. +- Проверка существования свойства: "key" in obj. +- Перебор свойств объекта: цикл for for (let key in obj). + +```js +let user = new Object(); // синтаксис "конструктор объекта" +let user = {}; // синтаксис "литерал объекта" +``` + +При использовании литерального синтаксиса \{...\} мы сразу можем поместить в объект несколько свойств в виде пар «ключ: значение»\ +Имя свойства может состоять из нескольких слов, но тогда оно должно быть заключено в кавычки: +```js +let user = { // объект + name: "John", // под ключом "name" хранится значение "John" + age: 30, // под ключом "age" хранится значение 30 + "likes birds": true // имя свойства из нескольких слов должно быть в кавычках +}; +// получаем свойства объекта: +alert( user.name ); // John +``` + +Для удаления свойства мы можем использовать оператор delete: +```js +delete user.age; +``` + +💥 ***Объект, объявленный как константа, может быть изменён*** + +### Квадратные скобки +Для свойств, имена которых состоят из нескольких слов, доступ к значению «через точку» не работает +```js +let user = {}; + +// присваивание значения свойству +user["likes birds"] = true; + +// получение значения свойства +alert(user["likes birds"]); // true + +let key = "likes birds"; + +// то же самое, что и user["likes birds"] = true; +user[key] = true; + +// удаление свойства +delete user["likes birds"]; +``` + +Здесь переменная key может быть вычислена во время выполнения кода или зависеть от пользовательского ввода. После этого мы используем её для доступа к свойству. + +### Ограничения на имена свойств +Как мы уже знаем, имя переменной не может совпадать с зарезервированными словами, такими как «for», «let», «return» и т.д. + +Но для свойств объекта такого ограничения нет +Иными словами, нет никаких ограничений к именам свойств. Они могут быть в виде строк или символов (специальный тип для идентификаторов, который будет рассмотрен позже). +Все другие типы данных будут автоматически преобразованы к строке. +Например, если использовать число 0 в качестве ключа, то оно превратится в строку "0" + +Есть небольшой подводный камень, связанный со специальным свойством __proto__. Мы не можем установить его в необъектное значение: + +```js +let obj = {}; +obj.__proto__ = 5; // присвоим число +alert(obj.__proto__); // [object Object], значение - это объект, т.е. не то, что мы ожидали +``` + +### Проверка существования свойства, оператор «in» + +В отличие от многих других языков, особенность JavaScript-объектов в том, что можно получить доступ к любому свойству. Даже если свойства не существует – ошибки не будет! + +При обращении к свойству, которого нет, возвращается undefined. Это позволяет просто проверить существование свойства: +```js +let user = {}; + +alert( user.noSuchProperty === undefined ); // true означает "свойства нет" +``` + +### "key" in object +```js +let user = { name: "John", age: 30 }; + +alert( "age" in user ); // true, user.age существует +alert( "blabla" in user ); // false, user.blabla не существует +``` +### Цикл "for..in" +```js +let user = { + name: "John", + age: 30, + isAdmin: true +}; + +for (let key in user) { + // ключи + alert( key ); // name, age, isAdmin + // значения ключей + alert( user[key] ); // John, 30, true +} +``` +### Упорядочение свойств объекта +Cвойства упорядочены особым образом: свойства с целочисленными ключами сортируются по возрастанию, остальные располагаются в порядке создания. diff --git a/docs/javascript/objects/index.md b/docs/javascript/objects/index.md deleted file mode 100644 index e69de29..0000000