Как получить GET-запрос без JavaScript средствами CSS?

Получение и работа с прототипами в JavaScript

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

Object.getPrototypeOf()

Основной способ получить прототип объекта:

const user = { name: 'John' };
const proto = Object.getPrototypeOf(user);

console.log(proto);  // Object { ... }
console.log(proto === Object.prototype);  // true

// Проверка наследования методов
console.log('toString' in user);  // true (наследовано от прототипа)
console.log(user.hasOwnProperty('toString'));  // false (не свойство объекта)

proto (Неофициальное свойство)

Устаревший способ, но всё ещё работает:

const user = { name: 'John' };
console.log(user.__proto__);  // Object { ... }
console.log(user.__proto__ === Object.prototype);  // true

// ИЗБЕГАЙ устанавливать __proto__ напрямую
user.__proto__ = null;  // Плохая идея

Предпочитай Object.getPrototypeOf() - это стандартный и более безопасный способ.

Цепочка прототипов (Prototype chain)

Объекты наследуют свойства от цепочки прототипов:

const animal = { eats: true };
const dog = Object.create(animal);  // dog наследует от animal
dog.barks = true;

const myDog = Object.create(dog);
myDog.name = 'Rex';

console.log(myDog.name);    // 'Rex' (своё свойство)
console.log(myDog.barks);   // true (из dog)
console.log(myDog.eats);    // true (из animal)

// Цепочка прототипов:
// myDog -> dog -> animal -> Object.prototype -> null

// Вывести всю цепочку
let current = myDog;
while (current) {
  console.log(current);
  current = Object.getPrototypeOf(current);
}

Object.create()

Создание объекта с явно указанным прототипом:

const parent = {
  greet() {
    return `Hello, ${this.name}`;
  }
};

const child = Object.create(parent);
child.name = 'John';

console.log(child.greet());  // 'Hello, John'
console.log(Object.getPrototypeOf(child) === parent);  // true

// С дополнительными свойствами
const person = Object.create(parent, {
  name: { value: 'Jane', writable: true },
  age: { value: 30, writable: true }
});

Функции-конструкторы и прототипы

function User(name, email) {
  this.name = name;
  this.email = email;
}

// Методы в прототипе функции-конструктора
User.prototype.greet = function() {
  return `Hello, ${this.name}`;
};

User.prototype.toString = function() {
  return `User: ${this.name} <${this.email}>`;
};

const user1 = new User('John', 'john@example.com');
const user2 = new User('Jane', 'jane@example.com');

console.log(user1.greet());         // 'Hello, John'
console.log(Object.getPrototypeOf(user1) === User.prototype);  // true

// Все экземпляры делят методы
console.log(user1.greet === user2.greet);  // true (один и тот же метод)

Классы (Синтаксический сахар для прототипов)

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

  greet() {
    return `Hello, ${this.name}`;
  }
}

const user = new User('John', 'john@example.com');
console.log(Object.getPrototypeOf(user) === User.prototype);  // true
console.log(user.greet());  // 'Hello, John'

// Классы - это просто прототипы с более удобным синтаксисом

Наследование через прототипы

// Функции-конструкторы
function Animal(name) {
  this.name = name;
}

Animal.prototype.eat = function() {
  console.log(`${this.name} eats`);
};

function Dog(name, breed) {
  Animal.call(this, name);  // Вызвать конструктор родителя
  this.breed = breed;
}

// Наследование прототипа
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;  // Восстановить конструктор

Dog.prototype.bark = function() {
  console.log(`${this.name} barks`);
};

const dog = new Dog('Rex', 'Labrador');
dog.eat();   // 'Rex eats' (из Animal)
dog.bark();  // 'Rex barks' (из Dog)

// Или с классами (проще):
class Animal {
  constructor(name) {
    this.name = name;
  }
  eat() { console.log(`${this.name} eats`); }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name);
    this.breed = breed;
  }
  bark() { console.log(`${this.name} barks`); }
}

Проверка наследования

const user = new User('John');

// Проверить, является ли user экземпляром User
console.log(user instanceof User);  // true
console.log(user instanceof Object);  // true

// Проверить, является ли User.prototype в цепочке прототипов user
console.log(User.prototype.isPrototypeOf(user));  // true

// Получить прототип
console.log(Object.getPrototypeOf(user) === User.prototype);  // true

Собственные vs наследованные свойства

const user = new User('John');
User.prototype.role = 'user';

// Собственные свойства
console.log(Object.getOwnPropertyNames(user));  // ['name', 'email']

// Все свойства (включая наследованные)
for (let key in user) {
  console.log(key);  // name, email, role, greet, toString, ...
}

// Только собственные
for (let key in user) {
  if (user.hasOwnProperty(key)) {
    console.log(key);  // name, email
  }
}

// Современный способ
Object.entries(user).forEach(([key, value]) => {
  console.log(key, value);  // name, email
});

Модификация прототипа

// Добавить метод в встроенный прототип (очень редко)
Array.prototype.last = function() {
  return this[this.length - 1];
};

const arr = [1, 2, 3];
console.log(arr.last());  // 3

// ИЗБЕГАЙ этого для встроенных типов!
// Лучше используй подклассы или обёртки

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

function describeObject(obj) {
  console.log('Object:', obj);
  console.log('Prototype:', Object.getPrototypeOf(obj));
  console.log('Constructor:', obj.constructor.name);
  console.log('Prototype chain:');
  
  let proto = Object.getPrototypeOf(obj);
  let level = 0;
  while (proto) {
    console.log(' '.repeat(level * 2) + '-> ' + (proto.constructor?.name || 'null'));
    proto = Object.getPrototypeOf(proto);
    level++;
  }
}

describeObject(new User('John'));

Прототипы - основа JavaScript наследования. Используй Object.getPrototypeOf() для получения прототипа и modern классы для создания новых объектов.