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

Зачем нужны объекты

Представьте, что вы преподаете вводный курс JavaScript, у вас десять студентов в курсе, и вы хотите отслеживать все их оценки, чтобы вы могли вычислить средний балл каждого студента и средний балл по классу. Если все, с чем вам нужно работать, это переменные, вам понадобится переменная для тестов каждого учащегося, а это означает, что класс из десяти учащихся с тремя тестами потребует 30 переменных.

Вы можете немного упростить это, поместив результаты тестов в список, но как насчет другой информации, которую вам нужно отслеживать, например, имен, идентификационных номеров, специальностей и т. Д.?

Решение состоит в том, чтобы создать составной тип данных, который может хранить более одного типа данных. Здесь на помощь приходят объекты JavaScript. С помощью объекта вы можете хранить в одном объекте имя учащегося, его идентификационный номер, список его оценок и любые другие данные. Это позволит упорядочить данные и упростит чтение, отладку и повышение эффективности программ, которые обращаются к этим данным.

Как создавать объекты JavaScript

Прежде чем я покажу вам, как создавать объекты, позвольте мне определить несколько терминов. Объект - это часть данных, которая определяет набор свойств и их значений. Свойства объекта могут относиться к любому типу данных JavaScript, и большинство объектов содержат свойства нескольких типов данных.

Объект объявляется с использованием этого шаблона синтаксиса:

var | let object-name = {список свойств};

Синтаксис указывает, что вы можете использовать ключевое слово var или let для объявления нового объекта.

Затем мне нужно определить список свойств. Вот шаблон синтаксиса для списка свойств:

{
имя-свойства: значение,
имя-свойства: значение,

имя-свойства: значение
}

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

Вот пример студенческого объекта с тремя свойствами:

let student1 = {
  "name": "Paul McCartney",
  id: 123456,
  grades: [81, 83, 77, 92]
};

Вы также можете определить функцию, которая создает объекты:

function createStudent(name, id, grades) {
  return {
    name: name,
    id: id,
    grades: grades
  }
}

Вы можете вызвать эту функцию так:

let student2 =
  createStudent("John Lennon", "234567", [81, 93, 74]);

Вы также можете создавать объекты, вызывая функцию. Вот пример функции для создания студенческого объекта, подобного тем, которые я демонстрировал, а также пример его использования:

js> function createStudent(name, id, grades) {
      return {
        name: name,
        id: id,
        grades: grades
      };
    }
js> let stu3 = createStudent("Ringo Starr", 987654,
[91, 92, 94]);
js> stu3
({name:"Ringo Starr", id:987654, grades:[91, 92, 94]})

Вы можете сократить определение функции следующим образом:

function createStudent(name, id, grades) {
  return {
    name,
    id,
    grades
  };
}

Это не только сокращает определение функции, но и делает его более понятным. Часто используются имена параметров, которые соответствуют свойствам объекта, и человека, читающего определение вашей функции, может смутить, увидев такой код:

name: name,
id: id,
grades: grades

Это не только сокращает определение функции, но и делает его более понятным. Часто используются имена параметров, которые соответствуют свойствам объекта, и человека, читающего определение вашей функции, может смутить, увидев такой код:

Как получить доступ к свойствам объекта

Есть два метода доступа к свойствам, хранящимся в объекте. Первый метод - использовать «нотацию массива» с помощью оператора []. Вот шаблон синтаксиса для этой техники:

имя-объекта [«имя-свойства»]

Вот короткая программа, демонстрирующая эту технику:

let student1 = {
  name : "Paul McCartney",
  id : "123456",
  grades : [81, 77 , 91, 85]
};
print("Student1's name: " + student1["name"]);
print("Student1's id: " + student1["id"]);
print("Student1's grades: " + student1["grades"]);

Вот результат этой программы:

Student1's name: Paul McCartney
Student1's id: 123456
Student1's grades: 81,77,91,85

Другой способ доступа к свойствам объекта - использование оператора точки. Вот шаблон синтаксиса для этой техники:

имя-объекта. имя-свойства

Вот программа выше, переписанная с помощью оператора точки, обеспечивающего доступ к значениям свойств:

let student1 = {
  name : "Paul McCartney",
  id : "123456",
  grades : [81, 77, 91, 85]
};
print("Student1's name: " + student1.name);
print("Student1's id: " + student1.id);
print("Student1's grades: " + student1.grades);

Цикл по свойствам объекта

Вы можете получить доступ к значениям свойств объекта, используя конкретную версию цикла JavaScript for, цикла for-in. Вот шаблон синтаксиса для этого типа цикла for-in:

for (объявление ключа в объекте) {
оператор (ы);
}

Давайте использовать этот цикл с объектом student1:

for (let property in student1) {
  print(property + ": " + student1[property]);
}

Результатом этого фрагмента кода является:

name: Paul McCartney
id: 123456
grades: 81,77,92,80

Когда вы обращаетесь к свойствам объекта таким образом, вы должны использовать нотацию массива для извлечения значения. Если вы попытаетесь использовать вместо этого оператор точки, вы получите undefined для каждого значения свойства.

Для этого объекта вы можете получить доступ к оценкам учащегося, используя обычную нотацию массива. Вот программа, которая вычисляет среднюю оценку учащегося:

js> let student1 = {
      name: "George Harrison",
      id: 234567,
      grades: [83, 75, 91, 98]
    };
js> let total = 0;
js> for (let i = 0; i < student1.grades.length; i++) {
      total += student1.grades[i];
    }
347
js> let average = total / student1.grades.length;
js> print(average)
86.75

Свойства объекта могут быть функциями

При необходимости вы можете определить свойство объекта как функцию. Например, если мы хотим, чтобы объект student сообщал о своей средней оценке, мы можем записать это свойство как функцию, чтобы он вычислял среднее значение из текущего списка оценок в свойстве grades.

Вот объект student, переписанный такой функцией, и короткая тестовая программа:

function createStudent(name, id, grades) {
  return {
    name,
    id,
    grades,
    gradeAverage: function() {
      let total = 0;
      for (const grade of grades) {
        total += grade;
      }
      return total / grades.length;
    }
  };
}
let stu4 = createStudent("George Harrison", 456123, [88, 87, 90]);
print(stu4.name + " " + stu4.id + " " + stu4.grades);
print(stu4.gradeAverage());

Результат этой программы:

George Harrison 456123 88,87,90
88.33333333333333

Есть больше

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

Спасибо за чтение, напишите мне на [email protected] с комментариями и предложениями. Если вас интересуют мои онлайн-курсы по программированию, посетите мой сайт курса - https://learningcpp.teachable.com.