yankoyski

Прямо в куки нельзя.

Чаще всего в куки записывают только идентификатор сессии, а все чувствительные данные на стороне сервера.
Недавно появилась неплохая альтернатива в виде JWT.

Внимательно читаем документацию.

До недавнего времени это было невозможно. Сейчас изучайте это https://reactjs.org/docs/hooks-intro.html

Because this.props and this.state may be updated asynchronously, you should not rely on their values for calculating the next state.

Документация

Вот так правильно:

this.setState(
  (state) => ({test: !state.test}),
  () => console.log(this.state.test)
);

На то, чтобы вкатиться в тему уйдет час-три. Знания полезные. Достаточно просто попробовать базовые вещи. Зазубривать API шаблонизатора, которым не факт, что будете когда-нибудь пользоваться, не стоит.

Даже хорошо. Если методы содержат некоторые одинаковые части, то их следует выделить в отдельный метод.

Все достаточно просто, хоть и не совсем очевидно.
Выражение:
foo.x = foo = {n: 2};
равносильно:
foo.x = (foo = {n: 2});

Мы присваиваем объекту по идентификатору foo свойство x, которое равно результату операции присваивания идентификатору foo ссылки на объект { n: 2 }.

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

let foo = {};

const bar = foo;

foo.x = (foo = {n: 2});

console.log(foo.x === undefined);  // true

console.log(bar);  // { x: { n:  2 } }

console.log(bar.x === foo);  // true

Ключевые отличия операций присваивания, которые важно понимать:
foo.x = - присваивание свойства конкретному объекту. На момент вызова в нашем примере это {}.
foo = - присваивание значения самому идентификатору foo. Это может быть примитив, ссылка на объект или функцию. В нашем случае это объект { n: 2 }.

рассмотрим на примере кипячения чайника со свистком - тебе нужно скипятить воды, ты налил чайник, и поставил его греться.
1) синхронно ты стоишь ждешь пока он скипит и не приступаешь к другим делам
2) асинхронно ты ушел в комнату гладить рубашку, погладил, вернулся на кухню и независимо от того скипел чайник или нет, ты его снял с плиты и налил воду
3) в режиме прерывания ты ушел в комнату гладить рубашку, чайник просвистел, ты прервался, пошел снять его с плиты

в js так же,
1) пока выполняется один синхронный метод движок не переходит к выполнению второго
2,3) движок запускает асинхронную функцию и не дожидаясь получения результата переходит к выполнению следующего метода, когда асинхронная функция закончит свое выполнение она уведомит движок и он по возможности прервется для получения и обработки результата

https://habr.com/company/ruvds/blog/419371/

Потому что функция d ничего не возвращает, чего вы ожидали ?

let group = {

    prop: false,

    d: function () {
        return (() => {
            this.prop = true;
            return this.prop;
        })();
    },
};

console.log(group.d()); // true
console.log(group);     // {prop: true, d: ƒ}

Ни в чем. Что в первом случае, что во втором Function Expression. Это как
var f1 = 10 * 2;
и
var f1 = (10 * 2);
в данном контексте одно и тоже.

Значит, на вход подается строка, где через точку перечислен путь к вложенному свойству, и объект:
f( "a.goal", x)

Можно сделать через рекурсию. На каждом «шаге» функция путь обрабатывает самый левый кусок цепочки. Для "a.goal" это будет "a". Нужно проверить, есть ли такое свойство у объекта. И если есть, то вернуть вызов этой же функции, но цепочка уже короче, остается только "goal" и объект не x, а x.a:

var x = {
  a: {
    goal: 1,
    b: 2,
  },
  c: 3
};


function f(value, chain) {
  if(chain.length === 0) return value;
  
  const propsArray = chain.split('.'); // "a.goal" => ["a", "goal"]
  const property = propsArray[0];
  
  if(!value.hasOwnProperty(property)) return; // несуществующее свойство

  return f(value[property], propsArray.slice(1).join('.')); // вызыв функцией самой себя
  // но цепочка свойств короче на 1 элемент – самый левый отрезали
}

console.log( "Result:", f(x, 'a.goal')); // 1