JavaScript A.K.A gjuhë programimi në ueb është një gjuhë e fuqishme programimi. Veçoritë si funksionojnë si objekte të klasit të parë, mbyllja janë qytetarë të klasit të parë të gjuhës kur gjuhët si Java po përpiqen t'i ofrojnë këto veçori.
Është e vërtetë që ka disa sjellje të çuditshme si p.sh. [] + 0 = '0' në gjuhë, por fokusi duhet në pjesët e mira të gjuhës.

Në këtë artikull, unë do të prezantoj disa modele kodimi duke përdorur JavaScript, të cilat më duken efektive. Dikush mund të mos pajtohet domosdoshmërisht me të gjitha modelet, sepse një model është një lloj preference, dhe preferenca e të gjithëve është e ndryshme.

Kthimet e hershme

Le të shohim një shembull të kësaj.

function calculateTotal(priceArray) {
  let price = 0;
  if(!Array.isArray(priceArray) || priceArray.length === 0) 
     return price; // Also possible to return an error
  if(typeof priceArray[0] !== 'number') return price;
  priceArray.forEach((value) => {
      price += value;
  });
  return price;
}

Në funksion, kontrolli i tipit bëhet në fillim të funksionit dhe nëse parametri nuk është i llojit të Array ose nëse është një grup bosh, kthehet 0. Kontrolli i dytë është kontrolli i tipit për elementet në grup (Ky nuk është një kontroll i sofistikuar i tipit, por është vendosur aty për të shpjeguar këtë model) dhe nëse kjo dështon, 0 kthehet. Këtu, kodi i synuar lejohet të ekzekutohet vetëm nëse kontrollet kalohen. (Vini re se mund të ketë më shumë deklarata kthimi në varësi të kompleksitetit të funksionit)

Në këtë model, në fillim të një funksioni, ka një ose më shumë kontrolle të kushtëzuara dhe deklarata kthimi të lidhura. Kodi i synuar do të ekzekutohet nëse të gjitha kontrollet janë kaluar. Këto kontrolle mund të përfshijnë kontrolle tipi, kontrolle të pavlefshme, kontrolle të vlerës, çdo kontroll të lidhur me logjikën e biznesit, … etj.

Disa preferojnë të kenë vetëm një deklaratë kthimi në një funksion, por unë besoj se kjo është efektive dhe më e lexueshme.

Parametri i një objekti të vetëm

function doSomething(id, name, age, address);
function doSomething({ id, name, age, address }); // Preferred way

Me një shikim, dy deklaratat e mësipërme të funksionit duken të njëjta. I vetmi ndryshim është se funksioni i dytë i ka kaluar vetëm një parametër. Ky ndryshim mund të ndikojë shumë në kodin tuaj. thuaj,

  1. Nëse ju duhet të kaloni më shumë parametra, në funksionin e parë do t'i shtoni më shumë parametra funksionit, por në të dytin do të shtoni vetëm fusha të reja në Objektin që është kalohet si parametër i parë. Le të marrim një moment për të kujtuar SonarQube i cili pret të ulërs ndaj jush kur numërimi i parametrave kalon 7.
  2. Supozoni se nuk pritet t'i kaloni të gjitha vlerat funksionit. Me cilën nga sa më poshtë mendoni se është e lehtë të punohet?
doSomething(1, undefined, undefined, '123#, street');
or
doSomething({ id: 1, address: '123#, street' });

&& dhe || Shënime stenografike

Këto janë të preferuarat e mia kur punoj me JS. Me && mund të vendosni një roje ose parakusht përpara se të ekzekutoni një deklaratë dhe me || mund të paracaktoni diçka nëse vlera e kërkuar nuk është e përcaktuar.

const id = person && person.id; 
// set id to person object's id only if person is defined
const port = process.env.PORT || 5000;
// set port to 5000 if PORT is not defined in PORT

Me JS moderne mund të hiqni nevojën për && me operatorin ?

const id = person?.id; 
// id will be retrieved if person is defined only, easy right!

Shkatërrimi me një objekt të paracaktuar

Kontrolloni kodin e mëposhtëm,

const { id, name, age, address } = person;

Nëse person është null/undefined, do të kalojmë drejt e në një përjashtim Runtime. Me pak ndihmë nga shënimi stenografi i paraqitur më sipër, ne mund ta zbusim këtë lehtësisht.

const { id, name, age, address } = person || {};

Ju lutemi, vini re se kjo është vetëm një pjesë e zgjidhjes, duhet të siguroheni që vendet id, name, ... që po përdoren të kenë kontrolle të sakta null për të shmangur përjashtimet në kohën e ekzekutimit.
Shmangni kodin si ky.

const const { id, name, age, address } = person || {};
...
const lowerCaseName = name.toLowerCase();
// if person is null, this will give an error

Ky model funksionon edhe me vargje, më poshtë është një shembull.

const [head, ...rest] = arr || [];

Shënim: Mund të përdorni gjithmonë një deklaratë Kthimi i hershëm për t'u shkëputur nga funksioni kur parametrat e kërkuar janë të papërcaktuar.

Funksioni i zgjidhësit Premtimi me një linjë

Ky është model shumë interesant, le të shohim një shembull

// code snippet - 1 
let error, data;
try {
    data = await fetchDataOverNetwork();
 } catch(err) {
    error = err;
}

Tani kodi me funksionin e zgjidhjes së premtimit me një rresht,

// code snippet - 2
const [error, data] = await promiseResolver(fetchDataOverNetwork());

Nuk kemi nevojë për provo/kap këtu. Nëse ka një gabim error do të përmbajë objektin e gabimit përndryshe data do të përmbajë të dhënat që vijnë nga funksioni fetchDataOverNetwork.

Ky model është shumë i dobishëm nëse keni shumë funksione asinkronike të ekzekutuara njëri pas tjetrit. Arsyeja është se kur ka ndodhur një gabim dhe ekzekutohet blloku catch, mund të kemi nevojë për shumë kod brenda bllokut catch për të identifikuar burimin e gabimit dhe për të bërë të nevojshmen.

Ky model do të heqë qafe nevojën për logjikë të panevojshme brenda bllokut catch dhe ju lejon të shkruani kod të lexueshëm. E drejta interesante!

Le të shohim funksionin promiseResolver

const promiseResolver = (promise) => {
      if (promise instanceof Promise)
              return promise
                  .then((value) => [null, value])
                  .catch((error) => [error, null]);
      return [null, null];
}

Kontrolloni këtë lidhje për të identifikuar rastet e përdorimit të botës reale.

Përmendje të nderuara: IIFE

Shprehja e funksionit të thirrur menjëherë ose shkurt IIFE duket kështu

(function() {
  console.log('Hello world, I will be invoked immediately');
})();

Pse duhet të përcaktojmë një funksion që ekzekutohet menjëherë? Ju inkurajoj të lexoni këtë "artikull".

IIFE-të janë shumë të dobishme në ekzekutimin e kodit asinkronik të funksioneve.

(async function(){
     const result = await fnc();// fnc returns a promise
})();

Dhe kjo eshte e gjitha!

Ndani modelin tuaj të preferuar të kodimit.