30. diel - Najčastejšie chyby JS nováčikov - Vieš pomenovať objekty?

V dnešnom JavaScript tutoriále si ukážeme prvé dobré praktiky pre objektovo orientované programovanie v JavaScripte. Pozri sa, či nerobíš jednu z najčastejších chýb.

Slovo senior programátora

Gratulujem k zdolaniu základnej problematiky objektovo orientovaného programovania! 🏆 Dostal si sa k záchytnému bodu, v ktorom sa trochu vydýchame a ukážeme si, ako správne použiť nadobudnuté informácie, než sa pustíme do ďalších. Materiál pre dnešnú lekciu som zostavil na základe 20-ročných skúseností s programovaním a jej obsah bude mať zásadný vplyv na tvoje ohodnotenie na trhu práce.

Miliónové straty

O dobrých praktikách sme sa už bavili v kurze Základná konštrukcia jazyka JavaScript a vieme, že neprehľadné programy nie sú vôbec žiadna malichernosť. Sú totiž:

• Nezrozumiteľné pre ostatných - Keď tím 5 programátorov, každý s platom 100.000 Sk mesačne, strávi 20% pracovnej doby lúštením kódu, stojí to ročne 1.2 milióna Sk!
• Náchylné k chybám - Tržby aj malých e-shopov sú mesačne obvykle v miliónoch korún, 1 deň nefunkčnosti teda stoja majiteľa stovky tisíc Sk, dodávateľovi hrozia nemalé zmluvné pokuty.
• Prakticky nerozšíriteľné - V súčasnej funkčnosti sa už nikto nevyzná a nemožno ju rozšíriť. Programátorský tím o niekoľkých ľuďoch musí vytvoriť aplikáciu znova, sme opäť v miliónoch Sk.
• Netestovateľné, nezabezpečené a takto by sme mohli pokračovať.

Ako správne pomenovávať triedy, atribúty a metódy?

Vieme vytvárať množstvo nových objektových konštrukcií, v programoch nám vzniká množstvo nových identifikátorov (mien). V dnešnej lekcii sa budeme zaoberať tým, ako "objektové súčiastky" našich aplikácií správne pomenovať, aby boli prehľadné.

Motivačný príklad

K doktorovi príde pacient a hovorí mu, že má problém so svojím orgánom Presouvat. Nefunguje mu bota. Pacient sa zdá byť nejaký popletený a doktorovi trvá pomerne dlho, kým z neho dostane, že ho pichá v päte a preto si nemôže obuť ani topánku. Keď konečne vypustí pacienta z ordinácie, zistí, že bol súčasťou skupiny a takých ich tam ešte čaká niekoľko desiatok.

Pozrime sa ešte na druhý príbeh. Programátorovi pridelí program, ktorý spadne s chybou v triede PresouvatData, metóda data(). Program sa zdá byť nejaký popletený a programátorovi trvá dlho, než zistí, že ide o triedu importujúcu dáta z externej zálohy a že sa prvýkrát musí ručne zavolať metóda pracuj(), ktorá import vykoná. Keď chybu konečne opraví, objaví sa ďalšia a zistí, že v programe je niekoľko desiatok tried a metód, z ktorých názvu vôbec nespozná, čo robia.

Určite vidíme paralelu týchto dvoch príbehov. Zatiaľ čo u ľudského tela by nás asi ťažko napadlo hovoriť o orgáne "presúvať" a funkciu "topánka", v programoch bohužiaľ nie je taký problém naraziť na objekty pomenované ako deje a funkcie pomenované ako veci, aj keď je princíp úplne rovnaký. Niet divu, že si Indescriptive naming vyslúžilo svoje miesto v šestici najhorších programátorských praktík STUPID.

Pomenovanie tried

Triedy definujú objekty, z ktorých je aplikácia zložená. Z toho vyplýva niekoľko triviálnych pravidiel. Názvy tried:

• sú podstatné mená! - Jedná sa o jednotlivé počítateľné objekty bez ohľadu na to, koľko objektov od triedy potom vytvoríme.
• nie sú názvy dejov - Ide o objekty (veci). Triedy teda nemôžeme nazvať napr. PraceSeSouborem alebo Vypisovani, ale napr. SpravceSouboru alebo Vypisovac (alebo ešte lepšie UzivatelskeRozhrani, pretože zriedka kedy tvoríme celú triedu len na vypísanie niečoho).
• začínajú s veľkým písmenom - Každé ďalšie slovo má veľké písmeno (notácia) PascalCase. Je tak vidieť, že ide o všeobecnú triedu a nie o jej konkrétnu inštanciu.
• sú pomenované podľa toho, akú súčasť programu reprezentujú, čo nemusí byť vždy rovnaké, ako to, čo vo vnútri robia.

class employee {
class Employees {
class Invoiceitem {
class WorkingWithFile {
class Print {
class EnteringData {

class Employee {
class EmployeeManager {
class InvoiceItem {
class FileDatabase {
class UserInterface {

Arrays.sort(zamestnanci);

zamestnanci.sort()

class CarsManager {
class PathFile {
class RunTasks {

class CarManager {
class FilePath {
class TaskRunner {

this._Name = "";
this._send = false;
this._phonenumbers = [];
this._tlačítko = new Button();
this._uzivatelAddress = [];

this._name = "";
this._sent = false;
this._phoneNumbers = [];
this._tlacitko = new Button(); // ideálně _button
this._userAddresses = [];

printing(employee) {
getEnabled() {
_data() {
work() {

printInfo(employee) {
isEnabled() {
_generateData() {
importBackup() {

importData(disableForeignKeys = false) {

importData(enableForeignKeys = true) {

V nasledujúcom kvíze, Kvíz - Funkcia fetch(), reflexie, iterátory a generátory, si vyskúšame nadobudnuté skúsenosti z predchádzajúcich lekcií.