Вот краткий обзор первой части…

Массив:

  1. набор множества отдельных элементов
  2. имеет возможность изменения размера и… сочетание разных «типов данных»
  3. может быть доступен по индексу, который начинается с 0
  4. имеет итерационные методы

Объект:

  1. это набор свойств (пар ключ-значение) и/или методов
  2. значение свойства может изменяться
  3. «можно получить доступ с помощью произвольных строк» ​​с двумя синтаксисами: нотация через точку и нотация скобок
  4. не повторяется
  5. может принимать функцию в качестве значения и вызывать метод парного свойства

В предыдущей части я обсуждал методы массива. В этом разделе я начну со структуры объекта.

const myObject = {
      property1 : value1,
      property2 : value2,
      property3 : value3,
      ...
}

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

Свойство имеет идентификатор, которым может быть любое ключевое слово, «строка» (буквы в кавычках) или число.

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

Как бы вы определили значение известного имени свойства? Доступны два варианта синтаксиса: точечная нотация и скобочная нотация.

const employeeList= {
  Mike: {
    age: 34,
    position: "Area Manager",
    "working store": "The Second" },
  Karen: {
    age: 29,
    position: "Store Manager",
    "working store": "The Second" },
  Crystal: {
    age: 19,
    position: "Cashier",
    "working store": "The Second" },
  10: "More Employees"       
}
//When the name doesn't have a space, I can use dot notation
employeeList.Mike.age
>>34

//I have to use bracket notation for a name with space or a dash
employeeList.Mike["working store"]
>>'The Second'

Вы заметили свойство «10»? Я могу получить его, используя обозначение скобок, но не точечное обозначение. В этом случае я хотел бы использовать запись через точку. Чтобы на число ссылались в точечной нотации, перед ним должен быть знак _ или $.

Кристал заслужил звание бариста. Я должен обновить его информацию. Давайте сделаем легкое редактирование.

employeeList.Crystal.position = "Barista"

Ну вот. Информация о Кристалле теперь верна.

employeeList
>>{
    Mike: {
      age: 34,
      position: "Area Manager",
      "working store": "The Second" },
    Karen: {
      age: 29,
      position: "Store Manager",
      "working store": "The Second" },
    Crystal: {
      age: 19,
      position: "Barista",
      "working store": "The Second" },
    10: "More Employees"       
  }

Как я уже говорил ранее, свойство также может принимать в качестве значения функцию, известную как метод. Рассмотрим человека «Эми». Ее пол женский, ей 24 года, у нее красивые светлые волосы. Что, если погода повлияет на ее настроение? Это так называемый «метод».

const amy = {
  gender: "female",
  age: 24,
  haircolor: "blond",
  mood : "clam"
}

Поскольку я хочу назначить функцию свойству, я должен сначала создать его и разрешить функции вызывать его.

Object.defineProperty() Объект используется для добавления нового свойства к существующему объекту. Первый параметр указывает существующий объект, который необходимо изменить. Во втором объявлении я добавил новое свойство. Последний, дескриптор, — это функция, вызываемая для нового свойства.

.set() будет хранить параметр, который позволяет свойству ссылаться на него.

Object.defineProperty(amy, "weather",{
    set(weatherData){
       if(weatherData === "sunny day"){
          this.mood = "delightful" // 'this' indicates the object named "amy"
       }else if(weatherData === "rainy day"){
           this.mood = "upset"
       }
    } 
})
amy.weather = "sunny day"
console.log(amy.mood)
>> delightful

В то время как я использовал ключевое слово const для объявления объекта amy, функция constructor позволяет мне создать новый объект с помощью функции. В обязательном порядке я буду использовать нотацию Паскаля для имени функции. В качестве примера рассмотрим employeeList выше.

function List(name, age, position, workingStore){
    this.name = name;
    this.age = age;
    this.position = position;
    this["working store"] = workingStore;
  }

  const employeeList1 = new List("Mike", 34, "Area Manager", "The Second")
  const employeeList2 = new List("Karen", 29, "Store manager", "The Second")
  const employeeList3 = new List("Crystal", 19, "Barista", "The Second")

  console.log (employeeList1)
>>List {name: 'Mike', age: 34, position: 'Area Manager', working store: 'The Second'}
  console.log (employeeList2)
>>List {name: 'Karen', age: 29, position: 'Store manager', working store: 'The Second'}
  console.log (employeeList3)
>>List {name: 'Crystal', age: 19, position: 'Barista', working store: 'The Second'}

Я назвал новую переменную после объявления функции конструктора для хранения копии списка. И эта переменная позволяет мне получать информацию, используя обозначения объектов. Термин «новый» создает пустой объект и передает значения, переданные целевой функции.

console.log (employeeList1.age)
>> 34

Я могу использовать функцию List несколько раз, добавляя дополнительную информацию в список сотрудников. И этот метод делает мою функцию более динамичной.

Если бы вы могли получить представление о том, как работает конструктор. Пришло время изучить JavaScript Классы. Я снова воспользуюсь предыдущим примером, чтобы помочь вам понять.

class List {
  constructor(name, age, position, workingStore){
    this.name = name;
    this.age = age;
    this.position = position;
    this["working store"] = workingStore;
  }
}
const employeeList1 = new List("Mike", 34, "Area Manager", "The Second")

console.log (employeeList1)
>>List {name: 'Mike', age: 34, position: 'Area Manager', working store: 'The Second'}

Если я передам ту же информацию об одних и тех же сотрудниках в функцию класса, я получу идентичный результат. Поздравляем! За короткое время вы изучили основы синтаксиса класса.