Теория
Объекты Javascript — это мощные структуры данных, которые позволяют организовывать связанные данные в одно целое. Объекты — это отличный способ структурировать и манипулировать данными. В повседневной жизни мы можем встречать объекты по-разному.
- Электронная коммерция – В интернет-магазинах используются название, цена, наличие на складе, описание, категория и т. д.
- Бронирование отелей – Отели используют объекты для представления бронирований
- Автомобили – Каждый автомобиль может быть объектом, таким как марка, модель, цвет, объем двигателя, регистрационный номер и т. д.
- Учащиеся – Каждый учащийся может быть объектом, таким как имя, возраст, класс, оценки и т. д.
В программах Javascript при необходимости можно создавать собственные настраиваемые объекты. Некоторые встроенные объекты, например:
- Math — объект содержит математические функции и константы.
- Date — объект позволяет работать с датами и временем.
- Array — объект является встроенным объектом, который используется для создания и манипулирования массивами.
- String — объект содержит методы, которые позволяют работать со словами.
- Object — объект является базовым объектом JavaScript, который используется в качестве основы для всех объектов.
Создание объекта
Синтаксис объекта состоит из пар ключ-значение, где ключ может быть любого типа данных. В этом примере создан объект с именем «auto»:
let auto = {
mark: "Tesla",
mudel: "Model Y",
aasta: 2025,
varv: "valge",
lisavarustus: ["autopiloot", "elektrimootor", "360 kraadi kaamerad"]
};
Для выдачи необходимо следующее сообщение:
Доступ к свойствам каждого объекта можно получить с помощью точечной синтаксиса. Например:
console.log(auto.mark); // Output: "Tesla"
Методы объекта и использование this
Объекты в Javascript могут содержать не только свойства, но и методы. Методы — это функции объекта, которые могут манипулировать свойствами объекта. this используется внутри методов, чтобы указать объект, в котором вызван метод. Создадим для объекта «auto» метод, который отображает полное имя автомобиля.
let auto = {
//omadused
mark: "Tesla",
mudel: "Model Y",
aasta: 2025,
varv: "valge",
lisavarustus: ["autopiloot", "elektrimootor", "360 kraadi kaamerad"],
//meetodid
taisnimi: function() {
return this.mark + " " + this.mudel;
}
};
console.log(auto.taisnimi());
Затем отображается функция taisnimi:
Сокращение метода
Новый Javascript ES6 теперь позволяет записывать метод более кратко.
//meetodid
taisnimi() {
return this.mark + " " + this.mudel;
}
Если свойства находятся в массиве, используйте цикл for или forEach.
let auto = {
//omadused
mark: "Tesla",
mudel: "Model Y",
aasta: 2025,
varv: "valge",
lisavarustus: ["autopiloot", "elektrimootor", "360 kraadi kaamerad"],
//meetodid
taisnimi() {
return this.mark + " " + this.mudel;
},
kuvaOmadused() {
this.lisavarustus.forEach(omadus => console.log(omadus));
}
};
auto.kuvaOmadused();
Показаны все характеристики:
Массивы объектов
Массив объектов в JavaScript — это структура данных, состоящая из нескольких объектов, упорядоченных по индексу. Каждый объект представляет собой ключ, где ключ является уникальным, а значением являются данные пары ключ-значение. Массив объектов может содержать различные типы данных.
Создание и отображение массива объектов
Создание массива объектов относительно просто. Начнем с записи данных об автомобилях. Каждый автомобиль представлен объектом, содержащим информацию о марке, модели и годе выпуска автомобиля.
let autod = [
{ mark: 'Tesla', mudel: 'Model Y', aasta: 2025 },
{ mark: 'Audi', mudel: 'Caret', aasta: 2023 },
{ mark: 'BMW', mudel: 'I9', aasta: 2022 }
];
console.log(autod);
Если вы хотите увидеть данные о конкретном автомобиле, мы можем указать позицию индекса в массиве:
console.log(autod[0]);
И в этом объекте я получаю элементы с помощью «точечного синтаксиса», как описано выше.
console.log(autod[0].mark);
Чтобы увидеть все модели, мы снова используем цикл forEach.
let autod = [
{ mark: 'Tesla', mudel: 'Model Y', aasta: 2025 },
{ mark: 'Audi', mudel: 'Caret', aasta: 2023 },
{ mark: 'BMW', mudel: 'I9', aasta: 2022 }
];
autod.forEach((auto) => {
console.log(`
Mark: ${auto.mark},
Mudel: ${auto.mudel},
Aasta: ${auto.aasta}
`);
});
Методы массива объекта
Методы массивов JavaScript можно использовать как для обычных массивов, так и для массивов объектов. Например, push(), pop(), shift(), unshift(), splice(), slice(), forEach(), map(), filter(), reduce(), sort(), и т. д. Все они доступны независимо от того, содержит ли массив простые типы данных.
Тип данных, содержащихся в массиве, не влияет на методы массивов. Например, добавление новых объектов в массив объектов с помощью push и unshift.
let autod = [
{ mark: 'Tesla', mudel: 'Model Y', aasta: 2025 },
{ mark: 'Audi', mudel: 'Caret', aasta: 2023 },
{ mark: 'BMW', mudel: 'I9', aasta: 2022 }
];
//Lisab uue objekti massiivi lõppu
autod.push({ mark: 'BMW', mudel: '350i', aasta: 2018 });
autod.unshift({ mark: 'Ford', mudel: 'Focus 2', aasta: 2025 });
Метод splice одновременно удаляет и добавляет.
massiiv.splice(
{start indeks},
{mitu eemaldada},
{mida lisada}
);
//Eemaldab esimese objekti
autod.splice(0,1);
//Lisab objekti alates teisest indeksist, ei kustutata midagi
autod.splice(1,0,{ mark: 'Audi', mudel: 'A5', aasta: 2020 });
Поиск по массиву
Для поиска в массиве объектов мы используем метод find, который для запуска требует функцию.
//Otsimine
let otsing = autod.find(auto=>auto.aasta > 2015);
console.log(otsing);
Данный метод находит первое совпадение и возвращает его. Если ответ не найден, то возвращается undefined. Для установки нескольких условий используйте && знаки
let otsing = autod.find(auto=>auto.aasta > 2018 && auto.mark === "Audi");
console.log(otsing);
Фильтрация массива
Поскольку find находит только один результат, для получения нескольких ответов используйте метод filter.
Например, у нас есть числа, и мы хотим получить из них парные числа
let arvud = [5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15];
const filtreeritud = arvud.filter(arv => arv % 2 === 0);
console.log(filtreeritud);
В случае с автомобилями мы можем обратиться, например, к auto.aasta и отфильтровать те, которые новее 2022 года.
//Filtreerimine
let filter = autod.filter(auto=>auto.aasta > 2022);
console.log(filter);
Сортировка массива
В качестве последнего метода рассмотрим сортировку sort. Простая сортировка массива объектов не работает правильно. Поэтому мы должны использовать функцию сравнения.
autod.sort((a, b) => a.aasta - b.aasta);
console.log(autod);
Здесь есть функция сравнения (a, b) => a - b, которая сообщает sort(), что числа следует сортировать по их фактическим числовым значениям, а не по строковым значениям. Функция a - b возвращает отрицательное значение, если a меньше b, положительное значение, если a больше, чем b, и 0, если a и b равны — именно то, что sort() нуждается для правильного упорядочения своих элементов.
Задание
Объект «raamat»
1. Создайте объект "raamat", который имеет как минимум три свойства: pealkiri, autor, aasta.
let raamat = {
pealkiri: 'Superaine arst',
autor: 'Aleksandr Kuprin',
aasta: 1898
};
2. Добавьте метод, который отображает описание первой книги.
console.log(raamat.pealkiri);
Ответ:
3. Добавьте метод, который изменяет год выпуска и выводит результаты в консоль.
"Superaine arst" измененен год на 2024
let raamat = {
pealkiri: 'Superaine arst',
autor: 'Aleksandr Kuprin',
aasta: 1898,
//meetodid
muudaaasta() {
raamat.aasta = 2024
return console.log(raamat.aasta);
}
};
Библиотека
1. Создайте объект "raamatukogu", свойством которого является "raamatud" (массив книг).
let raamatukogu = [
{ pealkiri: 'Superaine arst', autor: 'Aleksandr Kuprin', aasta: 1898},
{ pealkiri: 'Sipsik', autor: 'Eno Raud', aasta: 1962},
{ pealkiri: '451 kraadi farhengeit', autor: 'Ray Breadberry', aasta: 1963}
];
2. Добавьте метод, который красиво отображает все книги в консоли.
raamatukogu.forEach((raamatud) => {
console.log(`
Pealkiri: ${raamatud.pealkiri},
Autor: ${raamatud.autor},
Aasta: ${raamatud.aasta}
`);
});
3. Добавьте метод, который добавляет новую книгу.
raamatukogu.push({ pealkiri: 'Lugu', autor: 'Mina', aasta: 2025 });
4. Добавьте метод, который отображает общее количество книг в библиотеке.
console.log(raamatukogu.length)
5. Добавьте метод, который подсчитывает, сколько книг было издано после 2000 года.
let filter = raamatukogu.filter(raamatukogu=>raamatukogu.aasta > 2000);
console.log(filter.length);
6. Составьте свой метод и опишите, что он означает
Показать все книги, но в заголовке также указан автор!
raamatukogu.forEach((raamatud) => {
console.log(`
Pealkiri: ${raamatud.pealkiri + " - " + raamatud.autor},
Aasta: ${raamatud.aasta}
`);
});
This post is also available in et.
