Вещи, которые я хотел бы использовать в React/JavaScript из Elixir

Во -первых, я хотел бы сказать, что это не список жалоб, а скорее список желаний. У меня нет проблем с JavaScript, и я думаю, что у каждого языка есть свои силы.

Сказав это, ниже приведены некоторые из вещей, которые я хотел бы использовать в JavaScript, который вдохновлен моим опытом использования Эликсир Анкет

Функция соответствия шаблона

Одна из вещей, которая делает меня таким же, как Эликсир, – это способность делать схемы, соответствующие повсюду. Это делает код так чище.

Например, представьте, что вам нужно показать 3 типа компонента в зависимости от данных. Обычно вы делаете что -то вроде этого:

const Item = (type) => 
{
 switch(type){
  case "A": 
  break;
  case "B": 
  break;
  case "C": 
  break;
 }
}

Хотя это нормально, но используя соответствие рисунков, вы можете написать это так:

const Item = ("A") => 
{
  return 
}
const Item = ("B") => 
{
  return 
}
const Item = ("C") => 
{
  return 
}

Да, в Elixir вы можете иметь функцию с одинаковым именем, но дифференцировать его с помощью сопоставления рисунков.

Для меня таким образом намного чище, особенно если вам нужно добавить больше логики в каждую из функций рендеринга.

Кроме того, если вы используете Redux, как я, вы также можете написать его намного чище без дополнительной библиотеки. Пример нормального Redux будет:

//reducer.js
function counterReducer(state, action) {
  switch (action.type) {
    case 'incremented':
      return { value: state.value + 1 }
    case 'decremented':
      return { value: state.value - 1 }
    default:
      return state
  }
}

С соответствием шаблона вы можете написать это так:

//reducer.js
function counterReducer(state, 'incremented') {
  return { value: state.value + 1 }
}

function counterReducer(state, 'decrement') {
  return { value: state.value - 1 }
}

function counterReducer(state, _) {
  return state
}

Если вам интересно, что такое _ , это синтаксис для явного игнорирования переменной, что заставляет ее вести себя как случай по умолчанию.

Оператор трубы

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

Например, представьте, что у вас есть данные, которые вам понадобятся, чтобы 1) получить сумму. 2) Преобразовать его в целое число. 3) Увеличьте его на 5. 4) Преобразовать его в строку.

Вы можете сделать что -то вроде этого:

const amount = add((parseInt(getAmount(object))), 5).toString(); 

Я признаю, что это экстремальный способ написания. Но с функцией трубы вы можете сделать что -то вроде этого:

const amount = 
  getAmount(object) 
  |> parseInt()
  |> add(5)
  |> toString()

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

Неизменная переменная

Я думаю, что это более самостоятельно. Если вы пишете свой код функциональным образом или используете библиотеку, которая в значительной степени полагается на ваши данные, чтобы быть неизбежными, как Redux, то, чтобы поддержать непредубегаемость для использования коробки делает его намного простым и простым.

Атом

В Эликсире атом определяется как Константа, значение которой является его собственным именем. .

Вместо того, чтобы писать:

// reducer.js
export const INCREMENTED = "INCREMENTED"
export const DECREMENTED = "DECREMENTED"

function counterReducer(state, action) {
  switch (action.type) {
    case INCREMENTED':
      return { value: state.value + 1 }
    case DECREMENTED':
      return { value: state.value - 1 }
    default:
      return state
  }
}

Вы можете написать это так:

//reducer.js
function counterReducer(state, :incremented) {
  return { value: state.value + 1 }
}

function counterReducer(state, :decrement) {
  return { value: state.value - 1 }
}

function counterReducer(state, _) {
  return state
}

Вот и все. Вам не нужно инициализировать значение, так как вы можете сделать это из имени самой переменной. Это делает это намного проще, когда вы пишете Redux. Вам больше не нужно объявлять действие типа 1 на 1.

Так что это некоторые из вещей, которые я хотел бы сделать в React или JavaScript в целом. Я знаю Вяз Существует, но для меня реагировать и реагировать нативные, слишком хороши библиотеки, чтобы прекратить ее использование.

Оригинал: “https://dev.to/tehaisperlis/things-i-wish-i-can-use-in-react-javascript-from-elixir-27aj”