Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion modules/25-strings/10-quotes/index.js
Original file line number Diff line number Diff line change
@@ -1 +1 @@
console.log('"Khal Drogo\'s favorite word is "athjahakar""');
console.log('The file "user\'s_config.json" was not found.');
13 changes: 4 additions & 9 deletions modules/25-strings/10-quotes/ru/EXERCISE.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,7 @@

Напишите программу, которая выведет на экран:

```
"Khal Drogo's favorite word is "athjahakar""
```

Программа должна в точности вывести на экран именно эту фразу. Обратите внимание на кавычки в начале и в конце фразы:
Программа не нашла нужный файл и вывела сообщение с его названием. Напишите программу, которая выводит то же самое сообщение:

```text
"Khal Drogo's favorite word is "athjahakar""
The file "user's_config.json" was not found.
```

Строка содержит и апостроф, и двойные кавычки — выберите подходящий способ их записи.
93 changes: 55 additions & 38 deletions modules/25-strings/10-quotes/ru/README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
Строки в программировании на JavaScript используются очень часто и в самых разных ситуациях. С их помощью мы работаем с текстом, выводим сообщения на экран, обрабатываем пользовательский ввод и взаимодействуем с внешними системами.

![Строки](./assets/strings.png)

С точки зрения JavaScript строка представляет собой просто набор символов, заключённый в кавычки. Посмотрим на примеры.

Check notice on line 5 in modules/25-strings/10-quotes/ru/README.md

View workflow job for this annotation

GitHub Actions / LanguageTool

[LanguageTool] modules/25-strings/10-quotes/ru/README.md#L5

Unpaired symbol: ‘'’ seems to be missing (EN_UNPAIRED_QUOTES) URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US Category: PUNCTUATION
Raw output
modules/25-strings/10-quotes/ru/README.md:5:110: Unpaired symbol: ‘'’ seems to be missing (EN_UNPAIRED_QUOTES)
 URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses 
 Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US
 Category: PUNCTUATION

Check notice on line 5 in modules/25-strings/10-quotes/ru/README.md

View workflow job for this annotation

GitHub Actions / LanguageTool

[LanguageTool] modules/25-strings/10-quotes/ru/README.md#L5

Unpaired symbol: ‘'’ seems to be missing (EN_UNPAIRED_QUOTES) URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US Category: PUNCTUATION
Raw output
modules/25-strings/10-quotes/ru/README.md:5:112: Unpaired symbol: ‘'’ seems to be missing (EN_UNPAIRED_QUOTES)
 URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses 
 Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US
 Category: PUNCTUATION

```javascript
'Hello'
Expand All @@ -7,81 +12,93 @@
''
```

Какие из этих пяти вариантов — строки?
Все эти варианты являются строками.

- `'Hello'`, `'Goodbye'` и `'G'` представляют собой строки из нескольких или одного символа.
- `' '` является строкой, состоящей из одного пробела.
- `''` является пустой строкой, в ней нет ни одного символа. Играет такую же роль, как 0 в математике.

То есть всё, что находится внутри кавычек, считается строкой, даже если там только пробел или вообще ничего нет.

С первыми двумя все понятно, это точно строки, мы уже работали с подобными конструкциями и говорили, что строки - это наборы символов.
## Терминология. Строка или строчка?

Любой одиночный символ в кавычках — это строка. Пустая строка `''` — это тоже строка. То есть строкой мы считаем всё, что находится внутри кавычек, даже если это пробел, один символ или вообще отсутствие символов.
В программировании есть терминологическая ловушка.

Ранее в уроках мы записывали строки в одинарных кавычках, но это не единственный способ. Можно использовать и двойные:
- Строка (string) является типом данных (то что разбирали выше), например `'hello'`.
- Строчка (line) является строкой текста в файле или в коде.

Например, в коде ниже есть строчка, но не строка.

```javascript
// Стандарт кодирования airbnb, рекомендует
// использовать, по возможности, одинарные
console.log("Dracarys!");
console.log(5);
```

Представьте, что вы хотите напечатать строчку _Dragon's mother_. Апостроф перед буквой **s** — это такой же символ, как одинарная кавычка. Попробуем:
Чтобы избежать путаницы, в этом курсе мы будем использовать такие формулировки.

- Строка, когда говорим о типе данных.
- Строчка, когда речь идёт о строках кода.

## Одинарные и двойные кавычки

В JavaScript строки можно записывать как в одинарных, так и в двойных кавычках.

```javascript
console.log('Hello');
console.log("Hello");
```

По умолчанию принято использовать одинарные кавычки `'`, если внутри строки не требуется двойных. Этого стиля придерживается популярный стандарт оформления кода от [AirBnb](https://github.com/airbnb/javascript).

## Проблема с кавычками внутри строки

Check notice on line 52 in modules/25-strings/10-quotes/ru/README.md

View workflow job for this annotation

GitHub Actions / LanguageTool

[LanguageTool] modules/25-strings/10-quotes/ru/README.md#L52

Unpaired symbol: ‘"’ seems to be missing (EN_UNPAIRED_QUOTES) URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US Category: PUNCTUATION
Raw output
modules/25-strings/10-quotes/ru/README.md:52:61: Unpaired symbol: ‘"’ seems to be missing (EN_UNPAIRED_QUOTES)
 URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses 
 Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US
 Category: PUNCTUATION

Представьте, что вы хотите напечатать строку *Dragon's mother*. В ней есть апостроф (*'s*), совпадающий с символом одинарной кавычки. Попробуем так.

Check notice on line 54 in modules/25-strings/10-quotes/ru/README.md

View workflow job for this annotation

GitHub Actions / LanguageTool

[LanguageTool] modules/25-strings/10-quotes/ru/README.md#L54

Unpaired symbol: ‘"’ seems to be missing (EN_UNPAIRED_QUOTES) URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US Category: PUNCTUATION
Raw output
modules/25-strings/10-quotes/ru/README.md:54:15: Unpaired symbol: ‘"’ seems to be missing (EN_UNPAIRED_QUOTES)
 URL: https://languagetool.org/insights/post/punctuation-guide/#what-are-parentheses 
 Rule: https://community.languagetool.org/rule/show/EN_UNPAIRED_QUOTES?lang=en-US
 Category: PUNCTUATION

```javascript
console.log('Dragon's mother');
// Uncaught SyntaxError: missing ) after argument list
```

Такая программа не будет работать. С точки зрения JavaScript, строка началась с одинарной кавычки, а потом закончилась после буквы **n**. Дальше были символы `s mother` без кавычек — значит, это не строка. А потом была одна открывающая строку кавычка, которая так и не закрылась: `');`. Этот код синтаксически некорректен (это видно даже по тому, как подсвечен код).

Здесь нам помогут двойные кавычки. Такой вариант программы отработает корректно:
JavaScript решит, что строка заканчивается после слова `Dragon`, а остальное не распознает как валидный код, что вызовет синтаксическую ошибку. Чтобы избежать этого, обернём строку в двойные кавычки.

```javascript
console.log("Dragon's mother");
```

Теперь интерпретатор знает, что строка началась с двойной кавычки — значит, и закончиться должна на двойной кавычке. А одинарная кавычка внутри стала частью строки.
Теперь JavaScript понимает, что одинарная кавычка внутри строки является обычным символом, а сама строка начинается и заканчивается двойными кавычками.

Верно и обратное. Если внутри строки мы хотим использовать двойные кавычки, то саму строку надо делать в одинарных. Причем количество кавычек внутри самой строки не важно.
Если внутри строки нужны двойные кавычки, а снаружи одинарные, проблем тоже не будет.

А что, если мы хотим создать такую строку:
```javascript
console.log('He said "No"');
```

Иногда в строке встречаются оба типа кавычек.

```
Dragon's mother said "No"
```

В ней есть и одинарные и двойные кавычки. Как быть в этой ситуации? Нужно каким-то образом сказать интерпретатору считать каждую кавычку частью строки, а не началом или концом строки.

Для этого **экранируют** специальные символы. В нашем случае тот символ, который является признаком конца и начала строки, это либо одинарная кавычка, либо двойная, в зависимости от ситуации. Для экранирования используется обратный слеш `\`.
В этом случае, чтобы JavaScript не спутал кавычки внутри строки с внешними, используют символ экранирования — обратный слэш `\`. Он говорит интерпретатору, что следующий за ним символ является частью строки, а не управляющим символом.

```javascript
// Экранируется только ", так как в этой ситуации
// двойные кавычки имеют специальное значение
console.log("Dragon's mother said \"No\"");
// => Dragon's mother said "No"
```

Посмотрите внимательно: нам нужно было добавить `\` для двойных кавычек, но не для одинарной (апостроф), потому что сама строка создана с двойными кавычками. Если бы строка создавалась с одинарными кавычками, то символ экранирования нужен был бы перед апострофом, но не перед двойными кавычками.
Здесь мы экранируем двойные кавычки внутри строки, заключённой в двойные кавычки.

То же самое работает и в обратном случае.

```javascript
// \ не выводится, если после него идет обычный,
// а не специальный символ
console.log("Death is \so terribly final");
// => Death is so terribly final
console.log('Dragon\'s mother said "No"');
// => Dragon's mother said "No"
```

А что, если нужно вывести сам обратный слеш? Точно так же, как и любой другой специальный символ, его надо экранировать самим собой.
## Как вывести обратный слэш

Чтобы вывести сам обратный слэш, его тоже нужно экранировать.

```javascript
console.log("\\");
// => \
```

Вопрос на самопроверку, что выведет этот код?

```javascript
console.log("\\ \\ \\\\ \\\ \'\"");
```

<details>
<summary>Ответ</summary>

Этот код выведет такую строку: `\ \ \\ \ '"`.

</details>
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions modules/25-strings/10-quotes/ru/data.yml
Original file line number Diff line number Diff line change
Expand Up @@ -2,5 +2,5 @@
name: Кавычки
tips:
- >
[Шаблонные
строки](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/template_strings)
[Строки в
JavaScript](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/String)
2 changes: 1 addition & 1 deletion modules/25-strings/10-quotes/test.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,5 @@ test('hello world', async () => {

const firstArg = consoleLogSpy.mock.calls.join('\n');

expect(firstArg).toBe('"Khal Drogo\'s favorite word is "athjahakar""');
expect(firstArg).toBe('The file "user\'s_config.json" was not found.');
});
4 changes: 3 additions & 1 deletion modules/25-strings/15-escape-characters/index.js
Original file line number Diff line number Diff line change
@@ -1 +1,3 @@
console.log('- Did Joffrey agree?\n- He did. He also said "I love using \\n".');
console.log(
'Для разделения строк используйте "\\n"\nПример: console.log("строка1\\nстрока2")',
);
9 changes: 4 additions & 5 deletions modules/25-strings/15-escape-characters/ru/EXERCISE.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,8 @@

Напишите программу, которая выводит на экран:
Вы пишете программу, которая показывает пользователю подсказку о том, как разбить текст на строки. Выведите подсказку одним вызовом `console.log()`:

```text
- Did Joffrey agree?
- He did. He also said "I love using \n".
Для разделения строк используйте "\n"
Пример: console.log("строка1\nстрока2")
```

При этом программа использует только один `console.log()`, но результат на экране должен выглядеть в точности, как показано выше.
Обратите внимание: `\n` в первой строке — это буквальный текст, а не перевод строки.
Loading
Loading