Вот краткий обзор первой части…
- набор множества отдельных элементов
- имеет возможность изменения размера и… сочетание разных «типов данных»
- может быть доступен по индексу, который начинается с 0
- имеет итерационные методы
- это набор свойств (пар ключ-значение) и/или методов
- значение свойства может изменяться
- «можно получить доступ с помощью произвольных строк» с двумя синтаксисами: нотация через точку и нотация скобок
- не повторяется
- может принимать функцию в качестве значения и вызывать метод парного свойства
В предыдущей части я обсуждал методы массива. В этом разделе я начну со структуры объекта.
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'}
Если я передам ту же информацию об одних и тех же сотрудниках в функцию класса, я получу идентичный результат. Поздравляем! За короткое время вы изучили основы синтаксиса класса.