Как понять и реализовать битовую карту?

Question

[Iurii I]

Я как-то увидел, что можно реализовать хранение состояний того или иного субъекта с помощью битовой карты. То были состояния кнопки. Каждое состояние закодировано определённой степенью двойки. После записи "стартовых" состояний с ними можно проводить операции с помощью побитовых операторов javascript.

Component.State = {
  DISABLED: 1,
  FOCUSED: 2,
  HOVERED: 4,
  ACTIVE: 8,
  HAS_ICON: 16
}

Допустим, состояние HOVERED и FOCUSED будет записано как Component.State[HOVERED | FOCUSED]

Можете рассказать, как это работает? Чтобы было понимание не только на конкретном примере, а чтобы я мог сам писать и обрабатывать такие состояния побитовыми операциями. Мне это показалось очень интересным и довольно-таки применимым, так как код становится логичнее и удобочитаемее. Где-то глубоко в голове я понимаю, что тут что-то происходит с двоичным представлением числа, но это лишь догадки, да и с двоичными числами я знаком только по школьной программе...

Источники для ознакомления приветсвуются. Только не слишком сложные, потому что "академического" образования я не имею и мне, возможно, будет тяжело читать совсем научную литературу.

Comments

[Денис Загаевский]

Битовые карты это другое.

[Iurii I]

Денис Загаевский, расскажешь?

Answer 1

[hzzzzl]

так будет нагляднее

states = {
  DISABLED: 0b001,   // так можно писать двоичные числа
  FOCUSED: 0b010,
  HOVERED: 0b100,
}

(states.DISABLED | states.HOVERED).toString(2)  // .toString(2) - переводит в двоичную
// "101"   // поставлены 1 и 3 биты

Answer 2

[Wataru]

| - это побитовое ИЛИ. & - побитовое И. Т.е. каждый разряд отдельно обрабатывается и, в случае ИЛИ, если хоть одно число имеет единицу в данном разряде, то и результат будет 1. Соответственно, 00001 | 00010 = 00011.

Степени двойки - это числа, где единица стоит только в одном бите. Если несколько таких чисел про-ИЛИ-ть - то получится число, где стоят единицы во всех нужных разрядах. Фактически, вы назначаете каждому состоянию свой разряд. Потом, где в числе стоят единицы - те состояния и есть.

Чтобы проверить, что бит в числе установлен, надо взять побитовое И и убедиться, что результат не 0 (он может быть либо 0 либо какой-то степенью двойки.

Answer 3

[Developer]

Это не битовые карты, а битовые операции, маскирование.

Component.State = {
DISABLED: 1,
FOCUSED: 2,
HOVERED: 4,
ACTIVE: 8,
HAS_ICON: 16
}

Переводим всё в двоичные числа:
DISABLED: 00000001,
FOCUSED: 00000010,
HOVERED: 00000100,
ACTIVE: 00001000,
HAS_ICON: 00010000
Видишь как бит с единицей смещается?
Теперь применяем битовую операцию ИЛИ к выбранным значениям:
HOVERED | FOCUSED =
00000100 (4)
+
00000010 (2)
=
00000110 (6)
Мы смешали два значения и получили новое, в котором храним новое состояние.
Теперь, чтобы проверить, что в состоянии x=6 = 00000110 есть какое-то значение, нам надо проверить его битовой операцией И и сравнить с нулём:
Есть ли в x FOCUSED?
if (x & FOCUSED > 0) => есть, иначе нет: 00000110 & 00000100 = 00000100 > 0 => значение ЕСТЬ!

Есть ли в x DISABLED?
if (x & DISABLED > 0) => есть, иначе нет: 00000110 & 00000001 = 00000000 = 0 => значения НЕТ!

Comments

[Developer]

Bavashi, согласен. Опечатка. Но это мелочи.
Я хотел передать суть

[Iurii I]

Немного не понял условные конструкции в конце твоего ответа.

Спасибо за объяснение концепта со сдвигом единицы. Но, тогда мой вопрос по битовой карте некорректный. И как я предполагал изначально (да и по самому куску кода видно) - мы не включаем/выключаем определённый бит у числа, а используем разные числа и ссылаемся на состояние касательно того самого числа, которое у нас идёт в память (а в памяти их много, также, как состояний). Тогда, тут особо нет смысла использовать побитовые операции... Мне так кажется, во всяком случае. Ведь, почему бы просто не хранить состояния в любом пришедшем в голову числе, объекте или картинке, и определять смешивание состояний другими числами, объектами или картинками... Концепт останется одинаковым.

[Developer]

AngryBot, битовые операции очень удобны.
В 64-битном int64 можно сохранить 64 булевых значений.
Согласись, удобно же сохранить 64 значения в одной переменной вместо 64 булевых

[Iurii I]

Developer, а как это можно сделать? В конкретном примере вопроса у нас в памяти разные числа лежат и под них есть состояния.

И, побитовые операторы работют с 32-битными целыми числами в js.

Хочешь сказать, что можно управлять состоянием из одного двоичного числа? Как тогда это описать кодом?

[Developer]

Хочешь сказать, что можно управлять состоянием из одного двоичного числа?

AngryBot, я же в ответе подробно и вполне понятно описал как. Что именно непонятно?

[Iurii I]

Developer, так там же разные числа... Я чего-то не понимаю?

0b1
0b10
0b100
0b1000

Это же всё разные числа, к которым мы приклеили значения нужные нам. Мы храним булевые значения в разных числах, которые отражают разное состояние. Не?

[Developer]

AngryBot, как же с тобой тяжело. Я сдаюсь. Мне лень бесплатно объяснять более подробно.
Я всё очень подробно разжевал для самых нулевых джунов. Что там непонятно?

0b1
0b10
0b100
0b1000

Откуда ты это взял? я такого не писал

[Iurii I]

Developer, я это взял ровно из того кода, из которого возник мой вопрос.

Когда в javascript имеется объект с полями, то каждое поле данного объекта - скорее всего отдельная "сущность" в памяти, не так?

Если мы делаем это:
var obj = { x = 2, y = 4 }
То 'x' и 'y' - разные существа с каким-то определённым весом в битах.

Вот реальное подтверждение моей простой теории об этом:

Первое объявление:
let variable = { a: 1, b: 2, c: 3 }


Второе объявление:

let variable = { a: 2, b: 4, c: 6, d: 8, e: 12, f: 16 }

На выделенной строке в скриншоте - наш объект, хранящийся в памяти. Как видишь, их размер разный. 284 байт против 500 байт.

Ответ: Взял я это из кода.

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

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

Я благодарен в целом, что ты ответил и помог мне понять один концепт и работу маскирования, но полноценного ответа ты так и не дал. С твоей стороны полноценным ответом могло быть направление меня на источник (почитать) или развёрнутый, с минимумом профессионального сленга ответ (также с понятным повествованием и хорошими абстракциями, отдельных среде программистов).

[Iurii I]

Bavashi, в теории я всё понял, спасибо.

Меня немного смутила фраза "1 байт - восемь состояний". Я подумал, что можно технически в один байт зарезервировать восемь разных состояний, т.е. запомнить одно число в память, делать сдвиги, коньюкции и понимать какой оттенок у нашего числа (байта). Видимо, я просто запутался в формулировках.

А так, я прекрасно понял, что можно под каждый разряд выделить своё состояние, которое технически является одним битом. Но в этот же момент этот разряд хранится в байте, который хранится ещё где-то (в нашем случае - в объекте).

Answer 4

[Karpion]

Запись "HOVERED | FOCUSED" читается "HOVERED или FOCUSED". Однако, по-русски это должно говориться "HOVERED и FOCUSED" (аналог: крокодил - длинный и зелёный").
Ещё это выражение можно записать "HOVERED + FOCUSED" - будет то же самое, и к тому же понятнее. Но эта форма записи плоха тем, что для двух одинаковых признаков "HOVERED | HOVERED == HOVERED", а вот при сложении будет не так.

Допустим, переменная x содержит в себе статус кнопки. Работать с этой переменной надо так:

• Кнопка попала в фокус: x|=FOCUSED
  
• Кнопка вышла из фокуса: x&=~FOCUSED
  
• Проверка, в фокусе ли кнопка: x&FOCUSED?в_фокусе:не_в_фокусе
  

Это можно использовать бездумно, не зная о двоичном представлении чисел.

Comments

[Wataru]

x^=~FOCUSED разве не xor будет? Это переключит все биты, кроме нужного. Надо же x&=~FOCUSED использовать.

[Karpion]

wataru, Спс, поправил мой ответ.

Answer 5

[webdisigner]

это как распределение прав в админке
Например:
когда админ имеет права на:
чтение|запись|редактирование|создание|удаление
1|1|1|1|1
Переводим 11111 -> 31 (права супер юзера)

например обычный пользователь имеет права на только "чтение" то это будет выглядеть так:
1|0|0|0|0, где первая цифра и есть чтение (only read)
Переводим 10000 -> 16 (права обычного юзера)

И так далее по сумме определяешь кто есть кто