Какая грустная история
Это реальная история, которая произошла со мной. В онлайн-проекте была серьезная ошибка, которая делала основную страницу непригодной для использования из-за неправильного использования JSON.stringify. Это серьезно повлияло на удобство работы пользователей, и я чуть не лишился годового бонуса.
В этой статье я поделюсь с вами историей, а затем мы также поговорим об особенностях JSON.stringify.
История
Ушел коллега, и я взял на себя часть его работы. Неожиданно вскоре после моего прихода в проект появились онлайн-баги.
В это время в рабочей группе компании идет Острая дискуссия, и многие люди обсуждают этот вопрос:
- Менеджер продукта жалуется: пользователь больше не может отправить форму, что вызвало много жалоб клиентов, я надеюсь, что это будет решено как можно скорее.
- Инженер-испытатель задается вопросом:Тестовая среда и предрелизная среда этой сцены были протестированы, так как же она может не работать в сети.
- Технический инженер говорит о причине:Произошла ошибка, поскольку в интерфейсе отсутствовало поле значения.
Никто не знает, как решить проблему!
Никто не знает, как решить проблему!
Никто не знает, как решить проблему!
Когда я обнаружил, что коллеги жалуются на модуль, за который я отвечал, у меня разболелась голова😭.
После непродолжительного расследования я нашел причину бага.
Это так, есть форма, которая позволяет пользователям заполнять данные, а затем интерфейс должен анализировать данные и отправлять их на сервер.
Форма выглядит так (эти опции необязательны):
Обычно данные должны выглядеть так:
Затем он будет преобразован в это:
Однако все опции являются необязательными. Если пользователь не заполняет, данные выглядят так:
Затем он будет преобразован в это:
JSON.stringify игнорирует поля, значение которых не определено в процессе преобразования.
Когда эти данные отправляются на серверную часть, серверная часть не может их обработать, что приводит к ошибке.
Причина проблемы найдена, и решение тоже очень простое: преобразовать элемент, значение которого не определено, в пустую строку и отправить его.
Первоначально это была страница, которая некоторое время находилась в сети. Почему вдруг появилась эта проблема, а раньше ее не было? После тщательных расспросов выяснилось, что продакт-менеджер упомянул небольшую точку оптимизации посередине. Я чувствовал, что дело было относительно небольшим, поэтому я изменил код и вышел в интернет, что в итоге привело к ошибкам в проекте.
К счастью, поскольку скорость от обнаружения проблемы до решения проблемы выше, число затронутых пользователей невелико, а уровень ответственности еще не достиг уровня ответственности, мой бонус на конец года можно рассматривать как сохранено.
Понимание JSON.stringify
Эта ошибка вызвана тем, что я не знаком с JSON.stringify, поэтому далее мы проанализируем некоторые возможности этой встроенной функции.
По сути, JSON.stringify преобразует объект в строку JSON.
В то же время JSON.stringify имеет следующие правила.
1. undefined, Function и Symbol не являются допустимыми значениями JSON. Если такие значения встречаются при преобразовании, они либо опускаются (при обнаружении в объекте), либо заменяются на null (при обнаружении в массиве). JSON.stringify() может возвращать undefined при передаче "чистых" значений, таких как JSON.stringify(function() {}) или JSON.stringify(undefined).
2. Объекты Boolean, Number и String преобразуются в соответствующие примитивные значения во время преобразования в строку в соответствии с традиционной семантикой преобразования.
3. Все свойства с ключом Symbol будут полностью игнорироваться, даже при использовании функции replacer.
4. Числа Infinity и NaN, а также значение null считаются null.
5. Если у значения есть метод toJSON(), он отвечает за определение того, какие данные будут сериализованы.
6. Экземпляры Date реализуют функцию toJSON(), возвращая строку (такую же, как date.toISOString()). Таким образом, они рассматриваются как строки.
7. Выполнение этого метода для объекта, содержащего циклическую ссылку, вызовет ошибку.
8. Все остальные экземпляры Object (включая Map, Set, WeakMap и WeakSet) будут сериализованы только перечисляемыми свойствами.
9. Возникает ошибка при попытке преобразовать значение типа BigInt
Реализовать JSON.stringify самостоятельно
Лучший способ понять функцию — реализовать ее самостоятельно. Ниже я написал простую функцию, имитирующую JSON.stringify.
пройти тест
Окончательный
Из-за ошибки я заново изучил JSON.stringify и узнал, что в нем по-прежнему так много функций, которых я не замечал в обычное время.
Надеюсь, вы не совершите ту же ошибку в будущем.
Спасибо за прочтение.
Больше контента на plainenglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Получите эксклюзивный доступ к возможностям написания и советам в нашем сообществе Discord.
