JavaScript: значение фигурной скобки между именем переменной

1

Я очень слаб с javascript из-за его слабого синтаксиса, но очень наказываю значение специальных символов.

В учебнике по react-native-navigation есть этот фрагмент

static navigationOptions = ({ navigation }) => {
   const {state, setParams} = navigation;
   const isInfo = state.params.mode === 'info';
   const {user} = state.params;
   return {
     title: isInfo ? '${user} Contact Info' : 'Chat with 
 ${state.params.user}',
     headerRight: (
       <Button
         title={isInfo ? 'Done' : '${user} info'}
         onPress={() => setParams({ mode: isInfo ? 'none' : 'info'})}
       />
     ),
   };
 };

Первоначально я ошибочно const {isInfo} = state.params.mode === 'info'; третью строку следующим образом: const {isInfo} = state.params.mode === 'info';

и мой код не работает.

В чем разница: const isInfo = state.params.mode === 'info';

поскольку следующая строка содержит фигурные скобки {user}

это очень сбивает с толку для меня, но эти незначительные вещи, как известно, трудно для Google, так что извините и заблаговременно!

Теги:
react-native
react-navigation

3 ответа

8
Лучший ответ

По сути фигурные скобки, как вы упомянули, являются объектами в javascript.

Так что сделать что-то подобное в javascript

const user = {
    name: 'bob',
    age: 23,
};

user.name пользовательский объект, который вы можете использовать так: user.name которое вернет bob.

С ES6 вы можете создавать объекты из других объектов.

const {user} = state.params;
//user will be state.params.user

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

Там есть и другие интересные вещи, которые вы можете сделать с помощью этой техники. Вы можете "объединить" массивы и объекты в новые константы, которые довольно круты.

const test = {
    ...user,
    anotherProperty: 'value',
};

С реагированием и сокращением (если вы его используете) вы увидите много этого: Object.assign({}, state, {}); который используется для создания нового объекта с предыдущими свойствами состояния, перезаписанного новым состоянием (потому что для сокращения требуется новый объект). Это {...state,...newState} использование {...state,...newState}.

Пожалуйста, кто-нибудь напомнит мне, что это ...Object Метод ...Object называется?

Эта строка const isInfo = state.params.mode === 'info'; является сокращением для объявления bool. isInfo будет либо true, либо false в зависимости от того, state.params.mode === 'info' ли state.params.mode === 'info'.

Чтобы перевести вышеуказанное в C++ для вас

if (state.params.mode === 'info') {
    bool isInfo = true;
else {
    bool isInfo = false;
}

Я не могу вспомнить, есть ли аналогичный массив объектов в C++, так как в JavaScript бит рассматривает объекты в JavaScript как массивы с определенными ключами. Таким образом, вышеупомянутое {...state,...newState} похоже на "переопределение" ключей. Так

int y = [1,2,3];
int x = [3,2,1];


for (i=0;i<=2;i++) {
    y[i] = x[i];
}

Что-то вроде этого я думаю?

  • 0
    Понятно! Это очень четкое объяснение! Большое спасибо!
  • 1
    @Zennichimaro Я не очень хорош в названии вещей, как вы можете сказать, ^^^ был брошен в эту среду ES6, так что я знаю, что вы чувствуете! (У)
Показать ещё 6 комментариев
4

В ES6 вы можете деконструировать объекты в разные переменные. Вы можете узнать больше об этом здесь

Синтаксис назначения деструктуризации - это выражение JavaScript, которое позволяет распаковывать значения из массивов или свойств из объектов в отдельные переменные.

3

Это синтаксис ES6, выражение const {user} = state.params; равен const user = state.params.user; и const {isInfo} = state.params.mode === 'info'; приведет к {isInfo: undefined}. Для получения дополнительной информации вы можете ознакомиться здесь.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню