Как элегантно определить, что значение атрибута пустое

JavaScript

Вы наверняка сталкивались с подобными ошибками.

Это потому, что мы пытаемсяundefinedилиnullизвлечь данные.

Решить эту задачу на самом деле очень просто, если у нас есть следующие объекты:

const a = {
  b: {
    c: 1
  }
}

Допустим, нам теперь нужно вынутьa.b.c, но непонятно, все ли они существуют, то код будет написан так:

if (a && a.b) {
  const c = a.b.c
}

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

Должно быть решение, которое заключается в использовании опциональной цепочки нового синтаксиса.

Этот синтаксис еще официально не выпущен, но мы можем использовать его, установив плагин Babel.

npm install --save-dev @babel/plugin-proposal-optional-chaining

После завершения установки измените файл конфигурации Babel.

{
   "plugins": ["@babel/plugin-syntax-optional-chaining"]
}

Затем мы можем использовать необязательную цепочку, чтобы преобразовать приведенный выше код в этот:

const c = a?.b?.c

Babel скомпилирует такой код:

const c = a === null || a === null ? undefined : a.b === null || a.b === undefined ? undefined : a.b.c

Хотя скомпилированный код выглядит немного затянутым, написать null действительно очень элегантно и просто.

Однако в некоторых сценариях необязательная цепочка по-прежнему имеет ямки, например:

const a = {
  b: {
    c: false
  }
}

Предположим, мы хотим взять значениеa.b.cсередина, чтобы датьcустановить значение по умолчаниюtrue

// true
const c = a?.b?.c || true

Но в этом сценарии будет ошибка, ожидаемое значение равноfalse, полученный ответtrue.

Решить эту проблему также очень просто, а затем ввести новый синтаксис двойной вопросительный знак. Эффект этого синтаксиса и||аналогично, но только когда значение равноnullилиundefinedБудет использоваться значение по умолчанию.

// false
const c = a?.b?.c ?? true

Те же двойные вопросительные знаки, а также официально не выпущенные, но также могут решить проблему с помощью конкретной установки плагина Babel, здесь не слишком много подробностей.

Вышесказанное является содержанием этой статьи.Кроме того, я чувствую, что код JS будет занят различными вопросительными знаками в будущем.

Наконец

Хоть тема и выглядит простой, но содержание расследования все же многогранно.Конечно, больше всего я хочу рассказать о fuckJS.

Если вы считаете, что контент полезен, вы можете обратить внимание на мой официальный аккаунт «Внешняя часть действительно забавная» и регулярно делиться следующими темами:

  • Внешнее мало знаний, холодное знание
  • Основное содержание
  • Повысить эффективность работы
  • персональный рост