Как разработчик JavaScript, мы все знаем о важности объектов. Объекты являются ядром JavaScript, и в мире программирования говорят, что если вы знаете объект JavaScript, вы мастер в JavaScript.

Жизнь веб-разработчика неполноценна с JavaScript.

Теперь попробуем понять Что такое Object? Чтобы понять объекты в информатике, сначала давайте разберемся с объектами в реальном мире.

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

Теперь, когда мы выяснили, что такое объект в реальном мире, давайте разберемся с объектом в информатике.

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

Это приведет нас к объекту в JavaScript.
В JavaScript объект — это отдельная сущность со свойствами и типом.

По сути, все три — это одно и то же, и визуализация всех трех немного отличается для каждого потенциального клиента. Теперь, прочитав об объектах JavaScript и сравнив их с объектами реального мира, нам стало любопытно, как создать объект.

Создание объектов в JavaScript — это весело. У нас есть несколько способов создания этих объектов. Здесь мы сосредоточимся на двух наиболее важных из них.

1. Создайте объект с помощью литерала объекта:

Это самый умный способ создать объект. Здесь мы объявляем объект в переменную с фигурными скобками {} и внутри этого мы можем использовать пару ключ: значение.

пример :

var country = {
 "name" : "United State",
 "capital" : "Washington DC",
 "currency" : "Dollar"
 }

Теперь у нас есть наш объект под названием страна. country.name вернет Соединенные Штаты.

Если мы хотим добавить еще несколько полей в существующий объект, мы можем сделать это с помощью следующего кода.

country.president = "Joe Biden"

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

var country = {};
country.name = "United State",
country.capital = "Washington DC",
country.currency = "Dollar"

2. Создайте объект с помощью нового ключевого слова ().

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

const games = new Object();
games.name : "Call of Duty”,
games.publisher : "Activision Publishing Inc.‬",
games.platform : "Xbox One"

Теперь у нас есть два разных способа создания объекта. Здесь возникает вопрос, что лучше для исполнения. Как мы обсуждали ранее, умный способ создания — использование литерала. Это повысит производительность и упростит обслуживание.

Что нужно помнить: Объекты JavaScript изменяемы.

Да, объекты JavaScript изменяемы. Изменяемый объект — это объект, состояние которого можно изменить после его создания. Это означает, что к объектам JavaScript обращаются по ссылке, а не по значению.

Давайте посмотрим на этот пример:

const person = {
 firstName: "Maddy",
 lastName:"R",
 age:20,
 eyeColor:"blue"
}
const developer = person;
developer.age = 10;

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

В JavaScript больше фреймворка, чем в приложениях, созданных на JavaScript.

В предыдущем разделе мы обсудили, что такое объект и как его создать. Теперь давайте посмотрим на свойства объектов JavaScript.

Свойство JavaScript — это не что иное, как переменная, прикрепленная к объекту. мы можем изменить, удалить или добавить новые свойства в JavaScript. Чтобы выполнить какую-либо операцию над объектом JavaScript, нам сначала нужно получить доступ. Итак, вопрос здесь: Как получить доступ к свойствам JavaScript?

Синтаксис:

objectName.propertyName

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

country.currency // return Dollor.
country.flag // undefined (we not declered flag in country object)

Альтернативным способом доступа к свойствам в JavaScript является нотация [].

country[name] // return United State

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

Здесь мы заметили, что объект JavaScript — это не что иное, как набор неупорядоченных свойств. Таким образом, некоторая коллекция, включаемая здесь, означает, что мы можем выполнить цикл, чтобы получить все свойства JavaScript за один раз. JavaScript является итерируемым.

Если вы хотите увидеть массив JavaScript и зацикливание, загляните в этот блог.



Все о JavaScript Array[]
В нашей обычной разработке мы всегда застреваем в какой-то момент, когда нам нужно поиграть с массивом. Независимо от того, какая библиотека…medium.com



Вот синтаксис для зацикливания объекта JavaScript.

for (let variable in object) {
 // code
}

пример кода.

for (let key in country) {
 output += country[key];
}

Мы понимаем, что можем зациклить объект JavaScript. Мы также можем реализовать некоторые операции, такие как добавление и удаление объекта JavaScript. Ниже приведен пример кода этого.

Adding
country.president = "Joe Biden"
Deleting
delete country.president;

Именно так мы можем добавлять и удалять в нашем объекте. Объекты JavaScript наследуют свойства своего прототипа. (О наследстве выделю отдельный пост). Ключевое слово delete не удаляет унаследованные свойства, но если вы удалите свойство прототипа, оно повлияет на все объекты, унаследованные от прототипа.

JavaScript — это первая страница Интернета. Реддит появится позже.

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

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

это ключевое слово:

Это ключевое слово JavaScript относится к объекту, которому оно принадлежит. В объектном методе это относится к «владельцу» метода.

пример :

const football = {
  team: “Manchester United”,
  stadium: “Old Trafford”,
  ranking: 1,
  teamPerfomance: function() {
    return this.team + “ : “ + this.ranking;
  }
};

Здесь это футбольный объект, который «владеет» функцией teamPerfomance.

Итак, теперь мы разобрались с ключевым словом this в JS. Это приведет к самой интересной теме под названием JМетоды avaScript.

Методы JavaScript — это действия, которые можно выполнять над объектами. Методы — это функции, хранящиеся в виде свойств объекта. В нашем предыдущем примере мы видели, как создать метод в объекте JavaScript.

Вот пример, в котором мы видим, как мы можем получить доступ к методам JavaScript, используя предыдущий пример.

Syntax : objectName.methodName()
example : var teamRanking = football.teamPerfomance();

Приведенный выше пример вернет название команды и рейтинг, который равен Манчестер Юнайтед: 1.

Теперь здесь у меня есть один вопрос в виду. Можем ли мы добавить метод в object.

Итак, вот как мы можем добавить метод.

football.teamName (){
 return footballTeam;
}

пример: var teamRanking = football.teamPerfomance();

Приведенный выше пример вернет название команды и рейтинг, который является «Манчестер Юнайтед»: 1

Теперь здесь у меня есть один вопрос в виду. Можем ли мы добавить метод в object.

Итак, вот как мы можем добавить метод.

Football.teamName (){
return footballTeam;
}

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

var book = {
 name : “JavaScript Manual”,
 author : “JavaScript Heros”,
 
}

1. мы можем получить объект следующим образом.

console.log(Book.author); // will print author name.

2. Использование Object.values()

 
 Object.values() convert JavaScript object into array. so in our example 
 
 Object.values(book) // this will return in array
output = [“JavaScript Manual”,”JavaScript Heros”]

3. JSON.stringify()

Это один из важных встроенных методов в JavaScript. Это преобразует весь объект в строку.

let myString = JSON.stringify(book);
Output will be ‘{“name”:”JavaScript Manual”,”author”:”JavaScript Heros”}’

Мы можем поиграть со строковым методом JSON.

Пока вы программируете, у вас будут эти чувства!

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

Что такое конструктор?

Конструктор — это функция, которая создает экземпляр класса, который обычно называют «объектом». В JavaScript конструктор вызывается, когда вы объявляете объект с помощью нового ключевого слова.

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

давайте посмотрим этот пример. Я создаю объект здесь.

function car(name, model){
   this.name = name;
   this.model = model;
}

Теперь здесь мы объявили наш объект. Вы помните это ключевое слово, это ключевое слово начинает ссылаться на этот вновь созданный объект и, следовательно, становится текущим объектом экземпляра. Теперь создайте экземпляр объекта с именем Car.

var car1 = new car("Ford", "Figo")
var car2 = new car("Fiat", "Pinto")

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

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

constructor(){}

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

function car(name, model){
    this.name = name;
    this.model = model;
    this.carType = function(){
      return this.name;
    }
}

Поскольку мы разобрались с концепцией конструктора и конструктора по умолчанию, теперь мы увидим три разных типа объектов.

1. Числовой объект:Числа могут быть созданы как объект.

var num = new Number(1000)
Number {1000}

2. Логический объект:логический объект также может быть создан как объект с помощью нового ключевого слова:

bol = new Boolean(false)

3. Строковый объект: строка также может быть создана как объект с помощью нового ключевого слова:

var firstName = new String(“John”);

Прототип объекта:

Прототипы — это механизм, с помощью которого объекты JavaScript наследуют свойства друг друга. Все объекты JavaScript наследуют свойства и методы от прототипа.

Объекты даты наследуются от Date.prototype

Объекты массива наследуются от Array.prototype

Объекты автомобилей наследуются от Car.prototype

Примечание. Object.prototype находится на вершине цепочки наследования прототипов:

Объекты Date, объекты Array и объекты Car наследуются от Object.prototype.

(Я расскажу об Object Prototype отдельно в посте о наследовании, который скоро появится)

Наследование — это объектно-ориентированный способ стать богатым?

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

Синтаксис

let obj = {
 get propName() {
 // getter, the code executed on getting obj.propName
 },
set propName(value) {
 // setter, the code executed on setting obj.propName = value
 }
};
CODE
let user = {
 name: “John”,
 surname: “Smith”
};
let user = {
 name: “John”,
 surname: “Smith”,
get fullName() {
 return `${this.name} ${this.surname}`;
 }
};
alert(user.fullName); // John Smith

Это основная и расширенная концепция объектов в JavaScript.

Продолжайте кодировать !!