Как обратиться к ключам и значениям объекта через переменную?

0xD34F, Прошу прощения. Видимо где-то допустил ошибку, потому что categories[checkedCategory] возвращал числовые индексы. А после я обращался неправильно, не к самому объекту, а через переменную, то есть

var allCategories = Object.keys(categories);
var category = allCategories[checkedCategory];

Больше спасибо. Как отметить ваш комментарий, как ответ ?

Как обратиться к ключам и значениям объекта через переменную?

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

Как обратиться к ключам и значениям объекта через переменную?

0xD34F, https://jsfiddle.net/ouodkeLn/79/

Здесь именно сам способ получения данных из объекта. Не стану никого утруждать всем кодом. Просто кликнули по кнопке (сгенерированной и добавленной на страницу с категориями из объекта) и в глобальную переменную поместили $(this).text();

И вот этот $(this).text() нужно подставить к объекту, чтобы получить соответствующие данные объекта

Как обратиться к ключам и значениям объекта через переменную?

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

Как избавиться от мерцании при анимации?

Socrates, а у вас мерцания по прежнему присутствуют? Может дело в вашем браузере?
Может эти мерцания создаёт какой-то другой эффект, который не обрабаьтывается transition? Попробуйте отдельно протестировать только эффект blur, без всего остального. Возможно, так получится вычислить то, что создаёт мерцание

Почему вот так работает, а вот так не работает?

0xD34F Благодарю

Как правильно создать многомерный массив/объект?

Антон Спирин, Всё, остановлюсь на этом :

var categories = {
  fruits : [
    { Apple: 'http://.png' },
    { Banana : 'https://.png' }
  ],
  animals : [
    { Apple: 'http://.png' },
    { Banana : 'https://.png' }
  ]
};

var category = Object.keys(categories);
var categoryKey = Object.keys(categories.fruits);

console.log(category.length);
console.log(categoryKey.length);

Ещё раз спасибо )

Как правильно создать многомерный массив/объект?

iqhater, Спасибо, буду разбирать. Массив объектов - отличная мысль )

Как правильно создать многомерный массив/объект?

Антон Спирин, хорошо, спасибо, я понял. Не стоит гнаться за минимализмом )

Как правильно создать многомерный массив/объект?

Даниил Лебединский, да мне всего лишь нужно, чтобы был ключ (имя, например, банан) и ссылка на его изображение.
Мне подсказали object.keys()- вроде то, что нужно. Но как я понял, универсального способа нет. Либо массив, либо объект. Хотелось максимум компактности, простоты и читабельности. Впрочем, спасибо за совет

Как правильно создать многомерный массив/объект?

Я правильно понимаю, что если использовать вот такой синтаксис :

var data = {
  fruits : {
    Apple: 'http://.png',
    Banana : 'https://.png'
  },
  animals : {
    Apple: 'http://.png',
    Banana : 'https://.png'
  }

то чтобы узнать кол-во элементов, то мне нужно :

var groups = Object.keys(data);
var groups2 = Object.keys(data.fruits);
console.log(groups2.length);

Всё, большое спасибо за магическое Object.keys() ))

Как правильно создать многомерный массив/объект?

А тут никак нельзя что-то типа :

fruits : [
    { Apple: 'http://.png' },
    { Banana : 'https://.png' }
  ],

Только без скобок ? Чтобы было что-то ещё компактней ?

Попробовал.. Ну да, всё равно возвращаемся к такому варианту..

ruits : {
    Apple: 'http://.png',
    Banana : 'https://.png'
  },
  animals : {
    Apple: 'http://.png',
    Banana : 'https://.png'
  }

Мне то всего нужно - название ключа и ссылка, чтобы с ними работать. Поэтому не хотелось заводить два линшних ключа, как в первом варианте :
src : 'httр...'
data: Apple
А чтобы было сразу Apple : 'httр...'

Как правильно создать многомерный массив/объект?

То, что нужно. Спасибо

Как правильно создать многомерный массив/объект?

Тут такое дело, что я хочу выводить доступные категории, то есть фрукты, овощи, что-то еще, в зависимости от их наличия. Допустим я добавил ещё одну категорию и скрипт сам вывел эту новую категорию. И
массивов будет много, а два - лишь ддя читательности кода в вопросе. И если это будет 20 отдельных массивов, то как быть? Мне как-то нужно их обьединить.

Какой движок посоветуете для такой игры?

Это вы зря, парни.. Я уже всё запетентовал ))
Увидимся в суде

Как передать контект this?

Дмитрий, спасибо, попробую.
Нет, блокировать при клике на img клике по другим img - нарушает суть обучения. То есть ребёнок может кликнуть сначала на одну картинку, а потом на другую.
Я только не совсем понял один момент : при клике на картинку я поместил в перменную ссылку на эту картинку, правильно? При клике на другую картинку, в переменной уже лежит ссылка на другую картинку?
И скажите, пожалуйста, если не трудно, как правильно обнулить эти переменные, если условие вернуло false - присваивать им null или undefined?
Я изменил объявление переменной и теперь это не объект : var checked = {}, а просто переменная
var checked;
Вот эти тонкости не совсем ясны. Но, впрочем, это не столь важно. Спасибо за помощь

Как передать контект this?

Дмитрий, Всё, получилось. Спасибо

if (checkedImg != undefined && checkedWord != undefined) {
    if (checkedImg.attr('data') == checkedWord.text()) {
      checkedImg.add(checkedWord).hide();
    }
  }

Как передать контект this?

Дмитрий, в общем это такая детская игра для изучения англ языка. Есть какое-то количество англ слов и такое же количество картинок, например, фрукты. 10 картинок фруктов и 10 слов и они парны и соответствуют друг другу. И всё это добавляется динамически из js через append. Вот такая структура. Я не знаю, как изменить структуру DOM. Ведь могут быть другие элементы, например, не фрукты, а овощи из другого массива. Кликнул по картинке с лимоном и по слову "лимон" - они сравнились и спрятались. Если неправильно, то всё обнулилось. По вашим словам я понял, что this добавлял правильно и контекст не теряется, значит надо подумать, как правильно сравнивать элементы.

Как передать контект this?

Дмитрий, Подойдёт ли такое условие ? :
ЕСЛИ переменнаяКартинка - не пустая && перменнаяПараграф - не пустая, то
можно сравнить эти элементы

Как передать контект this?

Дмитрий, Вы всё верно подметили. Поэтому при клике на картинку, возникает ошибка связанная с параграфом - его ещё нет и ничего сравнивать. И наоборот. Спасибо