Как объект JavaScript может содержать массив (в квадратных скобках) свойств (пар ключ-значение)?

#javascript #arrays #angularjs

#javascript #массивы #angularjs

Вопрос:

Я работаю с некоторым предыдущим кодом в AngularJS, но мой вопрос касается странного появления объектов, которые передаются в представление. Я получаю массив массивов. Однако вложенные массивы имеют пары ключ-значение. В моем понимании это не имеет смысла.

Кроме того, я считаю, что это вызывает проблемы с пользовательскими фильтрами, которые я пытаюсь создать. Фильтр общей модели работает, но фильтрация по определенному полю — нет. Я протестировал концепцию в jsfiddle, и она отлично работает, если данные отформатированы как массив объектов, обладающих свойствами, но при попытке воспроизвести структуру моих текущих ошибок вывода данных, поскольку это недопустимый JavaScript. Может кто-нибудь пролить свет на мое затруднительное положение?

 [Array[0], Array[0], Array[0]...]
0: Array[0]
  $$hashKey: "00U"
  firstGroupList: Object
  length: 0
  subTitle: "Capsules"
  title: "Esomeprazole Strontium"
  __proto__: Array[0]
1: Array[0]
  $$hashKey: "01X"
  firstGroupList: Object
  length: 0
  subTitle: "Tablets"
  title: "Salsalate"
  __proto__: Array[0]
2: Array[0]
3: Array[0]
4: Array[0]
...
  

Как может [title: "title", subTitle: "subTitle"] существовать подобный массив?

Комментарии:

1. Массивы — это объекты. Вы можете добавлять к ним свойства, такие как обычный объект, функция или любой другой объект. console.log(list[0].subTitle); // "Capsules" Это не типичное использование массивов, но это может быть удобно для хранения дополнительных данных.

2. Поскольку @cookiemonster говорит, что массивы являются объектами, поэтому в вашем случае они представляют собой пустые массивы со свойствами объектов.

3. Что касается вашего другого кода, если есть проблема, вам нужно опубликовать вопрос, который включает минимальный пример. Но это не недопустимый JavaScript.

4. Тогда это эквивалентно [{title: «заголовок», subTitle: «субТитры»}]? Консоль выводит его по-разному, поэтому я пытаюсь понять механику происходящего.

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

Ответ №1:

Рассмотрим следующее:

 var arr = [1,2,3,4];
var obj = {key: 50, anotherKey: 70};

arr.prop = 'something-something';
obj.prop = 'something-something';

console.log(arr['prop']);
console.log(obj['prop']);
  

Он дважды выведет «что-то-что-то», и внутри происходят очень похожие вещи — вы устанавливаете свойство объекта, а затем читаете его.

Однако разница заключается в фактическом типе объекта — arr имеет тип Array, а obj имеет тип Object . Пожалуйста, обратите внимание, что это не тот тип переменной, о котором мы говорим — и arr, и obj имеют тип «object» (который вы можете легко проверить с помощью typeof). Тип объекта фактически ссылается на прототип объекта, то есть на объект, на котором основана эта конкретная переменная (для тех, кто более знаком с ООП, это будет похоже на класс, от которого вы унаследовали, за исключением того, что в этом случае это был только один экземпляр, унаследованный от класса, а не целый новый класс).

Вот статья, которая может помочь вам лучше понять прототипы: http://sporto.github.io/blog/2013/02/22/a-plain-english-guide-to-javascript-prototypes /

Возвращаясь к исходному коду, когда бы вы действительно заметили разницу между arr и obj? Ну, одна вещь, которая особенно приходит на ум, — это JSON:

 var strArr = JSON.stringify(arr); // [1,2,3,4]
var strObj = JSON.stringify(obj); // {"key":50,"anotherKey":70,"prop":"something-something"}
  

Таким образом, JSON «потеряет» свойство prop, если вы используете его в массиве — это один из примеров того, почему вы должны быть осторожны при настройке свойств массива.

Наконец, как бы вы повторили этот массив, если хотите учитывать свойство «prop», а также «обычные» элементы массива? Для этого вы могли бы использовать for..in:

 for (key in arr) console.log(arr[key]);
/* displays:
1
2
3
4
something-something
*/