Как вывести массив с объектами в javascript


var array = [{name: 'John', age: 25}, {name: 'Anna', age: 30}, {name: 'Peter', age: 35}];
for (var i = 0; i < array.length; i++) {
console.log(array[i].name);
}


var array = [{name: 'John', age: 25}, {name: 'Anna', age: 30}, {name: 'Peter', age: 35}];
array.forEach(function(obj) {
console.log(obj.name);
});

Третий способ - использование метода map. Метод map позволяет применить определенную функцию к каждому элементу массива и создать новый массив на основе полученных значений. В нашем случае, мы можем использовать метод map для создания нового массива, содержащего только свойство "name" каждого объекта:

var array = [{name: 'John', age: 25}, {name: 'Anna', age: 30}, {name: 'Peter', age: 35}];
var newArray = array.map(function(obj) {
return obj.name;
});
console.log(newArray);


const array = [
{ name: "John", age: 25 },
{ name: "Jane", age: 30 },
{ name: "Bob", age: 35 }
];
for (let i = 0; i < array.length; i++) {
const obj = array[i];
console.log("Name: " + obj.name + ", Age: " + obj.age);
}


Name: John, Age: 25
Name: Jane, Age: 30
Name: Bob, Age: 35

Массив объектов: что это и как создать

Для создания массива объектов в JavaScript необходимо определить переменную и присвоить ей значение массива с объектами. Каждый объект представляется в виде фигурных скобок и содержит пары ключ-значение, разделенные запятой. Ключ это имя свойства объекта, а значение может быть любым допустимым значением в JavaScript (число, строка, другой объект и т.д.). Каждый объект в массиве разделяется запятыми.


let students = [
    {name: "John", age: 19},
    {name: "Kate", age: 20},
    {name: "Alice", age: 18}
];

В приведенном примере создается массив "студенты", состоящий из трех объектов. У каждого объекта есть свойства "name" и "age", которые хранят имя и возраст студента соответственно.

Таким образом, массив объектов в JavaScript позволяет хранить и обрабатывать данные, связанные с несколькими объектами, используя единственную переменную.

ИмяВозрастEmail
Алексей25[email protected]
Екатерина30[email protected]
Иван35[email protected]
var people = [
{
name: 'Алексей',
age: 25,
email: '[email protected]'
},
{
name: 'Екатерина',
age: 30,
email: '[email protected]'
},
{
name: 'Иван',
age: 35,
email: '[email protected]'
}
];
for (var i = 0; i < people.length; i++) {
// Получаем данные каждого человека
var person = people[i];
document.write('<tr><td>' + person.name + '</td><td>' + person.age + '</td><td>' + person.email + '</td></tr>');
}

В результате выполнения кода выше мы получим таблицу с данными о людях:

ИмяВозрастEmail
Алексей25[email protected]
Екатерина30[email protected]
Иван35[email protected]
for (let i = 0; i < array.length; i++) {
console.log(array[i].property);
}

2. Метод forEach: можно использовать метод forEach для перебора элементов массива и выполнения определенных действий с каждым элементом. В этом случае необходимо передать функцию в качестве аргумента метода forEach:

array.forEach(function(element) {
console.log(element.property);
});

3. Метод map: можно использовать метод map для создания нового массива, основанного на исходном массиве. В этом случае необходимо возвращать желаемое значение в функции коллбэка:

const newArray = array.map(function(element) {
return element.property;
});
console.log(newArray);

4. Метод join: можно использовать метод join для объединения элементов массива в строку с определенным разделителем. В этом случае можно совместить его с методом map:

const string = array.map(function(element) {
return element.property;
}).join(", ");
console.log(string);

Рассмотрим несколько примеров, как вывести массив с объектами на JavaScript:

  1. Используя цикл for:
    const array = [
    {name: 'John', age: 25},
    {name: 'Jane', age: 30},
    {name: 'Bob', age: 35}
    ];
    for(let i = 0; i < array.length; i++) {
    console.log('Name: ' + array[i].name + ', Age: ' + array[i].age);
    }
    • Name: John, Age: 25
    • Name: Jane, Age: 30
    • Name: Bob, Age: 35
  2. Используя функцию forEach:
    const array = [
    {name: 'John', age: 25},
    {name: 'Jane', age: 30},
    {name: 'Bob', age: 35}
    ];
    array.forEach(function(obj) {
    console.log('Name: ' + obj.name + ', Age: ' + obj.age);
    });
    • Name: John, Age: 25
    • Name: Jane, Age: 30
    • Name: Bob, Age: 35
  3. Используя метод map:
    const array = [
    {name: 'John', age: 25},
    {name: 'Jane', age: 30},
    {name: 'Bob', age: 35}
    ];
    const output = array.map(function(obj) {
    return 'Name: ' + obj.name + ', Age: ' + obj.age;
    });
    console.log(output);
    [
    'Name: John, Age: 25',
    'Name: Jane, Age: 30',
    'Name: Bob, Age: 35'
    ]

```javascript

let arr = [

{ name: "John", age: 25 },

{ name: "Jane", age: 30 },

{ name: "Bob", age: 35 }

];

let table = document.createElement("table");

// Создание заголовка таблицы

let thead = table.createTHead();

let row = thead.insertRow();

Object.keys(arr[0]).forEach(key => {

let th = document.createElement("th");

th.innerText = key;

row.appendChild(th);

});

// Создание строк таблицы с объектами

arr.forEach(obj => {

let tr = table.insertRow();

Object.values(obj).forEach(value => {

let td = tr.insertCell();

td.innerText = value;

});

});

document.body.appendChild(table);

```javascript

// Пример проверки наличия свойства объекта

let arr = [

{ name: "John", age: 25 },

{ name: "Jane" }

];

arr.forEach(obj => {

let name = obj.name

Добавить комментарий

Вам также может понравиться