JavaScript: Кавычки
Строки в программировании на JavaScript используются очень часто и в самых разных ситуациях. С их помощью мы работаем с текстом, выводим сообщения на экран, обрабатываем пользовательский ввод и взаимодействуем с внешними системами.
С точки зрения JavaScript строка представляет собой просто набор символов, заключённый в кавычки. Посмотрим на примеры.
'Hello'
'Goodbye'
'G'
' '
''Все эти варианты являются строками.
'Hello','Goodbye'и'G'представляют собой строки из нескольких или одного символа.' 'является строкой, состоящей из одного пробела.''является пустой строкой, в ней нет ни одного символа. Играет такую же роль, как 0 в математике.
То есть всё, что находится внутри кавычек, считается строкой, даже если там только пробел или вообще ничего нет.
Если вывести строки на экран, то 'Hello' и 'Goodbye' будут хорошо заметны. Но ' ' и '' могут сбивать с толку, потому что вывод пустой строки выглядит как полное отсутствие, а строка с пробелом покажет «пустое место», которое визуально сложно отличить. При этом JavaScript чётко различает их. Пустая строка означает отсутствие символов, тогда как строка с пробелом содержит конкретный символ пробела.
Контрольный вопрос. Это одинаковые строки или нет?
'хекслет'
' хекслет'Терминология. Строка или строчка?
В программировании есть терминологическая ловушка.
- Строка (string) является типом данных (то что разбирали выше), например
'hello'. - Строчка (line) является строкой текста в файле или в коде.
Например, в коде ниже есть строчка, но не строка.
console.log(5);Чтобы избежать путаницы, в этом курсе мы будем использовать такие формулировки.
- Строка, когда говорим о типе данных.
- Строчка, когда речь идёт о строках кода.
Одинарные и двойные кавычки
В JavaScript строки можно записывать как в одинарных, так и в двойных кавычках.
console.log('Hello');
console.log("Hello");По умолчанию принято использовать одинарные кавычки ', если внутри строки не требуется двойных. Этого стиля придерживается популярный стандарт оформления кода от AirBnb.
Проблема с кавычками внутри строки
Представьте, что вы хотите напечатать строку Dragon's mother. В ней есть апостроф ('s), совпадающий с символом одинарной кавычки. Попробуем так.
console.log('Dragon's mother');
// Uncaught SyntaxError: missing ) after argument listJavaScript решит, что строка заканчивается после слова Dragon, а остальное не распознает как валидный код, что вызовет синтаксическую ошибку. Чтобы избежать этого, обернём строку в двойные кавычки.
console.log("Dragon's mother");Теперь JavaScript понимает, что одинарная кавычка внутри строки является обычным символом, а сама строка начинается и заканчивается двойными кавычками.
Если внутри строки нужны двойные кавычки, а снаружи одинарные, проблем тоже не будет.
console.log('He said "No"');Иногда в строке встречаются оба типа кавычек.
Dragon's mother said "No"В этом случае, чтобы JavaScript не спутал кавычки внутри строки с внешними, используют символ экранирования — обратный слэш \. Он говорит интерпретатору, что следующий за ним символ является частью строки, а не управляющим символом.
console.log("Dragon's mother said \"No\"");
// => Dragon's mother said "No"Здесь мы экранируем двойные кавычки внутри строки, заключённой в двойные кавычки.
Обратите внимание, JavaScript воспринимает \" как один символ-кавычку, а не два символа. То же самое касается \', \\, \n и других управляющих последовательностей. Они выглядят как два символа в коде, но в строке считаются за один.
То же самое работает и в обратном случае.
console.log('Dragon\'s mother said "No"');
// => Dragon's mother said "No"Как вывести обратный слэш
Чтобы вывести сам обратный слэш, его тоже нужно экранировать.
console.log("\\");
// => \Задание
Программа не нашла нужный файл и вывела сообщение с его названием. Напишите программу, которая выводит то же самое сообщение:
The file "user's_config.json" was not found.Строка содержит и апостроф, и двойные кавычки — выберите подходящий способ их записи.
Полезное
JavaScript: Кавычки
Строки в программировании на JavaScript используются очень часто и в самых разных ситуациях. С их помощью мы работаем с текстом, выводим сообщения на экран, обрабатываем пользовательский ввод и взаимодействуем с внешними системами.
С точки зрения JavaScript строка представляет собой просто набор символов, заключённый в кавычки. Посмотрим на примеры.
'Hello'
'Goodbye'
'G'
' '
''Все эти варианты являются строками.
'Hello','Goodbye'и'G'представляют собой строки из нескольких или одного символа.' 'является строкой, состоящей из одного пробела.''является пустой строкой, в ней нет ни одного символа. Играет такую же роль, как 0 в математике.
То есть всё, что находится внутри кавычек, считается строкой, даже если там только пробел или вообще ничего нет.
Если вывести строки на экран, то 'Hello' и 'Goodbye' будут хорошо заметны. Но ' ' и '' могут сбивать с толку, потому что вывод пустой строки выглядит как полное отсутствие, а строка с пробелом покажет «пустое место», которое визуально сложно отличить. При этом JavaScript чётко различает их. Пустая строка означает отсутствие символов, тогда как строка с пробелом содержит конкретный символ пробела.
Контрольный вопрос. Это одинаковые строки или нет?
'хекслет'
' хекслет'Терминология. Строка или строчка?
В программировании есть терминологическая ловушка.
- Строка (string) является типом данных (то что разбирали выше), например
'hello'. - Строчка (line) является строкой текста в файле или в коде.
Например, в коде ниже есть строчка, но не строка.
console.log(5);Чтобы избежать путаницы, в этом курсе мы будем использовать такие формулировки.
- Строка, когда говорим о типе данных.
- Строчка, когда речь идёт о строках кода.
Одинарные и двойные кавычки
В JavaScript строки можно записывать как в одинарных, так и в двойных кавычках.
console.log('Hello');
console.log("Hello");По умолчанию принято использовать одинарные кавычки ', если внутри строки не требуется двойных. Этого стиля придерживается популярный стандарт оформления кода от AirBnb.
Проблема с кавычками внутри строки
Представьте, что вы хотите напечатать строку Dragon's mother. В ней есть апостроф ('s), совпадающий с символом одинарной кавычки. Попробуем так.
console.log('Dragon's mother');
// Uncaught SyntaxError: missing ) after argument listJavaScript решит, что строка заканчивается после слова Dragon, а остальное не распознает как валидный код, что вызовет синтаксическую ошибку. Чтобы избежать этого, обернём строку в двойные кавычки.
console.log("Dragon's mother");Теперь JavaScript понимает, что одинарная кавычка внутри строки является обычным символом, а сама строка начинается и заканчивается двойными кавычками.
Если внутри строки нужны двойные кавычки, а снаружи одинарные, проблем тоже не будет.
console.log('He said "No"');Иногда в строке встречаются оба типа кавычек.
Dragon's mother said "No"В этом случае, чтобы JavaScript не спутал кавычки внутри строки с внешними, используют символ экранирования — обратный слэш \. Он говорит интерпретатору, что следующий за ним символ является частью строки, а не управляющим символом.
console.log("Dragon's mother said \"No\"");
// => Dragon's mother said "No"Здесь мы экранируем двойные кавычки внутри строки, заключённой в двойные кавычки.
Обратите внимание, JavaScript воспринимает \" как один символ-кавычку, а не два символа. То же самое касается \', \\, \n и других управляющих последовательностей. Они выглядят как два символа в коде, но в строке считаются за один.
То же самое работает и в обратном случае.
console.log('Dragon\'s mother said "No"');
// => Dragon's mother said "No"Как вывести обратный слэш
Чтобы вывести сам обратный слэш, его тоже нужно экранировать.
console.log("\\");
// => \Задание
Программа не нашла нужный файл и вывела сообщение с его названием. Напишите программу, которая выводит то же самое сообщение:
The file "user's_config.json" was not found.Строка содержит и апостроф, и двойные кавычки — выберите подходящий способ их записи.
Полезное
Ваше упражнение проверяется по этим тестам
// @ts-check
import { expect, test, vi } from 'vitest';
test('quotes', async () => {
const consoleLogSpy = vi.spyOn(console, 'log');
await import('./index.js');
const firstArg = consoleLogSpy.mock.calls.join('\n');
expect(firstArg).toBe('The file "user\'s_config.json" was not found.');
});Решение учителя откроется через:
20:00
