Krefjast JS er skilvirk leið til að bæta hraða og gæði JavaScript kóða þinn, auk þess sem það gerir það miklu meira læsilegt og auðveldara að viðhalda.

Í þessari grein mun ég kynna þér að krefjast js og hvernig þú getur byrjað að nota það. Við munum fara í gegnum þarfnast skrár og skilgreina einingu og jafnvel snerta hagræðingu.

Einföld hugtök require.js er handritaljós sem gerir þér kleift að miðla JavaScript kóða þínum í skrár og einingar þannig að stjórna ósjálfstæði hvers líkans.

Krefjast skrár

Til að byrja að vinna með RequireJS og skilgreininguna í ósamstilltu einingunni (AMD) verðum við fyrst sækja það, þá hlekkur til requ.js skrá í höfuðið á skjalinu okkar eins og svo:

Þú gætir verið að velta því fyrir sér hvað þessi aðalatriði eru, vel með því að nota RequireJS þýðir að þegar þú kallar þarf í höfuð skjalsins þíns, þá tengir þú einnig við aðalskrá JavaScript forritsins, þá er aðalatriðið tengt við Helstu JavaScript skrá fyrir umsókn þína, í þessu tilfelli main.js. (Athugaðu að RequireJS bætir sjálfkrafa .js við enda filename.)

Í þessari main.js skrá verður þú að setja stillinguna fyrir RequireJS, hlaða inn einingarnar og skilgreina grunnslóð til notkunar þegar þörf er á skrám.

Krefjast virka

RequireJS notar einfalda kröfu virka til að hlaða inn forskriftir, í þessu dæmi Krefjast JS álag jQuery:

require(["jquery"], function($) {return $(‘#mydiv”).html(‘Hello this is RequireJS talking”);});

Einn af bestu hlutunum um RequireJS er að það er mjög læsilegt. Ef þú lítur á þessi blokk af kóða sem þú munt sjá að fyrsta krafist grípur skrána með nafni jquery.js og það fer fram með nafnlausri virkni með jQuery's $ sem breytu , þegar það er gert ertu frjálst að nota alla JQuery kóða sem þú vilt.

Nú hefurðu venjulega ekki jQuery bókasafnið í skrá sem heitir jquery.js, eins og með flestar viðbætur og ramma, veljum við venjulega að hlaða þá frá GitHub eða Google CDN okkar og þar af leiðandi þurfum við að stilla slóðirnar svo að þeir benda á réttan stað:

require.config({paths: {"jquery": "https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"}});

Þetta þýðir að þú getur krafist jQuery í gegnum Google og notaðu það án vandamála. (Athugaðu að ég hef notað nafnið "jquery" í þessu dæmi, en þú getur hringt í það sem þú vilt.)

Skilgreina mát

Notkun AMD mynstur þýðir að kóðinn okkar er hægt að skipuleggja í einingar; Þessar gerðir eru bara hluti af kóða sem gera eitthvað í umsókn okkar. Þú getur sett tvær línur af kóða í einingu eða 100, það veltur bara á því sem þú vilt að þessi eining sé að gera.

Til að skilgreina einingu notar við kóða eins og þetta:

define(function () {function add (x,y) {return x + y;}});

Í þessu dæmi hefur ég búið til einfaldan viðbótaraðgerð án ósjálfstæðis, en ef þessi aðgerð þurfti jQuery að virka almennilega myndi skilgreina aðgerðin vera byggð á eftirfarandi hátt:

define([‘jquery’], function () {function place(mydiv) {return $(mydiv).html(‘My Sample Text’);}});

Notkun þessa setningafræði segir að JavaScript sé að fara að fá jQuery fyrst og síðan keyra kóðann þannig að jQuery sé tiltæk þegar þörf er á. Við getum líka notað þetta í einingum sem við höfum skrifað í JavaScript skrám, það er ekki takmörkuð við ramma eða viðbætur.

Hagræðingu

Eins og þú getur séð RequireJS er frábært tól til að skipuleggja skrárnar þínar í einingar og aðeins hleðsla það sem þú þarft. The hæðir eru að of margar JavaScript skrár leiða til lélegrar álagstímabila, þess vegna þurfa RequireJS að innihalda optimizer að safna gögnum úr öllum skrám og setja það í eina lágmarka skrá.

Allt í allt, RequireJS er ein besta leiðin til að skipuleggja og fínstilla JavaScript fyrir nútíma vefurinn.

Hefur þú notað RequireJS í verkefni? Hefur það bætt vinnuafl þitt? Láttu okkur vita í athugasemdunum.

Valin mynd / smámynd, kassa mynd um Shutterstock.