Если вы следуете Руководству по стилю Airbnb, лучше всего использовать «String ()» 👍
Я использую его еще и потому, что он наиболее явный и позволяет другим людям легко следовать замыслу вашего кода 🤓
Помните, что лучший код - это не обязательно самый умный способ, он лучше всего передает понимание вашего кода другим 💯
const value = 12345;
// Concat Empty String value + '';
// Template Strings `${value}`;
// JSON.stringify JSON.stringify(value);
// toString() value.toString();
// String() String(value);
// RESULT // '12345'
Сравнение 5 способов
Хорошо, давайте протестируем 5 способов с разными значениями. Вот переменные, с которыми мы собираемся их протестировать:
const string = "hello";
const number = 123;
const boolean = true;
const array = [1, "2", 3];
const object = {one: 1 };
const symbolValue = Symbol('123');
const undefinedValue = undefined;
const nullValue = null;
Concat пустая строка
string + ''; // 'hello' number + ''; // '123' boolean + ''; // 'true' array + ''; // '1,2,3' object + ''; // '[object Object]' undefinedValue + ''; // 'undefined' nullValue + ''; // 'null'
// ⚠️ symbolValue + ''; // ❌ TypeError
Отсюда вы можете видеть, что этот метод выдаст TypeError
, если значение равно Symbol
. В остальном все выглядит неплохо.
Строка шаблона
`${string}`; // 'hello' `${number}`; // '123' `${boolean}`; // 'true' `${array}`; // '1,2,3' `${object}`; // '[object Object]' `${undefinedValue}`; // 'undefined' `${nullValue}`; // 'null'
// ⚠️ `${symbolValue}`; // ❌ TypeError
Результат использования строки шаблона практически такой же, как и результат использования Concat Empty String. Опять же, это может быть не идеальный способ при работе с Symbol
, поскольку он выдаст TypeError
.
Если вам интересно, это TypeError: TypeError: Cannot convert a Symbol value to a string
JSON.stringify ()
// ⚠️
JSON.stringify(string); // '"hello"'
JSON.stringify(number); // '123'
JSON.stringify(boolean); // 'true'
JSON.stringify(array); // '[1,"2",3]'
JSON.stringify(object); // '{"one":1}'
JSON.stringify(nullValue); // 'null'
JSON.stringify(symbolValue); // undefined
JSON.stringify(undefinedValue); // undefined
Таким образом, вы обычно НЕ используете JSON.stringify для преобразования значения в строку. И здесь на самом деле никакого принуждения не происходит. Я в основном включил этот способ для полноты. Итак, вы знаете обо всех доступных вам инструментах. И тогда вы можете решить, какой инструмент использовать, а какой не использовать в зависимости от ситуации 👍
Я хочу отметить одну вещь, потому что вы можете этого не заметить. Когда вы используете его с фактическим значением string
, оно преобразуется в строку с кавычками.
Вы можете прочитать об этом в статье Кайла Симпсона, Вы не знаете, серия JS:
Строковая установка JSON
Примечание о важности знания основ!
Да, возможно, вы заметили в моих заметках по коду, я часто цитирую книги Кайла. Я, честно говоря, многому научился. Не имея опыта работы в области информатики, мне не хватает многих фундаментальных концепций. И его книга заставила меня осознать важность понимания основ. Для тех, кто хочет стать серьезным программистом, способ повышения уровня действительно состоит в том, чтобы ДЕЙСТВИТЕЛЬНО понять основы. Без него очень сложно повышать уровень. Вы в конечном итоге угадываете проблему. Но если вы знаете основы, вы поймете «почему» чего-то. А знание «почему» поможет вам лучше выполнять «как». Anyhoo, настоятельно рекомендую эту серию тем, кто хочет стать старшим программистом!
нанизывать()
string.toString(); // 'hello' number.toString(); // '123' boolean.toString(); // 'true' array.toString(); // '1,2,3' object.toString(); // '[object Object]' symbolValue.toString(); // 'Symbol(123)'
// ⚠️ undefinedValue.toString(); // ❌ TypeError nullValue.toString(); // ❌ TypeError
Так что битва действительно сводится к toString()
и String()
, когда вы хотите преобразовать значение в строку. Этот делает довольно хорошую работу. За исключением того, что это вызовет ошибку для undefined
и null
. Так что обязательно помни об этом
Нить()
String(string); // 'hello'
String(number); // '123'
String(boolean); // 'true'
String(array); // '1,2,3'
String(object); // '[object Object]'
String(symbolValue); // 'Symbol(123)'
String(undefinedValue); // 'undefined'
String(nullValue); // 'null'
Хорошо, думаю, мы нашли победителя 🏆
Как видите, String()
довольно хорошо справляется с null
и undefined
. Никаких ошибок не возникает - если только вы этого не хотите. Помните, что мое предложение является общим. Вы будете знать свое приложение лучше всех, поэтому вам следует выбрать наиболее подходящий для вашей ситуации способ.
Вывод: String () 🏆
После демонстрации того, как все разные методы обрабатывают разные типы значений. Надеюсь, вы знаете о различиях и знаете, какой инструмент выбрать в следующий раз, когда вы возьметесь за свой код. Если вы не уверены, String()
всегда подходит по умолчанию 👍
Вклад сообщества
@MaxStalker: Я бы использовал другой метод в зависимости от приложения:
- «» + Val: просто преобразовать число в строку - скажем, внутри .map ()
- JSON.stringify (val): необходимо преобразовать небольшой невложенный объект
- .toString (radix): преобразовать число в шестнадцатеричное или двоичное
@frontendr: Будьте осторожны при использовании JSON.stringify, который преобразует строку в строку с кавычками 😉
@ super.pro.dev: Я также знаю: new String (foo), но мне не нравится этот метод (он создаст объект String, в отличие от String (без «new ”), Которые создают строковый примитив)
Ресурсы
- Веб-документы MDN: toString
- Руководство по стилю JavaScript для Airbnb
- 2ality: преобразование значения в строку в JavaScript
- Преобразовать число в строку
- Переполнение стека: преобразование в строку
- Подробнее об операторе сложения
- YDKJS: Принуждение
Делиться
- Нравится в Твиттере
- Нравится в Instagram
- Первоначально опубликовано на www.samanthaming.com
Спасибо за чтение ❤
Сказать привет! Instagram | Facebook | Твиттер | SamanthaMing.com | Блог