You are currently viewing Каковы классы и прокси в JavaScript ?

Каковы классы и прокси в JavaScript ?

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

Определение класса: Класс может быть определен с помощью ключевого слова class вместе с функцией конструктора для его инициализации.

Синтаксис:

class Classname {
 constructor(property1, property2) {
 this.property1 = property1;
 this.property2 = property2;
 }
}

Пример: 

В следующем примере описываются простые классы.

<script>
	class Employee {
		constructor(name, id) {
			this.name = name;
			this.id = id;
		}
	}
	let Employee1 = new Employee("Suraj", 533);
	console.log(Employee1);
</script>

Выход:

Employee {name: 'Suraj', id: 533}
id: 533
name: "Suraj"
[[Prototype]]: Object

Выражения классов: Мы также можем определить класс с помощью выражений классов. Они могут быть двух типов, а именно “именованные” или “безымянные». К имени класса можно получить доступ с помощью свойства name.

Синтаксис:

let Employee = class {
 constructor(name, id) {
 this.name = name;
 this.id = id;
 }
}

Пример:

<script>

// Unnamed class
	let Employee1 = class {
		constructor(name, id) {
			this.name = name;
			this.id = id;
		}
	}
	console.log(Employee1.name);

// Named class
	let Employee2 = class Intern {
		constructor(name, id) {
			this.name = name;
			this.id = id;
		}
	}
	console.log(Employee2.name);		
</script>

Выход:

Employee1
Intern

Синтаксис:

class Classname {
 constructor(property1, property2) {
   this.property1 = property1;
   this.property2 = property2;
 }
 method1() { ... }
}

Пример:

<script>
	class Employee {
		constructor(name, id) {
			this.name = name;
			this.id = id;
		}
		
		// Without parameter
		getname(){
			return "Name of Employee: "+this.name;
		}
		
		// With parameter
		getdept(department){
			return "Works in " + department;
		}
	}

	let Employee1 = new Employee("Suraj", 533);
	console.log(Employee1.getname());
	console.log(Employee1.getdept("Finance department"));
</script>

Выход:

Name of Employee: Suraj
Works in Finance department

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

Параметры:

Прокси-объект принимает два параметра, описанных ниже:

  • цель: Это исходный объект, который мы хотим обернуть прокси-сервером.
  • обработчик: Объект, свойства которого определяют поведение прокси-сервера, если на этом прокси-сервере выполняется операция.

Синтаксис:

const target = {
   property1: "first property",
   property2: "second property"
};
const handler = { ... };
const proxy1 = new Proxy(target, handler);

Пример:

<script>
	const target = {
		property1: "ProgramBox",
		property2: "Computer science portal"
	};

	const handler = {};
	const proxy = new Proxy(target, handler);

	console.log(proxy.property1);
	console.log(proxy.property2);
</script>

Выход:

ProgramBox
Computer science portal

Поскольку обработчик пуст, он не влияет на цель. Таким образом, прокси ведет себя как его первоначальная цель.

Мы также можем определить операции внутри обработчика для изменения свойств прокси-сервера по сравнению с его исходной целью. Для этого нам нужно использовать get() обработчик, который может получить доступ к свойствам целевого объекта и управлять свойствами внутри прокси-сервера. То reflect класс помогает применить исходные свойства целевого объекта к прокси-серверу.

Пример: 

Мы подали заявление условие в обработчике, чтобы проверить “property2” цели, вывод должен быть изменен с исходного свойства цели.

<script>
	const target = {
		property1: "ProgramBox",
		property2: "Computer science portal"
	};

	const handler = {
		get: function (target, prop, receiver) {
			if (prop === "property2") {
				return "For computer science geeks";
			}
			else{
				return Reflect.get(target,prop);
			}
		}
	}
		const proxy = new Proxy(target, handler);

		console.log(proxy.property1);
		console.log(proxy.property2);
</script>

Выход:

ProgramBox
For computer science geeks