Uchambuzi wa aina tuli katika JavaScript. Hebu tujaribu kichanganuzi cha Flow kutoka Facebook. Usalama wa JavaScript au jinsi ya kuandika msimbo salama katika JS Analytics na zana za uboreshaji wa msimbo

Sio kila safu ya nambari yangu inayogeuka kuwa nzuri mara ya kwanza. Naam, katika baadhi ya matukio ... Wakati mwingine ... Sawa - karibu kamwe. Ukweli ni kwamba mimi hutumia wakati mwingi kusahihisha makosa yangu ya kijinga kuliko vile ningependa. Hii ndio sababu mimi hutumia vichanganuzi tuli katika karibu kila faili ya JavaScript ninayoandika.

Wachanganuzi tuli huangalia msimbo wako na kupata hitilafu ndani yake kabla ya kuiendesha. Hufanya ukaguzi rahisi, kama vile kuangalia sintaksia ya utekelezaji (kama vile kama kuna vichupo badala ya nafasi) na ukaguzi wa kimataifa zaidi, kama vile kuangalia kwamba utendakazi si changamano sana. Wachambuzi tuli pia hutafuta makosa ambayo hayawezi kupatikana wakati wa majaribio, kwa mfano, == badala ya ===.

Katika miradi mikubwa na unapofanya kazi katika timu kubwa, unaweza kutumia usaidizi mdogo katika kutafuta hitilafu hizo "rahisi" ambazo kwa kweli zinageuka kuwa sio rahisi kama zinavyoonekana.

JSLint, JSHnt na Kikusanyaji cha Kufunga

Kuna chaguo tatu kuu za vichanganuzi tuli vya JavaScript: JSLint, JSHint na Kikusanyaji cha Kufunga.

JSLint ilikuwa kichanganuzi tuli cha kwanza cha JavaScript. Unaweza kuiendesha kwenye tovuti rasmi au kutumia mojawapo ya viongezi vinavyoweza kuendeshwa katika faili za ndani. JSLint hupata makosa mengi muhimu, lakini ni ngumu sana. Hapa kuna mfano wazi:

Var s = "mystring"; kwa (var i = 0; i< s.length; i++) { console.log(s.charAt(i)); }

JSLint inaonyesha makosa mawili katika nambari hii:

Isiyotarajiwa "++". Hamisha matamko ya "var" hadi juu ya chaguo la kukokotoa.

Shida ya kwanza ni kufafanua kutofautisha i katika hali ya kitanzi. JSLint pia haikubali opereta ++ mwishoni mwa ufafanuzi wa kitanzi. Anataka nambari ionekane kama hii:

Var s = "mystring"; var i; kwa (i = 0; i< s.length; i = i + 1) { console.log(s.charAt(i)); }

Ninawashukuru waundaji wa JSLint, lakini kwa maoni yangu hii ni kupita kiasi. Ilionekana kuwa ngumu kwa Anton Kovalev pia, kwa hivyo aliunda JSHint.

JSHint inafanya kazi kwa njia sawa na JSLint, lakini imeandikwa kwa kuongeza Node.js na kwa hivyo ni rahisi zaidi. JSHnt inajumuisha idadi kubwa ya chaguo, kukuruhusu kufanya ukaguzi maalum kwa kuandika jenereta yako mwenyewe ya ripoti.
Unaweza kuendesha JSHnt kutoka kwa wavuti, lakini katika hali nyingi ni bora kusakinisha JSHint kama zana ya mstari wa amri ya ndani kwa kutumia Node.js. Mara tu ukiwa na JSHnt iliyosanikishwa, unaweza kuiendesha kwenye faili zako kwa amri kama hii:

Jshint test.js

JSHint pia inajumuisha programu-jalizi za wahariri wa maandishi maarufu, kwa hivyo unaweza kuiendesha unapoandika msimbo.

CLOSURE COMPILER

Kikusanyaji cha Kufunga cha Google ni aina tofauti kabisa ya programu. Kama jina lake linavyoonyesha, sio tu programu ya uthibitishaji, bali pia mkusanyaji. Imeandikwa katika Java na inategemea kichanganuzi cha Rhino cha Mozilla. Kikusanyaji cha Kufunga ni pamoja na hali rahisi ya kukagua msimbo msingi, na hali ngumu zaidi zinazoruhusu ukaguzi wa ziada na utekelezaji wa ufafanuzi mahususi wa mwonekano.

Mkusanyaji wa Kufunga huripoti hitilafu katika msimbo wa JavaScript, lakini pia hutoa matoleo madogo ya JavaScript. Mkusanyaji huondoa nafasi nyeupe, maoni, na vigeuzo visivyotumika na kurahisisha misemo mirefu, na kufanya hati fupi iwezekanavyo.

Google imefanya toleo rahisi sana la kikusanyaji kupatikana mtandaoni, lakini kuna uwezekano utataka kupakua Kikusanyaji cha Kufunga na kuiendesha ndani ya nchi.

Mkusanyaji wa Kufunga, baada ya kuangalia msimbo, hutoa orodha ya faili kwenye faili moja iliyopunguzwa. Kwa hivyo unaweza kuiendesha kwa kupakua faili ya compiler.jar.

Java -jar compiler.jar --js_output_file compress.js --js test1.js --js test2.js

Kuchagua programu sahihi ya uthibitishaji

Katika miradi yangu mimi huchanganya Mkusanyaji wa Kufunga na JSHint. Mkusanyaji wa Kufunga hufanya uboreshaji na ukaguzi wa kimsingi, wakati JSHint hufanya uchanganuzi changamano zaidi wa nambari. Programu hizi mbili hufanya kazi vizuri pamoja na kila moja inashughulikia maeneo ambayo mwingine hawezi. Kwa kuongeza, naweza kutumia uwezo wa upanuzi wa JSHnt kuandika vidhibiti maalum. Programu moja ya kawaida niliyoandika hukagua vitendaji fulani ambavyo sihitaji, kama vile vitendaji vya kupiga simu ambavyo havifai kuwa katika mradi wangu.

Sasa kwa kuwa tumeangalia programu chache za kuangalia, wacha tuangalie nambari mbaya. Kila moja ya mifano hii sita inawakilisha msimbo ambao haufai kuandikwa na hali ambazo wakaguzi wa misimbo wanaweza kukuokoa.

Nakala hii hutumia JSHnt kwa mifano mingi, lakini Kikusanyaji cha Kufunga Kawaida hutoa maonyo sawa.

== au ===?

JavaScript ni lugha iliyochapwa kwa nguvu. Sio lazima kufafanua aina unapoandika nambari, lakini zinapatikana wakati wa kuanza.

JavaScript inatoa waendeshaji linganishi wawili ili kuendesha aina hizi zinazobadilika: == na ===. Hebu tuangalie hili kwa mfano.

Var n = 123; var s = "123"; ikiwa (n == s) ( tahadhari("Vigezo ni sawa"); ) ikiwa (n === s) ( tahadhari("Vigezo vinafanana"); )

Opereta wa kulinganisha == ni mabaki ya lugha C, ambayo JavaScript ina mizizi yake. Kuitumia karibu kila wakati ni kosa: kulinganisha thamani kando na aina si mara chache sana msanidi anataka kufanya. Kwa kweli, nambari "mia moja ishirini na tatu" ni tofauti na mstari "moja mbili tatu." Taarifa hizi ni rahisi kukosewa na hata rahisi kusoma vibaya. Jaribu nambari hii na JSHnt na utapata yafuatayo:

Test.js: mstari wa 9, col 12, Inatarajiwa "===" na badala yake ikaona "==".

Vigezo visivyofafanuliwa na ufafanuzi wa marehemu

Wacha tuanze na nambari rahisi:

Mtihani wa kazi() ( var myVar = "Hujambo, Ulimwengu"; console.log(myvar); )

Je, unaona mdudu? Ninafanya kosa hili kila wakati. Endesha nambari hii na utapata hitilafu:

Hitilafu ya Marejeleo: myvar haijafafanuliwa

Wacha tufanye shida kuwa ngumu zaidi:

Function test() ( myVar = "Hujambo, Ulimwengu"; console.log(myVar); )

Endesha nambari hii na utapata yafuatayo:

Salamu, Dunia

Mfano huu wa pili unafanya kazi, lakini una athari zisizotarajiwa sana. Sheria za kufafanua vigeu vya JavaScript na wigo zinachanganya vyema zaidi. Katika kesi ya kwanza, JSHnt itaripoti yafuatayo:

Test.js: mstari wa 3, col 17, "myvar" haijafafanuliwa.

Katika kesi ya pili, ataripoti hii:

Test.js: mstari wa 2, col 5, "myVar" haijafafanuliwa. test.js: mstari wa 3, col 17, "myVar" haijafafanuliwa.

Mfano wa kwanza utakusaidia kuepuka kosa la wakati wa kukimbia. Huna haja ya kujaribu programu yako - JSHint itakutafuta hitilafu. Mfano wa pili ni mbaya zaidi, kwani kama matokeo ya upimaji hautapata mdudu.

Shida katika mfano wa pili ni ya hila na ngumu. Tofauti ya myVar sasa imetoweka kutoka kwa wigo wake na kusonga hadi wigo wa ulimwengu. Hii ina maana kwamba itakuwepo na kuwa na thamani Hello, World hata baada ya kipengele cha jaribio kuendeshwa. Hii inaitwa uchafuzi wa upeo wa kimataifa.

Tofauti ya myVar itakuwepo kwa kila kitendakazi kingine ambacho kinaendeshwa baada ya kazi ya jaribio. Endesha nambari ifuatayo baada ya kuendesha kazi ya jaribio:

Console.log("myVar: " + myVar);

Bado utapokea Hello, World. Tofauti ya myVar itaning'inia karibu na nambari yako yote kama mchoro unaoongoza kwa hitilafu tata ambazo utakuwa ukitafuta usiku kucha kabla ya kutolewa, yote kwa sababu umesahau kujumuisha var.

Na mwalimu wa Netology, aliandika mfululizo wa makala kuhusu EcmaScript6 kwa blogu. Katika sehemu ya kwanza, tutaangalia uchanganuzi wa msimbo unaobadilika katika EcmaScript kwa kutumia Iroh.js kwa kutumia mifano.

Uchambuzi wa msimbo thabiti na unaobadilika

Zana za kuchanganua msimbo ni zana muhimu ambayo hukuruhusu kugundua na kutambua makosa na dhana katika msimbo wako. Uchambuzi wa msimbo unaweza kuwa tuli au unaobadilika. Katika kesi ya kwanza, msimbo wa chanzo huchanganuliwa na kuchambuliwa bila kuitekeleza; katika pili, utekelezaji hutokea katika mazingira yaliyodhibitiwa ya sandbox, ambayo hutoa habari juu ya vipengele vya programu wakati wa utekelezaji wake.

hitimisho

Iroh.js ni zana yenye nguvu na inayofanya kazi kwa uchanganuzi thabiti wa msimbo katika EcmaScript. Zana hii inaweza kutumika kwa uchanganuzi wa msimbo, ikiwa ni pamoja na kuunda grafu ya simu, kuashiria aina na thamani halisi katika vigeu na vitu, na kwa urekebishaji wa msimbo wa hewani, ikijumuisha masahihisho ya msimbo kulingana na tukio.

Uchanganuzi wa nguvu ni njia changamano, lakini kwa EcmaScript, kutokana na uchapaji wa bata, uwepo wa vitu vya mwenyeji na vitendaji asili ambavyo hukuruhusu kubadilisha tabia ya msimbo unaporuka, hii ndiyo njia pekee ya kuchambua na kutatua msimbo wakati wa utekelezaji. Iroh.js pia inaweza kutumia msimbo kuunda majaribio ya utendakazi bila kuhitaji kuirekebisha kwanza ili kusafirisha thamani.

Ni kifurushi cha kawaida ambacho huunda grafu ya utegemezi na moduli zote za programu ya JavaScript. Vifurushi vya Webpack huweka moduli kwenye kifurushi kimoja au zaidi cha kupakiwa na kivinjari. Zaidi ya hayo, Webpack inaweza kutumika kama kiendesha kazi, kwani inachanganua utegemezi kati ya moduli na kutoa mali. Unaweza kujua zaidi kuhusu kutumia Webpack katika miradi yako katika yetu.

Grunt ni kiendesha kazi kilichoundwa ili kugeuza kiotomatiki kazi zinazorudiwa na kuchukua muda. Kuna idadi kubwa ya programu-jalizi (zaidi ya 6000) katika mfumo wake wa ikolojia wa programu.

Gulp sio tu meneja mwingine wa kazi, lakini chombo kilicho na mbinu ya kuvutia: inafafanua kazi katika JavaScript kama kazi, GUl pia huendesha kazi zenye uchungu, ikitoa mfumo mkubwa wa ikolojia wa programu (zaidi ya programu-jalizi 2700), na hutoa uwazi na udhibiti bora zaidi. mchakato.

Kivinjari huruhusu wasanidi programu kutumia moduli za mtindo wa NodeJS katika vivinjari. Unafafanua tegemezi, na Vivinjari vifurushi vyote kuwa faili safi ya JS.

Brunch.io ni zana ambayo mawazo yake makuu ni kasi na urahisi. Inakuja na usanidi rahisi na nyaraka za kina ili kukufanya ufanye kazi haraka. Brunch hutengeneza kiotomatiki ramani ya faili za JS pamoja na laha za mtindo wa CSS, hurahisisha utatuzi wa upande wa mteja.

Yeoman ni zana ya ulimwengu wote ambayo inaweza kutumika karibu na lugha yoyote ya programu (JavaScript, Python, C #, Java na zingine). Mfumo huu wa msingi wa kutengeneza msimbo wenye mfumo ikolojia tajiri wa programu (zaidi ya programu-jalizi 6,200) hutumiwa kwa kutengeneza programu za wavuti. Shukrani kwa Yeoman, unaweza kuunda miradi mipya kwa haraka bila kusahau kuhusu kudumisha na kuboresha zilizopo.

IDE na wahariri wa kanuni

Swagger ni seti ya sheria na zana za kuelezea API. Chombo ni matumizi ya lugha inayojitegemea. Hii inamaanisha kuwa Swagger huunda hati wazi ambazo zinaweza kusomeka na wanadamu na mashine, kukuruhusu kugeuza michakato inayotegemea API kiotomatiki.
JSDoc ni seti ya zana zinazozalisha kiotomatiki hati za maandishi ya kurasa nyingi (HTML, JSON, XML, n.k.) kutoka kwa maoni kutoka kwa msimbo wa chanzo wa JavaScript. Programu hii inaweza kuwa muhimu kwa kusimamia miradi mikubwa.
jGrouseDoc (jGD) ni zana inayoweza kunyumbulika na huria ambayo inaruhusu wasanidi programu kutengeneza API kutoka kwa maoni kutoka kwa msimbo wa chanzo cha JavaScript. Nyaraka za jGD sio tu vigezo na kazi, lakini pia nafasi za majina, violesura, vifurushi na vipengele vingine.
YUIDoc ni programu iliyoandikwa katika NodeJS. Inatumia syntax sawa na ile inayotumika katika Javadoc na Doxygen. Zana hii pia inajivunia usaidizi wa uhakiki wa wakati halisi, usaidizi wa lugha ya hali ya juu, na uwekaji alama wa hali ya juu.
Docco ni zana ya bure ya uhifadhi iliyoandikwa katika maandishi ya CoffeeScript. Inaunda hati ya HTML ili kuonyesha maoni yako yaliyojumuishwa na msimbo. Ikumbukwe kwamba chombo hakiunga mkono JavaScript tu, bali pia lugha nyingine. Kwa mfano, Python, Ruby, Clojure na wengine.

Zana za Kujaribu

Zana za kujaribu JavaScript zimeundwa ili kupata hitilafu wakati wa uundaji ili kuepuka hitilafu za mtumiaji katika siku zijazo. Kadiri ugumu wa programu za watumiaji unavyoongezeka, majaribio ya kiotomatiki sio tu kwamba yanaboresha utendakazi wa programu bali pia husaidia makampuni kuokoa bajeti.

Jasmine ni mfumo wa BDD (Ukuzaji unaoendeshwa na tabia) unaotumika kujaribu msimbo wa JS. Haina utegemezi wa nje na hauitaji DOM kuendesha. Jasmine ina sintaksia safi na inayoeleweka ambayo hurahisisha upimaji. Mfumo pia unaweza kutumika kujaribu nambari ya Python na Ruby.
Mocha ni mfumo wa majaribio unaofanya kazi unaoendesha Node.js kwenye kivinjari. Huendesha majaribio kwa mpangilio ili kutoa ripoti inayoweza kunyumbulika na sahihi, na kufanya majaribio yasiyolingana kuwa ya kufurahisha na rahisi. Mara nyingi Mocha hutumiwa kwa kushirikiana na Chai ili kuthibitisha matokeo ya mtihani.
PhantomJS mara nyingi hutumiwa kwa majaribio ya mwisho na majaribio ya kitengo. Ikizingatiwa kuwa hii ni aina ya WebKit isiyo na kichwa, hati huendesha haraka zaidi. Pia inajumuisha usaidizi uliojengwa ndani kwa viwango mbalimbali vya wavuti. Kwa mfano, viteuzi vya JSON, Canvas, DOM, SVG na CSS.
Protractor ni mfumo wa majaribio wa mwisho hadi mwisho ulioandikwa katika Node.js kwa ajili ya majaribio ya AngularJS na programu za Angular. Ilijengwa juu ya WebDriverJS na inathibitisha programu kama mtumiaji wa mwisho kwa kutumia viendeshi maalum na matukio yaliyojumuishwa.

Zana za kurekebisha hitilafu

Msimbo wa utatuzi ni mchakato unaohitaji nguvu kazi nyingi na unaotumia wakati kwa wasanidi wa JavaScript. Zana za utatuzi wa msimbo zitakuwa muhimu sana wakati wa kufanya kazi na maelfu ya mistari ya msimbo. Zana nyingi za utatuzi hutoa matokeo sahihi kabisa.

Kitatuzi cha JavaScript ni zana kutoka kwa Mtandao wa Wasanidi Programu wa Mozilla (MDN) ambayo inaweza kutumika kama programu ya wavuti inayojitegemea kutatua msimbo kwenye vivinjari tofauti. Firefox inatoa utendaji wa ndani na wa mbali, pamoja na uwezo wa kutatua msimbo kwenye kifaa cha Android kwa kutumia Firefox kwa Android.
Zana za Usanidi wa Chrome ni seti ya zana zinazojumuisha huduma kadhaa za kutatua msimbo wa JavaScript, kuhariri CSS na utendakazi wa programu ya majaribio.
ng-inspector ni kiendelezi cha kivinjari ambacho kimeundwa kusaidia wasanidi programu kuandika, kuelewa na kutatua programu za AngularJS. Huduma huja na masasisho ya wakati halisi, mwangaza wa DOM, ufikiaji wa moja kwa moja kwa maeneo, miundo na vipengele vingine vya programu.
Augury ni kiendelezi cha kivinjari cha Google Chrome na utatuzi wa programu ya Angular 2. Inaruhusu wasanidi programu wa Angular 2 kuchanganua moja kwa moja muundo wa programu na sifa za utendakazi, na pia inaruhusu ugunduzi wa mabadiliko.

Vyombo vya Usalama

Snyk ni zana ya kibiashara ya kugundua, kurekebisha, na kuzuia udhaifu unaojulikana katika programu za JavaScript, Java, na Ruby. Huduma ina hifadhidata yake ya athari na inachukua data kutoka NSP na NIST NVD. Viraka na masasisho ambayo kampuni hutoa huruhusu wasanidi programu kuzuia hatari za usalama.
Mradi wa Usalama wa Nodi hutoa zana muhimu za kuchanganua utegemezi na kugundua uwezekano wa kuathirika. NSP hutumia hifadhidata yake yenyewe iliyojengwa kutoka kwa moduli za npm za kuchanganua, na pia data kutoka kwa hifadhidata za kawaida kama vile NIST NVD (Hifadhi ya Kitaifa ya Hatari). Zaidi ya hayo, NSP hutoa ushirikiano na GitHub Vuta Ombi na programu ya CI. Pia kuna ukaguzi wa wakati halisi, arifa na mapendekezo ya kuondoa udhaifu katika programu za Node.js.
RetireJS ni kikagua utegemezi wa chanzo huria. Inajumuisha vipengele mbalimbali kama vile kichanganuzi cha mstari wa amri, programu-jalizi ya Grunt, viendelezi vya Firefox na Chrome, programu-jalizi za Burp na OWASP ZAP. Retirejs hukusanya maelezo ya uwezekano wa kuathirika kutoka NIST NVD na vyanzo vingine kama vile vifuatiliaji vya masuala, blogu na orodha za wanaopokea barua pepe.
Gemnasium ni zana ya kibiashara yenye jaribio la bila malipo. Inaauni teknolojia na vifurushi mbalimbali, ikiwa ni pamoja na Ruby, PHP, Bower (JavaScript), Python, na npm (JavaScript). Zana ya usalama ya Gemnasium inakuja na vipengele muhimu kama vile masasisho ya kiotomatiki, arifa za wakati halisi, arifa za usalama na ushirikiano wa Slack.
OSSIndex hutumia mifumo ikolojia mbalimbali (Java, JavaScript na .NET/C#) na majukwaa mengi kama vile NuGet, npm, Bower, Chocolatey, Maven, Composer, Drupal na MSI. Hukusanya taarifa za uwezekano wa kuathiriwa kutoka Hifadhidata ya Kitaifa ya Hatari (NVD) na maoni. Pia huchakata taarifa kutoka kwa wanajamii.

Zana za uchanganuzi na uboreshaji wa msimbo

Ili kuangalia ubora wa msimbo, kwa kawaida tunageukia majaribio ya utendakazi na majaribio ya kitengo. Hata hivyo, kuna mbinu nyingine ambayo inaruhusu watengenezaji kuangalia ubora wa kanuni na kufuata kwake viwango vya usimbaji, yaani uchanganuzi wa kanuni tuli.

Programu ya kisasa sasa inaunganisha zana za kuchanganua msimbo tuli wakati wa uundaji ili kuhakikisha kuwa msimbo wa ubora wa chini haufanyiki katika uzalishaji.

JSLint ni zana ya uchanganuzi wa wavuti kwa kuangalia ubora wa msimbo wa JavaScript. Mara tu inapogundua tatizo kwenye chanzo, hurejesha ujumbe unaoelezea tatizo na takriban eneo lake katika msimbo. JSLint ina uwezo wa kuchanganua kanuni fulani za mitindo na kufichua makosa ya sintaksia na matatizo ya kimuundo.
JSHnt ni zana inayoweza kunyumbulika, inayoendeshwa na jamii ya kugundua hitilafu na matatizo yanayoweza kutokea katika msimbo wako wa JS, na pia ni uma wa JSLint. Kusudi kuu la zana hii ya kuchambua nambari tuli ni kusaidia wasanidi wa JavaScript wanaofanya kazi kwenye programu ngumu. Ina uwezo wa kugundua hitilafu za sintaksia, ubadilishaji wa aina ya data dhabiti, au utofauti unaokosekana. Hata hivyo, haiwezi kubainisha kasi au usahihi wa programu yako, wala haiwezi kuamua matatizo ya kumbukumbu katika programu yako. JSHnt ni uma wa JSLint.
ESLint ni chanzo huria cha programu za wavuti za JSX na JavaScript. Inakusaidia kutambua ruwaza zinazotiliwa shaka au kupata msimbo ambao haufuati mitindo mahususi. Hii inaruhusu wasanidi programu kugundua makosa katika msimbo wa JS bila kuitekeleza, na hivyo kuokoa muda. Kwa kuwa imeandikwa katika Node.js, zana hutoa wakati wa kukimbia haraka na usakinishaji usio na mshono kupitia npm.
Flow ni kidhibiti tuli cha msimbo cha JavaScript kilichoundwa na Facebook. Inatumia maelezo ya aina tuli kuangalia msimbo kwa makosa. Aina ni vigezo vilivyowekwa na wasanidi programu, na Flow hukagua programu yako kwa utiifu.

Zana za Kudhibiti Toleo

Katika miaka ya hivi karibuni, Git imekuwa mfumo wa udhibiti wa toleo unaotumiwa sana kwa miradi midogo na mikubwa. Huduma hii ya bure hutoa kasi bora na ufanisi. Umaarufu wake unatokana na mfumo wake uliosambazwa na aina tofauti za vidhibiti, pamoja na eneo la jukwaa ambapo matoleo yanaweza kutazamwa na kuumbizwa kabla tu ya ahadi kukamilika.
Zana ya Ubadilishaji au SVN imepata umaarufu mkubwa na bado inatumika sana katika miradi ya chanzo huria na majukwaa kama vile Python Apache au Ruby. CVS hii inakuja na vipengele vingi vinavyokuwezesha kusimamia shughuli mbalimbali (kubadilisha jina, nakala, kufuta, nk), kuunganisha, kufunga faili na mengi zaidi.

Zana za usimamizi wa kifurushi na utegemezi

Orodha ya zana bora zaidi za ukuzaji wa JavaScript inaweza kuendelea na kuendelea. Katika makala hii uliona tu zana maarufu na za kuaminika ambazo hutumika kama msingi wa bidhaa bora.

Katika miradi mikubwa na unapofanya kazi katika timu kubwa, unaweza kutumia usaidizi mdogo katika kutafuta hitilafu hizo "rahisi" ambazo kwa kweli zinageuka kuwa sio rahisi kama zinavyoonekana.

JSLint, JSHnt na Kikusanyaji cha Kufunga

Kuna chaguo tatu kuu za vichanganuzi tuli vya JavaScript: JSLint, JSHint na Kikusanyaji cha Kufunga.

var s = "mystring";
kwa (var i = 0; i< s.length; i++) {
console.log(s.charAt(i));
}

JSLint inaonyesha makosa mawili katika nambari hii:

Isiyotarajiwa "++".
Hamisha matamko ya "var" hadi juu ya chaguo la kukokotoa.

Shida ya kwanza ni kufafanua kutofautisha i katika hali ya kitanzi. JSLint pia haikubali opereta ++ mwishoni mwa ufafanuzi wa kitanzi. Anataka nambari ionekane kama hii:

var s = "mystring";
var i;
kwa (i = 0; i< s.length; i = i + 1) {
console.log(s.charAt(i));
}

Ninawashukuru waundaji wa JSLint, lakini kwa maoni yangu hii ni kupita kiasi. Ilionekana kuwa ngumu kwa Anton Kovalev pia, kwa hivyo aliunda JSHint.

Unaweza kuendesha JSHnt kutoka kwa wavuti, lakini katika hali nyingi ni bora kusakinisha JSHint kama zana ya mstari wa amri ya ndani kwa kutumia Node.js. Mara tu ukiwa na JSHnt iliyosanikishwa, unaweza kuiendesha kwenye faili zako kwa amri kama hii:

jshint test.js

JSHint pia inajumuisha programu-jalizi za wahariri wa maandishi maarufu, kwa hivyo unaweza kuiendesha unapoandika msimbo.

CLOSURE COMPILER

Google imefanya toleo rahisi sana la kikusanyaji kupatikana mtandaoni, lakini kuna uwezekano utataka kupakua Kikusanyaji cha Kufunga na kuiendesha ndani ya nchi.

Mkusanyaji wa Kufunga, baada ya kuangalia msimbo, hutoa orodha ya faili kwenye faili moja iliyopunguzwa. Kwa hivyo unaweza kuiendesha kwa kupakua faili ya compiler.jar.

java -jar compiler.jar --js_output_file compress.js --js test1.js --js test2.js

Kuchagua programu sahihi ya uthibitishaji

Nakala hii hutumia JSHnt kwa mifano mingi, lakini Kikusanyaji cha Kufunga Kawaida hutoa maonyo sawa.

== au ===?

JavaScript ni lugha iliyochapwa kwa nguvu. Sio lazima kufafanua aina unapoandika nambari, lakini zinapatikana wakati wa kuanza.

JavaScript inatoa waendeshaji linganishi wawili ili kuendesha aina hizi zinazobadilika: == na ===. Hebu tuangalie hili kwa mfano.

var n = 123;
var s = "123";

ikiwa (n == s) (
tahadhari ("Vigezo ni sawa");
}

ikiwa (n === s) (
tahadhari("Vigezo vinafanana");
}

Vigezo visivyofafanuliwa na ufafanuzi wa marehemu

Wacha tuanze na nambari rahisi:

mtihani wa kazi () (
var myVar = "Hujambo, Ulimwengu";
console.log(myvar);
}

Je, unaona mdudu? Ninafanya kosa hili kila wakati. Endesha nambari hii na utapata hitilafu:

Hitilafu ya Marejeleo: myvar haijafafanuliwa

Wacha tufanye shida kuwa ngumu zaidi:

mtihani wa kazi () (
myVar = "Habari, Ulimwengu";
console.log(myVar);
}

Endesha nambari hii na utapata yafuatayo:

Salamu, Dunia

Mfano huu wa pili unafanya kazi, lakini una athari zisizotarajiwa sana. Sheria za kufafanua vigeu vya JavaScript na wigo zinachanganya vyema zaidi. Katika kesi ya kwanza, JSHnt itaripoti yafuatayo:

test.js: mstari wa 3, col 17, "myvar" haijafafanuliwa.

Katika kesi ya pili, ataripoti hii:

test.js: mstari wa 2, col 5, "myVar" haijafafanuliwa.
test.js: mstari wa 3, col 17, "myVar" haijafafanuliwa.

Tofauti ya myVar itakuwepo kwa kila kitendakazi kingine ambacho kinaendeshwa baada ya kazi ya jaribio. Endesha nambari ifuatayo baada ya kuendesha kazi ya jaribio:

console.log("myVar: " + myVar);

Ingizo hili lilipitia huduma ya RSS ya Maandishi Kamili - ikiwa haya ni maudhui yako na "unayasoma kwenye tovuti ya mtu mwingine, tafadhali soma Maswali Yanayoulizwa Mara kwa Mara katika http://ift.tt/jcXqJW.

Kutengeneza programu salama katika JavaScript ni kazi ngumu sana. Lakini inawezekana kabisa. Katika makala ya leo tutaangalia vipengele vya JavaScript vinavyosababisha matatizo ya usalama na kuzungumza juu ya njia za kuepuka.

Kwa nini ni ngumu kuandika nambari salama katika JS?

Kwa hivyo, hapa kuna sababu 5 kwa nini ni ngumu kuandika nambari salama katika JS

Mkusanyaji haitasaidia

JavaScript ni lugha iliyotafsiriwa. Hii inamaanisha kuwa mkusanyaji hatalalamika juu ya kitu wakati wote, akikataa kufanya kazi na kukusukuma kurekebisha makosa na kuongeza nambari.

Kiini cha nguvu cha JavaScript

JavaScript ina nguvu, imechapwa hafifu, na hailandanishi. Na hizi zote ni ishara kwamba kupata shida ni rahisi.

1. Zana za lugha kama eval na ujumuishaji wa nambari ya mtu wa tatu kupitia src ya hati hukuruhusu kutekeleza mistari moja kwa moja wakati wa utekelezaji. Kwa hivyo, ni vigumu kutoa "dhamana tuli" kwamba msimbo utafanya kazi kwa njia fulani. Hii pia hufanya uchanganuzi wenye nguvu kuwa mgumu (tazama kazi ya kisayansi).

Kwa kutumia eval

2. Uchapaji dhaifu Hii inafanya kuwa vigumu kutumia mbinu za uchanganuzi tuli zilizowekwa, angalau ikilinganishwa na lugha zilizoandikwa kwa takwimu (kama vile Java).

3. Simu za nyuma zisizo sawa, wito ambao JavaScript inaruhusu kupitia mifumo kama setTimeout na XMLHttpRequest (AJAX hiyo hiyo maarufu), kulingana na takwimu, huficha makosa ya siri zaidi.

Sifa Njema za JS

Ni nini ambacho hakijaletwa kwenye JavaScript kwa miaka mingi! Hasa, ina prototypes, kazi za daraja la kwanza, na kufungwa. Zinaifanya lugha kuwa na nguvu zaidi na kuandika msimbo salama kuwa mgumu zaidi.

1. Mifano. Maana yao ni kwamba mipango imeandikwa kwa roho ya mbinu inayolenga kitu, lakini bila matumizi ya madarasa. Kwa mbinu hii, vitu vinarithi mali wanazohitaji moja kwa moja kutoka kwa vitu vingine (prototypes). Zaidi ya hayo, katika prototypes za JS zinaweza kufafanuliwa upya moja kwa moja wakati wa kukimbia. Na ikiwa ukiukwaji huu unatokea, basi athari huenea mara moja kwa vitu vyote vinavyorithi mali ya mfano uliopinduliwa.

Jinsi prototypes zinachakatwa

Ili kuwa sawa, ni lazima kusemwa kuwa madarasa pia yapo katika vipimo vipya vya ECMAScript.

2. Kazi za darasa la kwanza. JS ina muundo rahisi sana wa vitu na kazi. Sifa za kitu na thamani zake zinaweza kuundwa, kubadilishwa au kufutwa wakati wa utekelezaji, na zote zinaweza kufikiwa kupitia vitendakazi vya daraja la kwanza.

3. Kufungwa. Ukitangaza chaguo za kukokotoa ndani ya chaguo za kukokotoa nyingine, ya kwanza inaweza kufikia vigeuzo na hoja za mwisho. Aidha, vigezo hivi vinaendelea kuwepo na kubaki kupatikana kwa kazi ya ndani - hata baada ya kazi ya nje ambayo vigezo hivi vinafafanuliwa kukamilika.

Kwa sababu JavaScript inaweza kunyumbulika na inabadilika sana (angalia pointi 1 na 3), kubainisha seti ya sifa zote zinazopatikana za kitu wakati wa uchanganuzi tuli ni kazi isiyoweza kurekebishwa. Hata hivyo, watengenezaji wavuti kila mahali hutumia vipengele vinavyobadilika vya lugha, na ipasavyo, hawawezi kupuuzwa wakati wa kuchanganua msimbo. Vinginevyo, ni nini dhamana ya usalama?

Funga mwingiliano kati ya JavaScript na DOM

Hii ni muhimu ili kuhakikisha usasishaji "bila imefumwa" wa ukurasa wa wavuti, wakati wa utekelezaji. DOM, kama tunavyoijua, ni kielelezo cha kawaida, cha jukwaa- na kisichoegemea lugha cha kutoa hati za HTML na XML. DOM ina API yake ya kufanya kazi na hati iliyotolewa: kufikia, kusonga, na kusasisha hati iliyotolewa (maudhui yake, muundo, na mtindo). Mabadiliko ya DOM yanaweza kufanywa kwa nguvu kupitia JavaScript. Na mabadiliko haya yanaonyeshwa mara moja kwenye kivinjari.

Shukrani kwa DOM, kurasa za wavuti zilizopakiwa kwenye kivinjari zinaweza kusasishwa hatua kwa hatua data inapopakiwa kutoka kwa seva. Walakini, urahisishaji huu pia una upande wa chini: vipande vya msimbo ambavyo vinawajibika kwa mwingiliano wa nguvu kati ya JS na DOM huathirika sana na makosa.

Makosa ya kawaida katika programu za wavuti

Mwingiliano changamano wa matukio

JavaScript ni lugha inayoendeshwa na tukio. Inaruhusu wasanidi programu kusajili wanaoitwa wasikilizaji wa hafla kwenye nodi za DOM. Ingawa matukio mengi yanachochewa na kitendo cha mtumiaji, kuna baadhi ambayo yanaweza kuanzishwa bila hayo, kama vile matukio yaliyoratibiwa na simu zisizolingana. Katika hali hii, kila tukio linaweza kutoa mwangwi katika mti mzima wa DOM na kuwasha "wasikilizaji" kadhaa mara moja. Wakati mwingine kuweka wimbo wa haya yote ni kazi isiyo ya maana.

Jinsi matukio yanavyochakatwa

Kwa sababu hizi, msimbo wa JS unaweza kuwa mgumu kuelewa, kuchanganua na kujaribu. Huduma maalum zitarahisisha maisha kwa msanidi programu na kukusaidia kuandika msimbo salama.

Huduma za kujaribu msimbo wa JS

Kuna huduma za uchanganuzi (k.m. Esprima, Rhino), uboreshaji (k.m. Google Closure Compiler) na uchanganuzi tuli wa msimbo kwa makosa ya kawaida ya sintaksia (k.m. JSHint).

Zaidi ya hayo, kuna mifumo kadhaa iliyothibitishwa ambayo husaidia watengenezaji wa wavuti kufunika msimbo wa JS kwa majaribio. Kati yao:

QUnit ni mfumo maarufu wa upimaji wa kitengo;
Jasmine - Mfumo wa BDD (Maendeleo yanayotokana na Tabia) kwa msimbo wa kupima;
Mocha ni mfumo wa kupima msimbo, huendesha katika Node.js na katika kivinjari;
jsTestDriver ni mfumo ambao, kati ya mambo mengine, unaweza kuendesha seti ya majaribio kupitia vivinjari kadhaa mara moja.

Kwa kuongeza, kuna mifumo ya majaribio ambayo huiga tabia ya kivinjari na kukuruhusu kuendesha kesi za majaribio kiotomatiki. Zinafaa sana wakati wa kutatua sehemu za msimbo ambazo zinawajibika kwa mwingiliano kati ya JS na DOM, na hutoa muundo rahisi wa kudhibiti DOM.

Kwa mfano, Selenium, PhantomJS, na SlimerJS hutoa API ambayo unaweza kuzindua na kuingiliana na matukio ya kivinjari. Kupitia API, unaweza kuwezesha matukio na kufikia vipengele vya DOM moja kwa moja wakati wa utekelezaji - yaani, jaribu msimbo katika hali karibu iwezekanavyo na halisi. Bila shaka, sehemu kubwa ya kazi itabidi ifanyike kwa mikono, lakini hata hii ni msaada mzuri katika kupima.

Huduma za Uchambuzi tuli

Hapo awali, huduma za kutambua maeneo ya shida ya nambari zilikuwa vichanganuzi tuli. Hiyo ni, kutokana na quirks zote za nguvu za JS, wangeweza tu kutoa usaidizi mdogo. Hata hivyo, wanaweza pia kuwa na manufaa katika uchambuzi. Hapa kuna mifano ya msingi.

WARI ni kichanganuzi tuli ambacho huchunguza utegemezi kati ya vitendaji vya JS, mitindo ya CSS, tagi za HTML na picha. Madhumuni ya shirika hili ni kupata rasilimali ambazo hazijatumiwa wakati wa uchambuzi wa tuli. Hata hivyo, WARI, bila shaka, haiwezi kukabiliana na mienendo.

JSLint ni shirika tuli la uchanganuzi wa nambari ambayo yenyewe imeandikwa katika JavaScript. Hukagua msimbo dhidi ya mazoea mazuri.

Google Closure Compiler ni kiboreshaji cha JS ambacho huandika upya msimbo kiotomatiki ili kuifanya iwe ya haraka na iliyoshikana zaidi. Wakati huo huo, maoni yote na sehemu zozote za msimbo ambazo hazijatumiwa huenda chini.

WebScent (angalia kazi ya kisayansi) ni kichanganuzi tuli cha hali ya juu. Katika kazi yake, anaendelea kutokana na ukweli kwamba nambari ya mteja ya JS (ile iliyopakiwa kwenye kivinjari) haijahifadhiwa kwa upande wa seva kwa ukamilifu, lakini imetawanyika katika msimbo wa seva vipande vipande. "Harufu" katika vipande hivi haiwezi kutambuliwa kwa urahisi hadi msimbo kamili wa mteja utolewe kutoka kwao. WebScent huchambua msimbo wa mteja ili kupata maeneo ya shida katika msimbo wa seva. Wakati huo huo, kazi ya kichanganuzi tuli cha WebScent inakuja kwa kuibua fujo za HTML, CSS na JS - ili kugundua nakala za nambari na makosa katika syntax ya HTML.

Huduma za Uchambuzi wa Nguvu

JSNose ni shirika linalochanganya uchanganuzi tuli na thabiti. Inachambua msimbo wa antipatterns kumi na tatu. Saba kati yao (ikiwa ni pamoja na kitu cha uvivu na kazi ndefu) ni ya kawaida kwa lugha zote za programu, na sita zilizobaki (harufu za kufungwa, vigezo vingi vya kimataifa, simu za nyuma na wengine) ni maalum kwa JavaScript.

DOMPletion ni matumizi ya kiotomatiki ambayo huwasaidia wasanidi programu kuelewa msimbo wanapoikagua: hufafanua kwa nini miundo ya DOM iko, hufanya uchanganuzi unaobadilika, na hutoa ukamilishaji otomatiki mahiri kwa msimbo unaoingiliana na DOM.

Clematis ni mfumo ambao husaidia kufunua mwingiliano changamano wa hafla. Clematis hunasa kwa undani matukio yote yanayosababishwa wakati wa utekelezaji na kuyaona kwa namna ya kielelezo cha kitabia cha kufikirika ambacho kinaonyesha uhusiano wa muda na sababu-na-athari kati ya vipengele na matukio.

hitimisho

Kwa hivyo, inaweza kuwa vigumu kufuatilia kinachotokea wakati wa kutekeleza hati katika JS, lakini, ukiwa na zana zinazofaa, unaweza kupata na kuandika upya maeneo ya tatizo hata katika msimbo unaochanganya zaidi. Hata hivyo, JavaScript haisimama: vipengele vipya na vipya vinaonekana ndani yake, sasa hutumiwa mara nyingi kuandika maombi (ya simu na desktop), na pia inazidi kupatikana kwenye seva (na si tu) shukrani kwa Node.js. Hii ina maana kwamba sanaa ya kukamata mende inahitaji kuchukuliwa kwa kiwango kipya.