Вы когда-нибудь встречали ключевое слово «это» при чтении кода или следовании учебнику? Ха-ха… Я вижу на твоем лице выражение «что, черт возьми, это за «это»». Чтобы мы четко поняли, что делает ключевое слово this, давайте сначала поговорим о том, что такое объект в javascript.

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

Таким образом, мы можем представить объекты реальной жизни, такие как пользователь, автомобиль, стол и т. д. Допустим, вы понятия не имеете, что такое объекты, и при написании кода вам нужен способ представить пользователя, который имеет следующие свойства: имя, возраст . Как бы Вы это сделали? Лучший способ — создать пользовательский объект и присвоить ему свойства.

let user = {
    name: "Bob",
    age: 20,
}

Ключами являются имя и возраст. И значения — Боб и 20. Затем мы можем взять пользовательский объект и делать с ним все, что захотим. Например, мы можем отправить ему тело HTTP-запроса, сохранить его в базе данных или передать в качестве аргумента функции. Делай с ним, что хочешь.

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

let user = {
  name: "Bob",
  age: 20,
  greet: function() {return "Hello"}
}

console.log(user.greet()) ---> Hello

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

Теперь мы хотим добавить свойство name объекта пользователя к «Hello», чтобы вернуть «Hello Bob».

Когда мы попробуем это сделать, мы получим ошибку ссылки.

let user = {
  name: "Bob",
  age: 20,
  greet: function() {return "Hello" + name}
}

console.log(user.greet()) ---> ReferenceError: name is not defined

Несмотря на то, что имя является свойством объекта пользователя; мы не можем получить к нему доступ, просто вызвав «имя». Именно здесь появляется ключевое слово «этот». «Это» представляет сам объект. Взгляните на console.log «этого»

let user = {
  name: "Bob",
  age: 20,
  greet: function() {return this}
}

console.log(user.greet()) ---> {name: "Bob", age: 20, greet: [Function greet]}

Чтобы получить доступ к значению свойства name, мы используем this.name. В этом контексте this.name = «Боб»

let user = {
  name: "Bob",
  age: 20,
  greet: function() {return "Hello" + this.name}
}

console.log(user.greet()) ---> Hello Bob

Мы можем получить доступ к «Бобу», вызвав user.name, но это не рекомендуется. Если объекту присвоено другое имя, user.name выдаст ошибку. Так что давайте придерживаться «этого».

Предполагается, что ключевое слово this должно использоваться в контексте объекта. Он не определен в обычной функции в «строгом режиме» javaScript. В нестрогом режиме он представляет собой глобальный объект «окно». Это ошибка программирования, решаемая строгим режимом.

Мы можем использовать объектный литерал для создания любого количества объектов. Но мы все можем согласиться с тем, что на третьем испытании это станет скучным и однообразным. Лучший способ справиться с этим — использовать класс. Класс — это план объекта. Он не является объектом сам по себе, но содержит свойства, необходимые для создания объекта.

class User {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    return "Hello " + this.name;
  }

}

Приведенный выше класс позволяет нам создавать несколько объектов пользователя. Как и литерал пользовательского объекта, у него есть свойство с именем name, age и метод с именемgreet. Мы можем использовать ключевое слово this в классе, потому что это план объекта.

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

const user1 = new User("Bob", 20);
user1.name ---> "Bob"

//user1 is an object created using the User blueprint.

Теперь давайте попробуем несколько примеров. Убедитесь, что вы пробуете больше самостоятельно.

const user1 = new User("Bob", 20);
const user2 = new User("Tom", 17);
console.log(user1.name) ---> Bob
console.log(user2.name) ---> Tom
console.log(user1.greet()) ---> Hello Bob
console.log (user2.greet()) ---> Hello Tom

Напомним, объект — это просто структура данных, используемая для хранения данных в виде пар ключ-значение. В контексте объекта ключевое слово this представляет сам объект, а класс — это план объекта.

Ура!.. ты дошел до конца. А теперь вооружитесь этими знаниями и отправляйтесь покорять мир JavaScript, полный «этого», объектов и классов :)