JavaScript OOP Flashcards
(69 cards)
Обяснете какво е обектно-ориентирано програмиране.
ООП е набор от принципи, които трябва да следваме, ако искаме да използваме обекти като основен начин за организиране на нашия код./Класове, прайвет фиилдс.
Някои от тези принципи се поддържат от езикови характеристики
Други са по-абстрактни принципи, които трябва да следваме, когато пишем код. Кода трябва да предоставя възможност за бързо фасилитиране на промените според изискванията на клиентите
-Обяснете какво представляват класовете и за какво можем да ги използваме.
Класовете са основната езикова функция, която ни позволява да използваме ООП Те са обектни шаблони, които се използват за моделиране:
Състояние (използвайки променливи, които наричаме полета /възможност за дефолтни стойности/)
Поведение (използвайки функции, които наричаме методи) Инстанции са обектит създадени на база на класа/шаблона/
// Example class
class Person {
// Model the person
}
// Objects created using the class const person1 = new Person(); const person2 = new Person();
State classPerson{
name='Pesho';
age=20;
}
Behavior
classPerson{
name;
speak(){
return`HelloI\'m${this.name}`;
}
}
Моделирайте клас за изразяване на конкретно състояние и поведение.
Полетата са част от данните на класа
Те са еквивалент на променливи и състоянието на обекта. Полетата могат да имат стойност по подразбиране
Методите са част от класа, и позволяват изпълнение на действие Свързаните полета и методи трябва да бъдат поставени в един и същи клас
Методите могат да взаимодействат с полетата
class Person {
name;
sayName() {
console.log(Hello I am ${this.name});
}
}
Създайте обект (инстанция) с помощта на клас.
const gosho = new Person();
gosho. name = ‘Gosho’;
gosho. sayName();
Създайте обект (инстанция) с помощта на конструктор.
class Person {
name;
constructor(initialName){
this.name = initialName;
}
sayName() {
console.log(`Hello I am ${this.name}!`);
}
}
// create instances whit constructor
const gosho = new Person('Gosho');
gosho.sayName(); //implicid binding
Добавете документация в кода с помощта на JSDoc. https://jsdoc.app/
/** */ записваме коментари, които се визуализират в останалите файлове и в браузера, като документация. Инсталираме глобално пакета npm install -g jsdocГенерираме документация в папка docs посредством команда - jsdoc person.js -d dosc
https://www.npmjs.com/package/jsdoc
/** This class represents a Peron */
install -g jsdoc
jsdoc person.js -d dosc. https://jsdoc.app/tags-param.html
Documenting a destructuring parameter как конкретно да описваме типа на параметрите в документацията-Обяснете разликата между OOP и FP.
OOP е парадигма на програмиране и се отнася до стил на програмиране, не се отнася до конкретен език, а по-скоро до начина, по който се структурира кода Процедурно програмиране – Записване на стъпките, които вашата програма трябва да изпълни по ред Функционално програмиране - Организиране на вашия код в множество функции, където всяка функция работи сама по себе си
Обектно-ориентирано програмиране - Организиране на вашия код в класове и обекти (обектите са базирани на класове)”
// Procedural programming Записване на стъпките, които вашата програма трябва да изпълни по ред
const button = document.querySelector('button');
const doSomething = () => {
// doSomething...
};
button.addEventListener('click', doSomething);
Functional programming -Организиране на вашия код в множество функции,където всяка функция работи сама по себе си
function findElementOnPage(elementTag) {
return document.querySelector(elementTag);
}
function doSomething() {
//do Something
}
function attachEvent(selector, eventType, action) {
const btn = findElementOnPage(selector);
btn.addEventListener(eventType, action);
}
attachEvent(‘button’, ‘click’, doSomething);
Object-oriented programming Организиране на вашия код в класове и обекти (обектите са базирани на класове)
class InputArea {
button;
constructor(){
this.button = document.querySelector('button');
this.button.addEventListener('click', this.doSomething);
}
doSomething(){
//do Something
}
}
const area = new InputArea();
Какво е ООП? - Какво представляват класовете и защо те са една от основните функции на ООП в JS?
”
ООП е набор от принципи, които трябва да следваме, ако искаме да използваме обекти като основен начин за организиране на нашия код./Класове, правет фиилдс.
Класовете са основната езикова функция, която ни позволява да използваме ООП Те са обектни шаблони, които се използват за моделиране:
Състояние (използвайки променливи, които наричаме полета /възможност за дефолтни стойности/)
Поведение (използвайки функции, които наричаме методи) Инстанции са обектит създадени на база на класа/шаблона/”
Как можем да създадем клас, който има специфично състояние и/или поведение?
Полетата са част от данните на класа
Те са еквивалент на променливи и състоянието на обекта. Полетата могат да имат стойност по подразбиране
Методите са част от класа, и позволяват изпълнение на действие Свързаните полета и методи трябва да бъдат поставени в един и същи клас
Методите могат да взаимодействат с полетата
Създайте обект (инстанция) с помощта на клас. class Person {
name;
sayName() {
console.log(Hello I am ${this.name});
}
} const gosho = new Person();
gosho.name = ‘Gosho’;
gosho.sayName();
Създайте обект (инстанция) с помощта на конструктор. class Person {
name;
constructor(initialName){
this.name = initialName;
}
sayName() {
console.log(`Hello I am ${this.name}!`);
}
}
// create instances whit constructor
const gosho = new Person('Gosho');
gosho.sayName(); //implicid binding
Какво представляват инстанции на клас и как можете да създадете такъв?
Изграждане на споделен стейт или място в класовете посредством Static members за да може всяка инстанция да ги достъпи и промени посредством наименованието на класа а не посредством this. Статичните мембъри живеят с класовете до момента на спиране на програмата
“ Instatic members Свързан с instanciite (обект) Инициализира се при извикване на конструктора
Какво представляват статичните членове /статични мембъри/ и за какво се използват?
Static members Свързан с тип (клас), а не с екземпляр
Инициализира се точно преди типът да се използва за първи пътс Iзползват, когато типът трябва да има или прави конкретно нещо, което не е обвързано с нито един екземпляр Когато логиката не е обвързана с инстанциите, тя се поставя в класа като статичен мембър
class MyMath {
static pow(num: number) {
return num ** 2;
}
static abs(num: number) {
return num < 0 ? -num : num;
}
}
Статичните мембъри се извикват в самия клас. Използваме статични мембъри, за да може всички инстанции да имат достъп и/или да ги променят.
Обяснете какви са данните и защо са важни.
Компютинг процес: Целта при разработка на софтуер е той да приема чрвз инпут, обработва и запазва данните на сървър и визуализира конкретни данни. Данните са информасия или фарактеристика, която е събрана посредством софтуер или хардуер предава се на операционната система и се обработва.Данни и информация се различазват. Данните се получават в суров вид за да са информация се поставят в контекст поличаване на имена за да са ин-я трябва да знаем име на човек улица или др. Мета данни даваят конкретика за дата час ил др. Данните се репрезентират посредством променливи, които съдържат литерали. За получаване на допълнителна стойност се групират в обекти. Данните може да се предават на друг софтуер JSON XML /има много семантика/сървари. Запазване в /Persistent storage/ консистентен сторидж данни “Компютърните данни са:
Характеристики или информация
Придобити чрез хардуерен и/или софтуерен вход
Обикновено „данните“ и „информацията“ са взаимозаменяеми, но
Данните се превръщат в информация, когато се поставят в контекст
Контекстът дава значение на данните
Метаданните са данни за данни”
Създавайте обекти, които имат както състояние, така и поведение.
Обектите са съвкупност от елементи с ключ и стойност, който могът да се копират и обработват. Името на обекта персонализира данните, които се подават. В обектите може да има функционалностти, като към съответния ключ се добавя функция /наричани методи/, така обектите обединяват и групират данните с логиката в едно. ООП позволява да използваме обектите като нещо което да даде структора на кода ни По този начин свързаната логика винаги остава със свързаните данни "let person = {
name: 'Lia',
age: 25,
getName() {
return this.name;
},
};
console.log(person.getName());" "Обектът е проста конструкция от двойки ключ-стойност, често наричани свойства на обекта. Обектите осигуряват лесен начин за Групиране на свързани данни Разделянето му на смислени парчета Прехвърляне на данните като цяло"
Използвайте обекти за създаване на структура в кода.
Oбектите обединяват и групират данните с логиката в едно. ООП позволява да използваме обектите като нещо което да даде структора на кода ни По този начин свързаната логика винаги остава със свързаните данни Можете директно да получите достъп до състоянието на обект чрез . person.name Можете да получите достъп до състоянието чрез метод getName() {
return this.name;
}," "let person = {
name: 'Lili',
age: 25,
getName() {
return this.name;
},
};
console.log(person.getName());
Защитете състоянието на обекта чрез неговото поведение.
Данните са основни за вашия софтуер, трябва да са винаги във валидно (за вашия софтуер) състояние Какво ни пречи да зададем директно стойността ?
Екипните споразумение, не винаги са ефективни, при смяна на екипа или забравяне бихме имали грешки. Предотвратяване на грешки и ефективна работа на софтуера са основните причини да търсим валидация на данните” “let person3 = {
name: ‘L’,
age: 26,
setAge(newAge) {
if (newAge <= 18 || newAge >= 120) {
throw 'Invalid age!';
}
this.age = newAge;
},
};
person3.setAge(-20);" "Можете да промените състоянието директно person.age=25;
Можете също да използвате метод за промяна на състоянието letperson={
name:'Ivan',
age:20,
setAge:function(newAge){
this.age=newAge;
}
}
person.setAge(25);
Обяснете какво означава ключовата дума ‘this’.
Това е placeholder който получава своята стойност, когато се извика функция. Препратката, се определя от call-site , където се извиква функцията
Трябва да прегледа call-site за да определите кое от 4-те правила е приложимо. Default Binding; Implicit Binding; Explicit Binding; new Binding
“ Накратко, това не е нито препратка към самата функция, нито е препратка към лексикалния обхват на функцията.
- Какво представляват данните и защо е важно те да са валидни?
Данните са основни за вашия софтуер, трябва да са винаги във валидно (за вашия софтуер) състояние Какво ни пречи да зададем директно стойността ?
Екипните споразумение, не винаги са ефективни, при смяна на екипа или забравяне бихме имали грешки. Предотвратяване на грешки и ефективна работа на софтуера са основните причини да търсим валидация на данните
- В контекста на обектите какво е състояние и поведение?
Един обект може да има a
Състояние – данните, които обектът притежава Хората имат:
Име, което е низ
Възраст, което е число
Телефон, който може да бъде низ
Поведение – логиката, която може да се приложи към тези данни Хората могат: (поведение)
Кажете „Хей, аз съм [Име] и съм [Възраст] на години.“
Кажете „Можете да се свържете с мен на [телефон].
Какво означава ключовата дума “this”?
Това е placeholder който получава своята стойност, когато се извика функция. Препратката, се определя от call-site , където се извиква функцията
Как да определим стойността на “this”?
Explicid - Ако функцията е извикана с call()или apply() или чрез хай ордер функцията bind() Implicit Binding - Извикваме This през обект/This е във функция, която е част или се преизполлзва във конкретния обект/ ako не е Implicit or Explicid тя е Default Binding 1 This сочи към глобалния обект при използване на Node 2 This сочи към window обект при използване на браузер “const someFunc = function () {
console.log(this);
};
someFunc(); // Object [global] {
global: [Circular *1],
clearInterval: [Functio”
Кои са 4-те правила, които могат да ни помогнат да определим това? 4-те правила са. Default Binding; Implicit Binding; Explicit Binding; new Binding
- Кои са 4-те правила, които могат да ни помогнат да определим това? 4-те правила са. Default Binding; Implicit Binding; Explicit Binding; new Binding
1 Default Binding
1 Default Binding 1 This сочи към глобалния обект при използване на Node 2 This сочи към window обект при използване на браузер 3.използване на 'use strict' - undefined При използване на 'use strict' няма обръщение към глобалния обект резултата ще е undefined "const someFunc = function () {
console.log(this.name);
};
name = 'L'
someFunc(); //L"2 Implicit Binding;
2 Implicit Binding; Извикваме This през обект/This е във функция, която е част или се преизполлзва във конкретния обект/ " nested obj let pesho = {
name: 'Pesho',
sayName: sayName,
};
let parent = {
name: 'Lio',
child: pesho,
};
pesho.sayName(); //Pesho
parent.child.sayName(); //Pesho" "const sayName = function () {
console.log(this.name);
};
let pesho = {
name: 'Pesho',
sayName: sayName,
};
pesho.sayName(); //Pesho"
3.1 Explicit Binding;
3.1 Explicit Binding; "This все още се отнася до глобалния обхват
Ние използваме .call() или apply()/при него аргумента/текста/ се подава в масив, за да зададем контекста на функциите и директно да го извикаме с този контекст" "const sayName = function () {
console.log(this.name);
};
const person = {
name: 'Pesho',
};
sayName.call(person); //Pesho" "const sayName = function (text) {
console.log(`${text} ${this.name}`);
};
const person = {
name: 'Pesho',
};
sayName.call(person, 'Hello'); //Pesho
sayName.apply(person, ['Hello']);"
