Meny
Är gratis
checka in
den huvudsakliga  /  Installation och installation / Mjukt att arbeta med JavaScript. Vad är den bästa HTML-redaktören, PHP, CSS, JS-koden? Villkor och cykler

Programvara för att arbeta med JavaScript. Vad är den bästa HTML-redaktören, PHP, CSS, JS-koden? Villkor och cykler

Java Script det! - Ett bra program för att skapa bra effekter på JavaScript. Med det här programmet underlättar du uttryckligen ditt liv när du skapar webbplatser. I grund och botten är det avsett för personer som är för lat för att skriva skript själva och i allmänhet något på JavaScript. Naturligtvis, med sin skapelse, var det fokuserat på nybörjare, även om du fortfarande behöver minimal kunskap om HTML för att arbeta med det.

Vad är JavaScript?

Javascript är ett objektorienterat skriptprogrammeringsspråk som är utformat för att skapa aktiva HTML-sidor. Under den "aktiva" här finns det i taget på HTML-sidorna där alla slags dynamiskt föränderliga webbelement är placerade, till exempel:

  • Menyn sjönk när man svävar muspekaren.
  • Små animerade bilder efter markören eller till exempel flyttar till en viss del av sidan när du klickar på något element.
  • Informationsblock (till exempel med kort beskrivning Varor) med en automatiserad rullningstid och mycket mer.

De där. Javascript låter dig skapa sådana webbelement som på något sätt interagerar med användaren, reagerar för att flytta muspekaren, trycka på tangenterna, rulla på sidan i webbläsaren etc. I samma lista lägger du till helt automatiserade webbelement som utför några åtgärder utan användarnas deltagande.

Som i något annat programmeringsspråk har JavaScript sådana begrepp som variabler, arrays, logik-aritmetiska beräkningar etc. etc. De där. för javascript hjälp Du kan producera komplexa beräkningar, hantera stora datarrays och mycket mer, som fortfarande är ute av sikte på webbplatsens besökare.

Ännu fler funktioner för programmeraren öppnar det faktum att JavaScript är ett objektorienterat programmeringsspråk, men den här frågan här kommer inte att övervägas.

Studera JavaScript via Java Script det!

En av de främsta orsakerna till JavaScript som hög popularitet bland nybörjare webbprogrammerare är besittning av programmeringsspråket, så kallat. "Låg tröskelinmatning". De där. Det är tillräckligt att studera den grundläggande kunskapen om HTML och CSS-markupspråket.

Java Script IT-programmet! Ger verktyg för en snabb infogning i HTML-sidan av koderna för en mängd olika färdiga webbelement skrivna i JavaScript. Alla tillgängliga element är uppdelade i 3 kategorier:

  1. Applets - Element som utför någon oberoende funktion: banner, animerad text, rörlig bild, etc.
  2. Skript - I grund och botten presenteras webbelementen som hanteras av användaren här: Former för att skriva in text på mask (datum, lösenord, etc.), block som låter dig skapa ett bildspel med automatisk rullning av bilder, en mängd olika systemknappar ( till exempel, för att öppna dialogrutor För att ladda ner filer till webbplatsen).
  3. Och DHTML är en mängd interaktiva element som består av HTML-märkning, CSS Cascading-tabeller och JavaScript-skript (till exempel, rullgardinsmenyer eller popup-fönster / formulär).

Några av de tillgängliga elementen har sina egna inställningar. För enkelhet och bekvämlighet i deras inmatning / förändring finns en speciell blankett.

Sätt i JavaScript-kod via Java Script IT-programmet! Ser ut som:

  • Användaren skapar en fil med en HTM- eller HTML-förlängning på disken. Du kan använda den färdiga HTML-filen fylld med vilken kod som helst.
  • Därefter väljs ett av de tillgängliga webbelementen, efter - formuläret med sina inställningar är fylld (till exempel, mått, menyalternativ, etc.).
  • Den genererade JavaScript-koden sätts in i HTML-filen till den användarbehövda positionen (det här görs i form av webelementinställningar).
  • Redo.

I Java Script det! Byggd i standard Windows-webbläsarens anslutna modul Internet Explorer.. Resultatet av arbetet visas omedelbart efter det att änden av banelementet är klart. Du kan se resultatet i någon annan webbläsare, för vilken den är tillräcklig för att öppna den skapade / redigerade HTML-filen.

Om du öppnar i webbläsaren källa HTML-sidor, du kan se och utforska JavaScript-koden själv. Här kan du redigera det, byta olika värden manuellt. Således kommer användaren att kunna få de grundläggande JavaScript-programmeringsförmågan, nämligen hur koden sätter i ett HTML-dokument, vilka kommandon används för att konfigurera de eller andra egenskaperna hos banelementet etc.

Självklart, Java Script det! Du kan använda och fylla i webbsidor som är olika aktiva elementMen på grund av programmets föråldring är det mer lämpligt för bekant med AZA-programmeringen i JavaScript.


Detta kapitel är dedikerat till JavaScript-skriptprogrammeringsspråk. Du kommer att lära dig vad som är ett JavaScript-språk och vad det är nödvändigt för vad det är nödvändigt.

Tänk på funktionerna med att skapa högtalare på sidan, formuläret, såväl som att arbeta med lager och stilar.
Javascript.- Detta är ett objektorienterat skriptprogrammeringsspråk med syntax, något liknande syntaxer av C-språk, Perloch Pytonorm. Trots det faktum att språket har ett liknande namn med språket javaprogrammering, Inget att göra, förutom den del av namnet, har de inte.

För närvarande Javascript.det används främst för att skapa inbäddade scenarier som är inbäddade i webbsidor som gör att du kan helt kontrollera båda webbsidorna själva, där och webbläsare där dessa webbsidor är öppna. Så språket Javascript.i de flesta fall används det för att skapa interaktiva webbsidor och webbapplikationer.

Internet är byggt på teknik " klient-server.».
Servrar är datorer eller program som ger några tjänster till kunder, till exempel en webbserver eller en e-postserver.
Kunderna är datorer eller program som använder vilka servrar som erbjuds, som webbläsare eller postklienter.

Scenarier Javascript.- Det här är små program som körs på användarens dator när du hämtar från servern tillsammans med webbsidor.

Javascript omfattning

Från början av utvecklingen har JavaScript tillämpats på skrivandet av olika kundscenarier. De användes i stor utsträckning för att lösa sådana uppgifter, till exempel att kontrollera information som angivits av användaren i formuläret innan den skickades till en server eller programmering av svar på användarens åtgärder som gör webbsidor interaktiva. Idag, med hjälp av JavaScript-språket, skapas hela webbapplikationer, några av dem är lite sämre än sina skrivbord "motsvarigheter". Bra exempel Sådana webbapplikationer finns bland Google-tjänster, till exempel Google Calendar - en multifunktionell arrangör i en webbläsare och Google Doc. & Kalkylblad - text och bordredigerareTillåter att arbeta med kontorsdokument direkt i webbläsarfönstret. För att skapa dynamiskt innehåll på webbsidor, använd ett dynamiskt språk hTML-sidor Dynamisk HTML (dynamisk HTML), vars nyckeldel är igen JavaScript.

JavaScript-språk tillämpas inte bara på Internet, men också i sådana program, till exempel Adobe Dreamweaver, Adobe Acrobat. Läsaren I. Adobe Photoshop. Att utöka sina möjligheter, liknar användningen av det visuella grundläggande språket i Microsoft Office.

Nu överväga att skapa skript och sätt att implementera dem i ett HTML-dokument.

Skapa skript

Vi kommer att analysera alla steg för att skapa ett JavaScript-skript - från organisationen av arbetsmiljön innan du ansluter koden till HTML-dokumentet.

För att arbeta på skripten kommer nästan vilken textredigering som helst att vara lämpliga, så att vi kan skapa vanliga textfiler Och spara dem med förlängningen av HTM eller HTML. Till exempel, i operationsrummet windows-system Bland standard finns det två lämpliga textredigerare - anteckningsblock och wordpad. Det finns också redaktörer som är speciellt utformade för att skapa webbsidor, till exempel Microsoft FrontPage och Adobe Dreamweaver (tidigare känd som Macromedia Dreamweaver). Sådana redaktörer låter dig skapa webbsidor med hjälp av visuella verktyg och sedan växla till kodvisningsläge och göra icke-standardiserade ändringar, till exempel lägga till skript. I motsats till vanliga textredaktörerSyntaxen för HTML- och JavaScript-språksyntaxen är markerat i sådana redaktörer, vilket är mycket bekvämt.

Dessutom kan du på internet hitta ett stort antal andra textredaktörer som låter dig skapa webbsidor och markera HTML och JavaScript-syntax. Dessa redaktörer har också många andra användbara möjligheter som väsentligt förenklar processen med att skapa webbsidor och utveckla skript. Många sådana redaktörer distribueras gratis eller villkorligt gratis, och kanske kommer några av dem att behöva göra.

Du kommer att skapa skript som hanterar webbsidor, så du behöver någon webbläsare för att verifiera utförandet av dessa dokument. Observera att genom att kontrollera utförandet av din skapelse i en webbläsare är det omöjligt att vara säker på sin prestation och i andra. Följaktligen är webbsidorna önskvärda att checka in flera webbläsare, och vad de kommer att bli mer desto bättre.

Webutvecklare måste betraktas som huvudsakligen med särdrag i en webbläsare Microsoft Internet Explorer. Följaktligen måste dess webbsidor testas i den här webbläsaren, som är tillgänglig i varje operativ system Fönster.
Vi använder också mycket populära webbläsare Mozilla Firefox. Och opera, som syftar till att maximera standarderna. Mozilla Firefox kan hämtas från http://www.mozilla.ru/ och opera från webbplatsen.

Separat, överväga debugging programmet (scenario). När manuset är stort är det inte så lätt att förstå det, det vill säga att processen att hitta och eliminera fel kan ockupera det mesta av utvecklingstiden för hela programmet (eller scenariot). För att förenkla och påskynda debugging skapade särskilda program, hänvisat till debugger. En typisk debugger har sådana möjligheter, såsom ett steg-för-steg-utförande av programmet med ett stopp i varje kodlinje eller i förväg av stoppen markerade för dessa punkter, såväl som spårning och ändring av värdena för varje variabel direkt när du utför programmet.

Det finns många program för felsökning av skript på JavaScript. Till exempel har Microsoft Script Debugger Debugger allt du behöver för att framgångsrikt felsöka skript på JavaScript. Den används i samband med Webbläsaren Microsoft Internet Explorer. Denna justerare distribueras gratis av Microsoft, det kan hämtas från webbplatsen. Dessutom distribueras denna debugger med Microsoft Frontpage Editor inom microsoft-program Script Editor, som är praktiskt taget ingen annan än Microsoft Script Debugger.

Det finns också andra defuggers, till exempel för Webbläsaren Mozilla Firefox, skapas de i form av tillägg. I synnerhet kan Firebug Debugger hämtas från webbplatsen, och om du går till den här sidan i Mozilla Firefox-webbläsaren, kommer debuggeren omedelbart att installeras.

Vi kommer inte att överväga felsökningsprocessen i den här boken, eftersom det här är ett separat ämne som kräver en noggrann studie. För att skriva enkla scenarier krävs inte felsökningen.

Inbäddningsscenarier

Överväg att bädda in skript på en webbsida.
Scenarier introduceras i ett HTML-dokument på tre standardvägar:

text som ett skript på vilket språk som helst. Skriptspråket anges med typattributet. Till exempel används följande kod för att ange JavaScript-språket:

Detta attribut kan inte anges, eftersom "Text / JavaScript" -värdet är standardvärdet.

I scenarkoden kan du använda kommentarer - text som ignoreras av JavaScript-tolken. Kommentarer // I.

Kommentarer kan också vara multi-line, vilket gör det lättare att felsöka ett skript och låter dig kommentera problemet i koden. För detta ändamål används uppsättningar av tecken / * och * /, såsom exempelvis i följande kod:

Skript kan innehålla i själva webbsidan, som beskrivits ovan och i en separat fil. Märka

...

4. Spara filen, till exempel namngiven script1.html.
Efter att ha skapat en webbsida med ett skript kan du se hur det kommer att se i en webbläsare. För att se till att skriptet fungerar som det ska, kontrollera det i alla webbläsare som är installerade på din dator.
5. Kör webbläsaren och öppna den skapade webbsidan.

Så, om du gjorde allt rätt, kommer det att finnas tio meddelanden "Hej, fred !!!" på skärmen i din webbläsare. (Bild 2.3).

När du utvecklar skript är textredigeraren vanligtvis öppen samtidigt, vilket skapar en webbsida, och flera webbläsare där prestanda på webbsidan skapas kontrolleras. När du har gjort ändringar i skriptet är det tillräckligt att byta till webbläsaren och klicka på knappen Uppdatera.


Fikon. 2,3. Ditt första skript i en webbläsare

Syntax och Fixed JavaScript-verktyg

Förklara nu de grundläggande elementen i JavaScript-språket: variabler, datatyper, uttryck, olika operatörer, funktioner etc. Dessa kunskaper är grundläggande, eftersom det inte är omöjligt att förstå resten av materialet.

Arbeta med information

Alla program- eller skriptarbete med information, det vill säga de får vissa data, behandlar dem enligt deras algoritm, och sedan, som regel, ett visst resultat i form av en bild, ljud, fil, en signal med ett annat program, etc., returneras.

Klientscenarier utför ofta en buffert mellan användaren och serverns program, som utövar förbehandling och verifiering av data.

Klientscenarier kan ta emot information på följande sätt:

/ data som anges i skriptutvecklaren (initialvärden);
/ data erhållen från användaren med former;
/ data som sänds via URL;
/ Information erhållen genom behandling av händelser, till exempel, när du flyttar muspekaren, klicka på eller tryck på tangenterna.
/ Data mottagen från andra webbplatser eller överförs av serverns program.

Överväg att ange / utmatningsinformation i JavaScript med följande tre metoder: Alert (), Prompt () och bekräfta (). Dessa metoder genererar olika meddelandenfönster.

Alert () Metod

Alert () -metoden visar varningsdialogrutan med motsvarande meddelande. Efter att ha läst meddelandet måste användaren klicka på OK-knappen för att stänga fönstret. Argumentet för denna metod är en sträng.

I det enklaste fallet introduceras texten på varningen som bifogas citat inuti de runda fästena (listning 2.3).

Notering 2.3. Arbeta med varning

Arbeta med varning

Varningsfönstret genereras av webbläsaren själv, så utseendet på fönstret i olika webbläsare kan variera. I fig. 2.4 En vy över fönstret som genereras av den presenterade koden i Internet Explorer-webbläsaren ges.


Fikon. 2,4. Arbeta med varning

Fråga () Metod

Fråga () används för att erhålla data från användaren (listning 2.4).

Notering 2.4. Arbeta med förfrågan

Arbeta med förfrågan

När det kallar det visar dialogrutan Inbjudan med ett textfält. Denna metod kan innehålla två argument. Det första argumentet är meddelandet som visas i dialogrutan. Det andra argumentet är standardtexten som ska visas i motsvarande fält. Dessutom returnerar den här metoden ett värde - den text som gick in i användaren.

Efter att ha startat sidan med ovanstående kod visas en fråga (bild 2.5), följt av en varning.


Fikon. 2,5. Arbeta med förfrågan

I det här exemplet används en variabel för att demonstrera arbetet med den snabba metoden () och i alert () -metoden fungerar ett uttryck som ett argument. Dessa begrepp kommer att beskrivas nedan.

I den snabba () -metoden kan du släppa det andra argumentet, det vill säga ange endast en sträng.

Bekräfta () Metod

Metoden Bekräfta () Visar dialogrutan Bekräftelse som innehåller två knappar: OK och Avbryt (Avbryt). Notering 2.5 ger kod för att skapa ett bekräftelsesfönster, men det här scenariot betonar inte skillnaden mellan OK och Cancel-knapparna.

Notering 2.5.Arbeta med bekräftelse

Arbeta med bekräftelse

Klicka på någon av knapparna stänger dialogrutan (bild 2.6).


Fikon. 2,6. Arbeta med bekräftelse

Skriptet kan reagera annorlunda genom att klicka på musknappen på OK och Avbryt-knapparna.

Variabler och datatyper

Under tolkningen av skriptet splittrar webbläsaren koden i separata tecken, ord eller fraser som kan känna igen. Dessa element kallas lexemes. På Javascripts språk är lexemes uppdelade i fyra typer: identifierare, nyckelord, bokstäver och operationer.

Identifierare

Identifierare- Det här är namn som indikerar variabler, funktioner och objekt. Vissa namn kan inte användas som en identifierare, eftersom de har en speciell betydelse. Identifierare bildas med användning av kombinationer av olika symboler med följande begränsningar:

/ Alla identifierare måste börja med brevet;
/ Efter första bokstaven kan resten av tecknen vara bokstäver och siffror;
/ bokstäver anses vara alla kapital och små bokstäver i det latinska alfabetet: från A till Z och från A till Z;
/ Underläkningssymbolen (_) fungerar som ett brev och används ofta istället för ett utrymme som inte kan användas i identifierare.
/ Dollarsymbolen ($) fungerar som ett brev och används vanligtvis med automatisk kodgenerering.

Råd
Du bör inte använda de identifierare som endast skiljer sig på symbolerna i det övre och undre registret, till exempel Flagid och FlagId. Det här är olika identifierare som kan orsaka anställningsfel.

I fliken. 2.1 Exempel på tillåtna och ogiltiga identifierare ges.

Tillåten Oacceptabel
Räkna 2my
X. ny
X. Mygr.
är väl. Är väl

Tabell 2.1. Exempel på Javascript-identifierare

Observera att det nya id, även om det innehåller tillåtna tecken, hänvisar till antalet sökord, så kan inte fungera som användaridentifierare.

Nyckel och reserverade ord

Nyckelord - Dessa är fördefinierade identifierare som bildar kärnkärnans kärna. Dessa ord har en speciell mening och utför vissa funktioner. Nyckelord kan inte användas för användaridentifierare. I fliken. 2.2 Listan över JavaScript-nyckelord presenteras.

Ha sönder ANNAN. ny Sorts.
Fall. Till sist. NULL var.
Fånga För Lämna tillbaka. Tomhet.
Fortsätta. Fungera. Växla Medan
Standard. om. DETTA Med.
radera. I. Kasta
do. Instans av. Prova.

Tabell 2.2. Javascript Nyckelord

abstrakt enum int. Kort
Booleska. Exportera Gränssnitt. Statisk.
Byte Sträcker sig. Lång. Super
Röding. Slutlig. Inföding. Synkroniserad.
Klass flyta Paket. Kast
const. Gå till. Privat Övergående.
Debugger. Redskap. Skyddad. Flyktig.
Dubbel. Importera offentlig

Tabell 2.3. Reserverade ord javascript

Bokstavlig

Bokstavlig- Dessa är siffror eller linjer som används för att representera värden i JavaScript. Information kan vara mycket varierad, så värden är olika typer. De enklaste typerna av data i JavaScript kallas de viktigaste typerna av data: Nummer, linjer och logiska värden.

Nummer i Javascript är två typer: heltal och flytande poäng. Interiversalvärden kan vara positiva, till exempel 1, 2, 3, negativt, till exempel -1, -2, -3 och lika noll. Dessutom kan heltalsvärden uttryckas i decimal, oktal eller hexadecimala talsystem.

Numren i decimalformatet kan innehålla vilken sekvens som helst från 0 till 9, som inte börjar med noll.

Oktalformatnumren kan innehålla vilken sekvens som helst från 0 till 7, som börjar med noll.

Numren i hexadecimalt format kan innehålla eventuell sekvens av siffror från 0 till 9 och bokstäver från A till F, som börjar med 0x.

Tänk på exempel på att representera heltal i olika format (tabell 2.4).

Decimalformat Oktalformat Hexadecimalt format
45 055 0x2d.
– 255 – 0377 - 0xff
10000000 046113200 0 × 989680.
10 012 0xa.

Tabell 2.4. Exempel på heltal

De flytande punktnumren bestämmer decimaltal med en fraktionell del. Dessa siffror kan uttryckas i normal form eller i en exponentiell representation. I det senare fallet används symbolen för att representera ordern. e. eller E.. Decimal mantis och order kan vara positiv eller negativ. Nedan är exempel på flytande punktnummer.

1,4142135623730950488016887242097 -35,0 4567.0002 3.4E100 -5.456E-3 0,007

Javascript-språket stöder logiska datatyper som kan ta endast två värden: sant (sanning) och falska. Logiska (booleska) värden är nödvändiga för att arbeta med de villkor du kommer att lära känna senare i det här kapitlet.

UPPMÄRKSAMHET!
Nyckelord sant och felaktigt måste administreras till bokstäverna i det nedre registret.

Den vanligaste datatypen i JavaScript är förmodligen en sträng. Linje- Det här är en uppsättning tecken (eventuellt tomma), inneslutna i enkel- eller dubbla citat. Två typer av citat används eftersom strängen kan innehålla citat av något slag. Följande är exempel på strängbokstäver:

"Textlinje" "Ryssland!" "4567" "" "operativsystem" "Lewis Carroll" Alice in Wonderland "" "

Ibland kan det vara nödvändigt att ge datorn till användning av specialtecken, såsom tabulering eller rad översättning. För att aktivera en unicode-symbol i strängen måste du ange koden efter service-tecknet \\ u som \\ uxxxx. I fliken. 2.5 De \u200b\u200bvanligaste kontrolltecken ges.

Kontrollsekvens Unicode. Beskrivning Symbol
\\ B. \\ U0008. Återgå till en position (backspace)
\\ T. \\ U0009. Horisontell tabulering
\\ N. \\ u000a. Rad översättning (ny linje)
\\ V. \\ U000b. Vertikal tabulering
\\ F. \\ u000c. Inlämningssida
\\ R. \\ u000d. Returvagn
\\ U0022. Dubbel citat »
\’ \\ U0027. Singel citat
\\ \\ U005c. Omvänd snedställd jävla \

Tabell 2.5. Hantera symboler

Ofta kontrollerar tecken för att anpassa data (listning 2.6).

Notering 2.6. Justeringsdata med hjälp av kontrolltecken

Justering med kontrolltecken

Dialogrutan Alert () beror på webbläsaren, därför inträffar anpassningen i olika webbläsare på olika sätt. Ovanstående kod är anpassad till programmet Microsoft Internet Explorer (bild 2.7).


Fikon. 2,7. Justering med kontrolltecken

Förutom siffror, rader och logiska värden finns det två speciella datatyper: funktioner och objekt. Funktioner kan byggas in, till exempel Alert (), och kan skapas av utvecklaren. Dessutom kan funktioner tillhöra objektet (i det här fallet kallas de metoder). Objekt kan också byggas in (till exempel dokument), och kan skapas av en programmerare. Det antas att värdet av null är ett objekt.

Variabler

Variabel- Detta är namnet som tilldelats datorns minnescell, som lagrar vissa data medan skriptet körs. Variabler förenklar driften av datanipulationsprogrammeraren.

Variabelns namn är en identifierare, följaktligen med samma regler.

Innan du använder variabeln måste den meddelas, det vill säga att reservera ett lagringsutrymme. För att deklarera en variabel, efter Var-sökordet, måste du ange dess identifierare. Du kan omedelbart förklara flera variabler genom att ange deras namn genom kommatecken:

Var mydata1; var x, y, z; var k, msg1, msg2, im;

I förfarandet för variabeln kan den initialiseras, det vill säga att ställa in det ursprungliga värdet för det:

Var mystr \u003d "Hej"; var k \u003d 1000, x \u003d 12, y \u003d -5; VAR S \u003d 1.34E-5, MSG11 \u003d "Fel", flagga \u003d FALSE;

Medan variabeln inte kommer att få ett värde är det osäkert - odefinierat. För att bestämma vilken typ av variabel kan du använda typfunktionen, som returnerar en sträng med en variabel typ (listning 2.7).

Notering 2.7. Datatyper

Datatyper

Datatyper


I ovanstående kod använde vi metoden document.write (), som låter dig lägga till textsträng direkt till sidan (bild 2.8).


Fikon. 2,8. Datatyper

För att visa text, värden av variabler och deras typ av argument av denna metod är ett ganska komplicerat uttryck. Mer detaljer om uttryck kommer att förklara nedan.

Åtgärdsvariabler är uppdelade i globala och lokala. Variabeln som deklarerats inuti funktionen är lokal, och endast den här funktionen har tillgång till sitt värde. Lokala variabler skapas och förstörs tillsammans med motsvarande funktion. Globala variabler meddelas utanför funktionerna. Sådana variabler tillåter funktioner att utbyta data.

Array- Det här är en speciell variabel som låter dig lagra flera värden samtidigt. Vanligtvis är dessa värden relaterade till varandra, till exempel namnen på månaderna och veckodagen. Arrays kan avsevärt förenkla koden och vid användning av cykler, minska komplexiteten i manuskriptutvecklingen.

Tänk på ett exempel på tillkännagivande och ställa in värdena för matrisens element (listning 2.8).

Notering 2.8. Arbetar med en array

Arbetar med en array

Observera att när det förklaras en array anges antalet element inom parentes, och när det åtkomst till elementet är indexet inställt i kvadratkonsoler. Dessutom börjar numreringen av elementen i matrisen i JavaScript-språket från början, så det första elementet i arrayen blir stjärnturelementet.

Javascript gör det möjligt att mata ut alla element i matrisen och inte lista dem en efter en. För att göra detta, kontakta själva arrayen. Resultatet är en sträng där alla element i matrisen är listade via kommatecken (figur 2.9).


Fikon. 2,9. Återkallandet av alla delar av arrayen

Värdena för matriselementen kan ställas in när en array. I det här fallet är det inte nödvändigt att ange antalet element i matrisen (notering 2.9).

Notering 2.9. Initialisering av arrayen

Initialisering av arrayen

Matrisens dimension kan inte anges, eftersom JavaScript-språket inte kräver detta. En array kan expanderas när data läggs till. Dessutom kan du förklara ett element med ett index. n.som kommer att öka längden på arrayen till n + 1.. Du kan lära dig längden på arrayen med hjälp av längdfastigheten (listning 2.10).

Notering 2.10. Storlek på arrayen

Storlek på arrayen

Trots det faktum att i själva verket i array 6 är matrislängden 100 (fig 2,10).


Fikon. 2,10. Storlek på arrayen

Uttryck

Uttryck- Det här är operander i kombination med verksamheten. Vanligtvis fungerar variabler som operander, men andra uttryck kan också vara. Exempelvis, uttrycket 4 + 6 viks två värden, vilket resulterar i ett värde av 10. och uttrycket q \u003d 5 tilldelar variabeln Q-värdet 5. Om manipuleringarna utförs med ett värde kallas operationen unary, och om två - binär. Därefter överväga verksamheten i JavaScript.

Uppdragsverksamhet

En av de vanliga operationerna är uppdragsoperationen. I det enklaste fallet tilldelar denna operation värdet av variabeln:

Denna operation kan användas samtidigt för flera variabler:

msg1 \u003d msg2 \u003d "hej"

Övriga uppdragsverksamhet är kombinationer av uppdrag och aritmetiska eller bindningsoperationer (tabell 2.6).


Tabell 2.6. Kombinerade uppdragsverksamheter

Aritmetiska operationer

/ Tillägg - ett plustecken (+). Till exempel, 5 + 7 \u003d 12.
/ Subtraktion - ett minustecken (-). Till exempel, 67 - 43 \u003d 24.
/ Multiplikation - Asterisk (*). Till exempel 2 * 2 \u003d 4.
/ Leverans - snedställd funktion (/). Till exempel, 45/5 \u003d 9.
/ Palans från division - Procentandel (%). Till exempel, 7% 5 \u003d 2.
/ För att arbeta med siffror används aritmetiska operationer.

I programmering ökar eller minskar eller minskar variabel per enhet (inkrement och minskning). Inkrementet betecknas med en sekvens ++ och minskning - sekvens . Till exempel, i ++. är ett alternativt uttryck i \u003d i + 1.

Skilja prefixet och postfixformen för dessa operationer. I fallet med ett prefixoperation utförs en inkrement eller minskning först och uttrycket beräknas:

i \u003d 4.
++ I * 2 \u003d 10

Om postfix-operationen används, beräknas uttrycket först och sedan en ökning eller minskning av variabeln:

i \u003d 4.
I ++ * 2 \u003d 8

Notering 2.11 visar arbete med aritmetiska operationer.

Notering 2.11. Aritmetiska operationer

Aritmetiska operationer

Aritmetiska operationer


I det här exemplet kan det noteras att de aritmetiska operationerna följer de matematiska reglerna. Till exempel utförs multiplikation före tillsats (fig 2.11).

Detta görs på bekostnad av den prioriterade verksamheten som kan ändras med fästen.


Fikon. 2,11. Aritmetiska operationer

Operationer av jämförelse

Jämförelseoperationer används för att jämföra operander. I dessa operationer kan operander inte bara vara siffror, utan även strängar, logiska värden och föremål. I fliken. 2.7 Alla jämförelseverksamhet ges.


Tabell 2.7. Operationer av jämförelse

Notering 2.12 visar koden där jämförelsesoperationerna används.

Notering 2.12.. Operationer av jämförelse

Operationer av jämförelse

Operationer av jämförelse


Variabler jämförs i koden nedan. i \u003d 5. och m2 \u003d "5". De anses vara lika, men inte identiska (fig 2,12).


Fikon. 2,12. Operationer av jämförelse

Operationer på strängar

Som redan nämnts kan linjerna jämföras. Dessutom kan de kombineras med en sammankoppling. (+) som vi redan har gjort mer än en gång. Till exempel:

S1 \u003d "Hej"; S2 \u003d ","; S3 \u003d "Fred!"; S \u003d s1 + s2 + "" + s3;

Som ett resultat, variabeln S. Det kommer att innehålla strängen "Hello, World!".

Tack vare den automatiska visningen kan du kombinera siffror och linjer:

"År" + 2008 \u003d "År 2008"

Logiska operationer

Logiska operationer möjliggör kombinering av uttryck som returnerar logiska värden. JavaScript stöder tre logiska operationer.

Drift av logisk I. (&&) Återvända sann.Endast om båda operanderna är sanna. Till exempel, (12) .

Drift av logisk eller (||) Återvända sann.Om minst en operand är sann. Till exempel, (22) .

Drift av logisk ne. (!) det är unary och förändrar värdet av det logiska värdet motsatsen.

Villkorlig verksamhet

Javascript har en operation ?: som tilldelar värdet på variabeln beroende på genomförandet av tillståndet. Tänk på följande exempel:

Var sign \u003d (a\u003e \u003d 0)? "Positiv negativ";

Resultatet av uttrycket till frågetecken påverkar variabelns värde: Om värdet är sant, beräknas uttrycket i kolon, om det är felaktigt, det uttryck som står efter kolon bestäms. I vårt fall, om variabeln A är större än eller lika 0 , variabel tECKEN.tar värdet "positivt", annars - värdet är "negativt".

I JavaScript finns det också operationer (till exempel välsignelse), som är ganska sällsynta och behövs när vi löser specifika uppgifter, därför kommer vi inte att överväga dem.

Villkor och cykler

För att ändra proceduren för att exekvera kod i JavaScript finns det förgreningsmekanismer (Om och växla operatörer)så att du kan välja en av de alternativa åtgärderna beroende på villkoret. Cykeloperatörer används för exekvering av flera kod (Medan, för och gör). Cykler är också lämpliga för manipulering av arrays.

Om operatören

Operatör om.hanterar kommandoexekveringssekvensen. Syntaxen för denna operatör är:

Om (logiskt uttryck) (operatörer)

Inledningsvis beräknas ett logiskt uttryck, då om det är lika sann., operatörer utförs; Om det är lika falskOperatörerna hoppas över och utförandet av skriptet fortsätter.

Tänk på ett exempel. Antag att fungera f (x) Bestämd enligt följande:

X + 10, med x< 0 f(x)= x2 + 4, при 0 ≤ x ≤ 5 5 / x, при x > 5

För att bestämma värdet på den här funktionen vid en viss punkt kan du använda koden som visas i Notering 2.13.

Notering 2.13. Exempel på operatören om

Exempel på operatören om

Om .. annan operatör

Det är ofta lämpligt att använda den fulla formen av den villkorliga operatören. Med den här operatören kan du ställa in de åtgärder som måste utföras om det logiska uttrycket är lika falsk:

Om (logiskt uttryck) (operatörer1) annars (operatörer2)

Dessutom kan du kombinera aNNAN.med en annan operatör om.. I det här fallet kan du överväga flera alternativa alternativ och utföra lämpliga operatörer:

Om (logiskt uttryck1) (operatörer1) annars om (logiskt uttryck2) (operatörer2) annars (operatörer3)

Föregående skript omskrivning för att bestämma funktionen med hjälp av en IF .. Operatör (Listning 2.14).

Notering 2.14.. Exempel på operatören om..Else

Exempel på operatören om..Else

Som det kan ses från den här koden krävs inte de lockiga fästena om endast en operatör utförs. Det rekommenderas dock att alltid användas för att förenkla läsningskoden.

Brytare

Omkopplaroperatören jämför värdet med en mängd andra värden. Samma effekt kan uppnås med flera om uttalanden, men omkopplingsoperatören gör att du kan skapa en kort och visuell kod:

Byt (uttryck) (Fallvärde1: Falloperatörer Betydelse2: Operatörer .. Standard: Operatörer)

Antag att du behöver skapa ett skript som skulle översätta namnet på djur från engelska (listning 2.15).

Notering 2.15.

SAMMANFATTNING AV ARBETS OPERATOR

Denna kod låter dig översätta ett av de tre djurnamnen (bild 2.13).


Fikon. 2,13. Resultatet av operatörens funktion

Var uppmärksam på den brytare som slutar att utföra omkopplaren. I annat fall kommer den återstående koden att utföras i omkopplingsdeklarationen oavsett värdet av variabeln.

För operatören används för att skapa en cykel. Denna operatör har följande syntax:

För (initialiseringsuttryck, villkoruttryck, cykeluttryck) (operatörer)

Ett initialiseringsuttryck tjänar vanligen för att specificera det ursprungliga värdet av cykelräknaren. Uttrycket av tillståndet slutar att utföra cykeln när det tar värdet av falskt. Cykeluttrycket utför vanligtvis ökning eller minskning av cykelräknaren. Vilken som helst av dessa uttryck kan missas, men motsvarande punkt i kommatecken är inställd.

Notering 2.16 presenterar koden som låter dig hitta fabriksnumret n! \u003d 1 ∙ 2 ∙ 3 \u200b\u200b∙ ... ... ∙ n med hjälp av för cykel.

Notering 2.16. Hitta factorial med hjälp av för operatör

Factorial med hjälp av för operatören

I den här koden är en cykel organiserad från 1 till X, och för enkelhet är det införda värdet inte kontrollerat för tillåtlighet. Baserat på detta kan du till exempel få värdet av oändligheten (oändlighet) med ett stort värde av x.

Den medan operatören liknar för operatören, men det initierar inte räknaren i sitt meddelande. Syntaxen för denna operatör är som följer:

Medan (tillståndsuttryck) (operatörer)

Om uttrycket av tillståndet i startcykeln är falskt, är operatörerna aldrig utförs.
Notering 2.17 presenterar koden som låter dig hitta en faktori med hjälp av startcykeln.

Notering 2.17. Hitta en faktoriell med användning av operatören

Factorial med användning av operatören

Göra .. medan cykla

Operatör gör. När det är nästan identiskt med under operatören. I detta uttalande kontrolleras villkoret i slutet, så det garanterar genomförandet av operatörer, åtminstone en gång, oavsett sanningens sanning:

Gör (operatörer) medan (uttryck för uttryck)

Listning 2.18 ger en kod som låter dig hitta en faktori med hjälp av en do .. 5.

Notering 2.18. Hitta factorial med hjälp av operatören gör.

Faktori som använder operatören gör.

Cykel för .. i

Den för..in-cykeln låter dig utföra operatörerna för nästan varje objektegenskap. Syntaxen för denna operatör är som följer:

För (egendom i objekt) (operatörer)

Till exempel, med hjälp av den här operatören, kan du producera ökning av alla element i arrayen (listning 2.19).

Notering 2.19. Med hjälp av för..in-operatören

Exempel på att använda för..in-operatören

Som ett resultat av utförandet av denna kod ökar alla delar av array A med 1 (figur 2.14).


Fikon. 2,14. Ökning av matriselement

Bryta och fortsätta operatörerna

Ibland under genomförandet av cykeln är det ett behov av att avbryta hela cykeln eller en av dess iterationer. För detta ändamål serveras och fortsätt operatörerna. Brytoperatören stoppar helt exekveringen av cykeln och sänder kontrollen av operatörerna efter cykeln. Fortsätts operatör avbryter den aktuella cykelkörningen och fortsätter till nästa steg i cykeln. Skillnaden i dessa operatörer visas i notering 2.20.

Notering 2.20. Användning av utgångsoperatörer från cykel

Ett exempel på att använda utgångsoperatörerna från cykeln

Med den här koden kan du bestämma numret och elementen i de array-inmatade användarinmatade siffrorna. Samtidigt, bland elementen i denna matris kan det finnas nollor, då i elementet i matrisen med resultatet B, är det nödvändigt att introducera dash "-". Resultatet av kodbehandlingen i det här fallet ser du i fig. 2,15.


Fikon. 2,15. Användning av utgångsoperatörer från cykel

Ovanstående kod demonstrerar också möjligheten att fästa en cykel till en annan. Från startcykeln kan du bara gå ut när noll är inmatad (standardvärde). Om du anger andra nummer, kommer cykeln inte att slutföra jobbet. I cykeln under utförandet avbryts ibland om ett arrayelement A är noll (för att undvika att dividera till noll).

Kodredigerare - Programmerarens primära verktyg. Och alla plockar upp: Någon uppskattar funktionalitet, någon rörlighet, för någon det viktigaste - design och bekvämlighet. Någon gillar även om att skriva kod i anteckningsblock, men det är som att försöka bygga ett hus med en hammare.

Javascript är ett kraftfullt och lustigt språk. Å ena sidan är många ramar och bibliotek, å andra sidan inte den enklaste syntaxen och farorna i samband med "dynamiken". Därför är det viktigt att hitta redaktören att arbeta med det. Det rätta valet kommer att se till att du rengör koden, hög utvecklingshastighet, minsta fel och nöje från jobbet. Du kommer att spendera mycket tid att välja mellan en av de hundratals befintliga redaktörer, så vi har gjort en del av arbetet för dig. Här är topp 5.

Webstorm

Webstorm från Jetbrains är vackert i båda sina manifestationer: Som en IDE stöder det att arbeta med Version Control Systems, låter dig fjärranslutna kod, eftersom redigeraren - Standard bekvämligheter, som att markera syntaxen, auto pump, navigering.

Fördelar:

  • LIVEEDIT - Visa ändringarna i koden utan att behöva spara det;
  • interaktion med ramar, till exempel reagera, vinkel, meteor;
  • mer än hundratals inbyggda test för att upptäcka fel;
  • integration med Mocha, Protractor, Jest, Karma för enhetstest;
  • fullskalig debugger för felsökningskod på servern och kundsidorna;
  • navigering för samtidig arbete med flera filer;
  • kodkod, syntaxbelysning.

Nackdelar:

  • kostar 129 $ för det första året av arbetet
  • för nybörjare är den funktionella överflödig.

Visuell studiokod.

Visuell studio IDE, som syftar till att arbeta med koden. Det är lätt att behärska, bekvämt att använda, och samtidigt funktionell.

Fördelar:

  • kontextuell automation, både syntax och använda variabler, moduler, funktioner, etc.;
  • debugger med brytpunkter, kupuller, en interaktiv konsol;
  • stöd för snippets och mallar;
  • integration med git;
  • bekvämt och enkelt gränssnitt;
  • gratis redaktör.

Nackdelar:

  • få plugins.

Sublim text

Bekväm och tidstestad plattformsredigerare, med ett anpassningsbart gränssnitt och förmågan att göra triviala åtgärder med hjälp av snabbtangenter.

Fördelar:

  • snabbtangenter;
  • navigeringskod i form av ett minikort;
  • förmågan att ändra det visuella ämnet;
  • snippet support;
  • belysning, auto-pass av variabler och syntax;
  • flera riktningar på grund av användningen av pekare;
  • stöd för monteringssystem;
  • kontrollera syntaxen direkt under ingången;
  • automatisk lagring.

Nackdelar:

  • den fullständiga versionen kostar $ 70;
  • ingen kodanalysator för länkning av länkar.

Atomredaktör

Visas i 2015 kodredigerare från GIT, kopiera design sublimtext och inslagna i krom.

Fördelar:

  • mer än 50 öppna moduler;
  • bekvämt och trevligt gränssnitt;
  • fri;
  • autokopter och bakgrundsbelysningskod;
  • chef paket som redan är mer än 3,5 tusen;
  • flexibla editorinställningar, plug-in-paket, gränssnittet;
  • redigering och navigering med snabbtangenter.

Nackdelar:

  • låg prestanda;
  • tom utrustning "ur lådan."

Parenteser.

År 2014 skrämde parenteserna programmerarna och bristerna, men återvänder nu gradvis förtroende med ny kvalitetsfunktionalitet.

Fördelar:

  • rik utrustning "ur lådan";
  • live Preview-läge - Förhandsgranskning av redaktörerna i webbläsaren i realtid;
  • paketchef;
  • visa i koden som används bilder och färger;
  • autotopling och markering av syntax;
  • kodanalysator;
  • fri.

Nackdelar:

  • strikt orientering på webben och HTML + CSS + Javascript;
  • långsam utveckling;
  • låg hastighet på grund av förhandsgranskningsfunktionerna.

Nu för tiden javascript. Det upptar en ledande position, om vi pratar om klientdelen av mjukvaruprodukterna och används av professionella programmerare och webbutvecklare runt om i världen. javascript. - Detta är ett kraftfullt programmeringsspråk med många utökade funktionalitet och infrastrukturer som jquery, yui, sproutcore och cappuccino. Men han har vissa nackdelar, till exempel, JavaScript i olika webbläsare fungerar annorlunda och kan begränsa åtkomsten till webbplatsen och dess bekvämlighet för användaren. Men dessa faktorer bör inte begränsa förmågan hos detta underbara språk.

För många programmerare arbetar med javascript. Det kan tyckas lite svårt, men vi har många verktyg för JavaScript-utvecklare, som inte bara är lätta att använda, men visar också utmärkta resultat i minuter. Med kunskap i JavaScript kan du utföra några uppgifter - skriva dokumentation, redigering, testning, debugging, etc.

Dokumentationsverktyg

jGrousedoc är ett verktyg som gör att du kan generera API-dokumentationen från kommentarer i källkoden (program) och dokument, så alla nödvändiga begrepp, funktioner, variabler, klasser, gränssnitt, namnområden etc., vilket resulterar i en bra anpassad produkt .


JSDOC Toolkit är ett program som skrivs med JavaScript för att automatiskt generera mallformat och flerspråkig HTML-dokumentation från den kommenterade källkoden för Källa.

Kompressiva verktyg


JScompress är en online Javascript-kompressor som komprimerar JavaScript-filer med hjälp av kompressionsalgoritmerna som JSMIN och Packer, och de komprimerade JavaScript-filerna är helt enkelt idealiska för arbetsmediet, eftersom deras storlek minskar med 30% -90%.


Yui Compressor är en JavaScript-dimension som skapats för att få ett högre kompressionsförhållande än andra verktyg som kan ge. Från version 2.0 Yui Compressor komprimerar CSS-filer med porten baserat på det vanliga Isaac Schluter-uttrycket.


javaScript-kompressor komprimerar och optimerar dina JavaScript-filer. På grund av detta är de laddade snabbare och därigenom minska användningen av bandbredden. På grund av detta förblir namnen på funktionerna och de globala variablerna intakta.


Scriptalizer är ett onlineverktyg för att minska dina Java- och CSS-skript som låter dig spara ett hårddiskutrymme på grund av en minskning av kodstorlek. Det tar också bort extra utrymmen, flikar och tomma strängar, symboler på nya rader och kommentarer, och blockerar också begränsningar.

Formateringsverktyg


JSBeautifier är ett onlineverktyg som omformaterar och ändrar bokmärkes strecksats (från bokmärkes och appletens ord), "orubbliga" fragment av JavaScript-koden och packa upp skript, och även "Unravels" komplexa fragment av skript. Lägg bara in din kod och klicka på "Dekorera" -knappen.

Redaktörer och verktyg för IDE


Aptana Studio är en arbetsmiljö av webbutveckling från ett ledande företag inom sitt område, vilket kombinerar kraftfulla mjukvaruprodukter för att arbeta med HTML, CSS och JavaScript. Aptana Radrails är en helt färdigställd utvecklingsmiljö för att bygga professionella applikationer med en rik kodförlängning på Ruby & Rails, JavaScript, CSS och HTML.


Spket IDE är en kraftfull uppsättning verktyg för att utveckla JavaScript och XML, liksom för JavaScript, Xul / XBL och Yahoo Widget. Ger funktioner som kodutvidgning, syntaxmarkering och innehållsplan.


Komodo Edit är en gratis flerspråkig öppen källredigerare för enklare skrivkvalitetskod. Det stöder PHP, Python, Ruby, Perl och TCL, liksom JavaScript, CSS, HTML och Mall Språk som RHTML, Template-Toolkit, HTML-Smarty och Django.

Verktyg för felsökning


Firebug är det mest kraftfulla verktyget för webbutvecklingar som används för att kontrollera HTML och modifiera stilen och layouten i realtid, exakt nätverksanalys och prestanda. Javascript-justeraren kan användas med någon webbläsare.


Blackbird är ett open source-kodprojekt som erbjuder ett enkelt sätt att logga meddelanden på JavaScript och en attraktiv konsol för att visa och filtrera dem, vilket minimerar eller helt eliminerar användningen av alert () funktion.


Faux Console är ett Javascript som kan sättas in i dokumentet för att få den grundläggande inställningskonsolen i IE, och du kan använda YUI-filer eller Console.log () -filen () för att logga in information mellan webbläsare.


JS Bin är ett webbapplikation som hjälper JavaScript och CSS-kodfragment testas i ett specifikt sammanhang och aktiekod. Gör att du kan redigera och testa JavaScript och HTML.


JSON är det dataformat som idag blir popularitet och används i stor utsträckning på många webb 2,0 platser med Ajax. Många webbplatser som erbjuder API returnera data i JSON-format. Ofta i de data som tillhandahålls av JSON, komprimeras luckorna för att minska mängden överförda data. Den här webbplatsen ger dig ett snabbt och enkelt sätt att formatera JSON på ett sådant sätt att du kan läsa den.


Client Eclipse Marketplace (MPC) är ett rikt klientgränssnitt för visning och installation av lösningar baserade på Eclipse. MPC ger stark installation integration mellan Eclipse Arbetsmiljö och Eclipse Marketplace, plus utskriftslösningarna för den tredje parten.


Venkman är en JavaScript-justerare för Mozilla, baserat på webbläsare som Firefox 3.x, Netscape 7.x, Seamonkey 1.x och Mozilla Seamonkey 2.x. Justeraren är också tillgänglig som ett expansionspaket i XPI-format.


Js.Class är en uppsättning verktyg för att skapa objektorienterade program på JavaScript baserat på Ruby. Också erbjuder en kraftfull batchhanterare vars mål är att hjälpa till att ladda ner dina applikationer och stödja alla större webbläsare, inklusive Rhino, Node.js och Narhwal.

Verktyg för testning


Sugartest gör det enkelt att skriva test för JavaScript, det körs ovanpå Jsunittest, som en DSL, som har en installation, radering, kapslat innehåll, det finns inga beroenden och arbetet görs med helt enkelt och samtidigt uttrycksfull syntax.


jSLint tar Javascript-källa och skannar eller anteckningar. Om han hittar ett problem, visar det ett meddelande som beskriver det, och indikerar också den plats där det syntaktiska problemet inte ska vara och kontrollerar också valet av stil och strukturprogram.


Skapad av John Resig (Jan Odvarko) är FireUnit ett enkelt JavaScript API för ett enkelt test på sin loggning och visning i den nya Firebug-fliken.


Jsunit är en modul som testar strukturen på JavaScript-klientsidan, som utför JUNIT-porten, och innehåller även en plattform för att automatisera testning i olika webbläsare och datorer som kör olika operativsystem.


YUI-test är en testmiljö för JavaScript-lösningar baserade på webbläsare där du enkelt kan lägga till JavaScript-lösningar. Testmoduler. Yui-testet ger också en förbättrad feldefinitionsfunktion för de metoder som flyttar fel, asynkrona test för att testa händelser, kommunikation baserad på Ajax och mycket mer.


Jspec är en mycket liten, men mycket kraftfull testmiljö som använder sin egen grammatik och preprocessor, och innehåller många brevkontraktioner, läsbar syntax, support för Async och Rhino, en investerad beskrivning, en gemensam bild av åtgärden, support för tillbehör, AJAX imitation och mycket annat.


JSLITMUS är ett lätt verktyg för att skapa högspecialiserade kontroller i JavaScript, som fungerar med alla vanligaste webbläsare. Den har en öppen källa, mit-stil-licens, adaptiva testcykler och det kan också placeras på befintliga webbsidor eller applikationer.


En enastående JavaScript-kontroller används för att spåra på webbsidan av elementen A ;; och när den hittar ett HTML-element med inbäddade händelser, belyser den det här avsnittet med en röd ram och JavaScript-länkar: - Raspberry.

Andra användbara verktyg


Prettypink är en variabel javascript-dumper (dumper) inbyggd i webbläsaren, vilket ger dig möjlighet att skriva ut objekt av vilken typ som helst som ska visas under installationssessionerna i tabellformatet. Det kräver inte några stil- och bildtabeller, det kan fungera med ett oändligt antal kapslade föremål, skyddar mot cirkulära / repetitiva referenser och är helt kompatibel med JSLint.


Fireediff är en förlängning för Firebug, som är utformad för att spåra ändringar till DOM och CSS, det vill säga det övervakar ändringar som ger möjlighet att förstå programmets funktionalitet, och registrerar även de ändringar som gjorts och justerar siddisplayen.


JS-diagram är en Javascript-grafergenerator, som låter dig skapa grafik med olika mallar, till exempel histogram och enkla linjära grafer.


PagesPeed är ett Open Source Firefox / Firebug-tillägg, som används för att utvärdera produktiviteten hos webbsidor och få rekommendationer för att förbättra dem. Det påskyndar också arbetet på din webbplats, minskar användningen av bandbredd på linjen och kostnaden för värd.


Rockstar Web Profiler eller Razor innehåller tre komponenter, nämligen Rockstar Profiler Server för att analysera nätverksanslutningar och serverns prestanda, Rockstar Profiler Probe för att analysera klientsidans prestanda och Rockstar Profiler Console, som är information för att analysera analysen av data på prestanda.


Mobil (under Safari) Javascript-strukturen i en reducerad form väger mindre än 8 kb, hänvisar till Sizzle Laboratory i iPhone, stöder CSS och animationstransitioner, är objektorienterad och lätt expanderad.


php.js - ett Open Source-projekt för att överföra PHP-funktioner på hög nivå till Javascript-plattformar med låg nivå, t.ex. webbläsare, webbläsarutdelningar, luft- och SSJ-motorer, som V8, Rhino och Spidermonkey.


Jsspec är ett JavaScript "beteendestruktur" -dämpning, som visar skillnaden mellan de förväntade och reella värdena, visar tydligt skadelinjen, stöder det villkorliga stödet för IE 6 eller IE 7, Firefox 2 och Safari 3.


Mochaui är ett bibliotek med användargränssnitt i form av ett webbapplikation baserat på Mootools Javascript som används i webbapplikationer, webbelement på skrivbordet, webbplatser, widgets och individuella dialogrutor.


Highlight.js markerar syntaxen i koden i bloggar, på forumet och i allmänhet på någon webbsida. Finns automatiskt blockkod, definierar språket och belyser det.

Biblioteksverktyg och komponenter för JavaScript


Uppladdning är ett plugin för jquery, vilket gör det enkelt att integrera flera nedladdningar till din webbplats och som kräver Flash eller något annat internt utvecklingsspråk. Huvudimplementeringen är ganska enkelt och erbjuder stora möjligheter att ändra för erfarna användare.


Burst är ett exempel på en karakteristisk animering med JavaScript och HTML5-teknik och utan användning av Flash-teknik. SVG-filen är skapad med Inkscape. Burst är syntaktiskt lik jquery.


JStestDriver bygger en testmaskin på JavaScript, som enkelt kan integreras i kontinuerliga bildsystem; Det låter dig snabbt köra test på olika webbläsare för att underlätta utvecklingen av TDD-stilar och ger snabb testkörning, helt kontrollerad DOM, kontroll från kommandoraden och så vidare.


BookLayllet är en Packer-Bookbird-kod, programmerad Ladda ner något innehåll på en annan sida i det öppna fönstret med Div och Iframe Layers. Fungerar med Firefox, Safari och Opera-webbläsare, men fungerar inte med Internet Explorer.


javascriptools är en uppsättning komponenter, funktioner och JavaScript-klasser, där funktioner utför grundläggande funktioner med objekt, linjer, datarrayer, formulärfält och så vidare. Satsen har ett dynamiskt bord som stöder sidsökningen av filer, deras sortering och redigering och är fullt anpassningsbar med CSS.


liteajax är bevis på begreppet ljusa Ajax-klasser.


JSPDF är ett bibliotek för att generera PDF-dokumentation med JavaScript och öppna träd. Den kan användas i Firefox Extensions, JavaScript Server-sida med URL-data i vissa webbläsare.


Narwhal är en plattform, en JavaScript multi-tolkningsutvecklingsmiljö, som bygger javascript-applikationer och strukturer som nitro. Inkluderar pakethanteraren, modulsystemet och standardbiblioteket för flera javascript-tolkar.

Användbara JavaScript-bibliotek och andra verktyg


Dukduk är ett enkelt och diskret sätt att lägga till stil och bild en åtgärd i dina HTML-element-tabeller. Den har en funktion att tilldela jämn / udda klassnamn till alternativa linjer, lägger till namnen på klasserna för att placera musen över och utanför det specifika området.


Moousture är ett musförskjutningsbibliotek, skrivet endast på JavaScript och har förmågor och flexibilitet att rulla för dig. Biblioteket är skrivet på mootools, som följer objektorienterade standarder. Hennes mål är att börja arbeta med den framtida musrörelsestrukturen i någon webbläsare, inklusive moderna mobila enheter.


jQuery Tools är en samling av de viktigaste komponenterna i användargränssnittet för moderna webbplatser, där alla verktyg kan användas tillsammans, expandera, konfigurera och återvinnas. Den används av stora platser runt om i världen.


Tipimage används för att skapa och styra verktyget ovanför bilderna, skapar fyrkantiga delar av bilder och gör den till en beskrivning som visas i form av tiler av spets. Stödjer också användningen av en speciell återuppringningsfunktion.


qGallery är ett litet program i form av en kommandorad som behandlar bilder i JPEG-format och innehåller specifikt ljudfiler i vissa mappstrukturer för att bilda ett statiskt HTML-galleri för publikationer, skapar automatiskt bildindex för förhandsgranskning, kommentarer för varje bild och ytterligare bilder och HTML kan läggas till senare.


LivePipe UI är en uppsättning högkvalitativa widgets och kontroller för Web 2.0-applikationer med hjälp av Prototype Javascript-ramverket, där varje kontroll är välprövad, helt öppen, dokumenterad och flexibelt ersatt med en mer förenklad version i webbläsare utan Javascript Aktiverad.


javaScript Virtual Keyboard är ett flera användningssystem för att lägga till ett grafiskt tangentbordsgränssnitt för att testa fält, lösenordsinmatningsfält och textfält. Det ger också enkel åtkomst till specialtecken.


Skriptet på diskretbord kan sprida bordet med ränder, stöder markörens rörelse över den horisontella och vertikala menyn och effekterna och effekterna för att flytta markören över de enskilda cellerna kan fungera med Rowspans och Collspans, och fungerar också snabbt i Internet Explorer.


Glassbox är ett ljust JavaScript-användargränssnitt som använder prototyp och script.aculo.us för att uppnå vissa effekter. Glassbox gör att du enkelt kan bygga ljusa ljusramar, färgscheman och effekter "under" Flash.

Glimmer är ett interaktivt designverktyg eller ett Windows-program som enkelt kan skapa animering och en känsla av interaktion, liksom andra effekter. Det genererar också JQuery, XHTML och CSS.


Bookmarklets används för att utföra användbara funktioner, bookmarklet kan du skapa en webbadress från JavaScript och tillämpa den på dina favoriter. Ange din JavaScript-kod, och bokmärkes gör allt annat.


javaScript REGEX Generator genererar det korrekta i förhållande till de grundläggande uttryck där du bara bör ange data för testning och markera de delar som regex måste jämföra. Beta-versionen av verktyget gör att du kan lägga till sju grupper.


Kompatibilitets huvudbord innehåller länkar till separata tabeller. Det har också nycklar till kompatibilitet med tabeller som bestäms helt, med svårigheter eller inte stöds alls.

Det är ingen hemlighet som i vår tid Javascript. blev ett av de mest populära programmeringsspråk. På den avlägsna 90-talet, vid tidpunkten för språket när det skapades med det enda syftet att lägga till webbsidans interaktivitet och förbättra processen med interaktion med användaren, som skulle ha trott att han skulle uppnå så oöverträffad höjder. När allt kommer omkring, nu kan du göra nästan vad som helst. Vill du skriva en webbplats: och backend och frontand på javascript? Varsågod! Vill du skriva en mobilapplikation på JavaScript? inga problem. Programmera mikrokontroller - och sedan kommer Javascript till ditt hjälpmedel.

Det finns naturligtvis små nackdelar i tillvägagångssättet att använda JavaScript överallt, men om du tänker på hur mycket tid och styrka kan sparas genom att bara studera något av språket, särskilt om samma app ska fungera på olika plattformar. Olika plattformar säger? Hmm ... exakt - olika plattformar - nu har JS råd med skrivbordsapplikationer för Windows, Linux, Mac, hur frågar du? Svaret är enkelt: möts - Nw.js..

Node.js. - En mjukvaruplattform baserad på V8-motorn som sänder vårt skript i maskinkoden. Denna plattform grundades 2009 främst att arbeta med backend-platserna.

Webkit. - En fri motor som utvecklats av Apple. För första gången meddelades i Safari 2003
Så, den kod som skrivs i JS för denna teknik kommer att finnas tillgänglig som node.js-moduler och standard webbläsare API (respektive WebKit)

Snabbstart

Allt detta är säkert bra, men varför börja? På GitHub kan du hitta och ladda ner förvaret med källkod. Här hittar du direkta länkar för nedladdning under plattformen som utvecklingen kommer att genomföras. Bland annat behöver vi den installerade node.js.

När den nödvändiga programvaran är nedladdad och installerad skrev du din ansökan på din favorit JS (läs det ytterligare) och lokaliserade allt i en mapp. Halfped gjort, nu är det fortfarande det svåraste och länge packa allt i en fil och förbereda för distribution. För att förenkla kan du använda färdiga bibliotek, som NW-Builder. Installationen av biblioteket är inte svårt om du redan har arbetat med node.js. Som du vet, i kompositionen av node.js kommer in nPM Package ManagerMed vilken du behöver jobba från kommandoraden. För att sätta något bibliotek måste du utföra kommandot:

\u003e Npm installera [biblift_name] [Alternativ]
Observera att biblioteket kan installeras, både lokalt och globalt, för den lokala installationen, använd alternativet --Save-dev., för global -G.. Således kommer vi att leverera vår samlare för NW.js globalt genom att slutföra kommandot:

\u003e NPM Installera NW-Builder -g
För att samla in vår ansökan måste du utföra kommandot (med ett stort antal alternativ finns i dokumentationen):

\u003e NWBUILD -P [Platform Name] -O [path_papka_tela_bequito_versiy] [path_do_divets]
Följande värden kan vara som plattformens namn: Win32, Win64, OSX32, OSX64, Linux32, Linux64.

Under utvecklingen är det inte nödvändigt att samla in ansökan varje gång, du kan helt enkelt starta den som den och den kommer att öppnas i ett separat fönster. För att göra detta, kör NW.exe-programmet från kommandoraden och överför sökvägen till mappen till din ansökan som parametrarna. Dessutom, om du arbetar under Windows, kan du helt enkelt dra mappen med källkoden till JS med Drag-N-Drop-metoden (Observera att hela mappen är hela mappen) i NW.exe.

Hej världen!

Nu när du vet hur man startar programmet, hur man monterar den i en fil, låt oss skriva någonting. Med tradition börjar förtrogenhet med den nya plattformen med skrivandet av Hello, World Application.

För denna ansökan behöver vi inte ens Javascript., Bara Html.. Skapa en mapp som heter Hej världen. Position inuti filen index.html med följande markup:

Hej världen.

Hej, värld, från nw.js

Dessutom, för varje applikation under nw.js behöver du en fil som måste kallas paket.json.. Det kommer att ta information för att bygga en ansökan. Skapa det enklaste filalternativet och placera i mappen Hej världen. Så:

("Namn": "Hello-World", "Version": "1.0.0", "Beskrivning": "Första ansökan", "Main": "index.html", "Författare": "Utvecklare", "Fönster ": (" Toolbar ": Falsk," Bredd ": 500," Höjd ": 200))
Innehållet i filen är tydliga utan förklaring (notera det obligatoriska fält bara huvud och namn). I huvud. Du måste skriva en fil med märkning, vilket kommer att vara entrépunkten i ansökan. Sektion fönster. Ställer in fönsterparametrarna (i det här fallet stänger vi av verktygsfältet och ställer in storleken på fönstret 500x200).

Dessutom kan du konfigurera sådana fält som (för hela listan med alternativ, kontakta dokumentationen):

  • ikon - Ange sökvägen till ikonen (överväga standarden)
  • placera - Du kan ange läget för fönstret när du laddar ( nULL, centrum eller mus.)
  • min_width., min_height, Maximal bredd., maximal höjd - Fönsterstorleksgränsen
  • reserbar - Ett logiskt värde som kan visas av användaren för att ändra storleken på fönstret
  • fullskärm. - Aktivera helskärmsläge
  • kiosk. - Slå på kioskläget
  • transparent - Gör ett fönster transparent
Applikationen är skapad och du kan köra den. Efter att ha startat (hur man gör det, se avsnittet ovan) Du måste få följande fönster:

Applikationen är skriven, men i det bara ett div-element och det finns ingen logik alls och vad man ska göra om vi är rika på elementen i markup och komplexa logik? Ett element i en konfigurationsfil kommer att hjälpa till verktygsfältsom vi installerade i falska. För att göra de tillgängliga defyllningsverktygen är det nödvändigt installera verktygsfältet i sant. Efter att ha gjort det när du startar programmet får vi följande fönster:

Efter att ha tryckt på knappen i övre högra hörnet öppnas ett annat fönster där de välbekanta utvecklarverktygen kommer att visas:

Arbeta med inbyggda kontroller

Nw.js tillåter dig att arbeta med inbyggda kontroller. Överväga arbete på exemplet meny. För att arbeta med inbyggda UI-kontroller i NW.js måste du använda modulen Nw.guisom kan anslutas enligt följande:

Var gui \u003d kräver ("nw.gui");
Allmän mall för användning av kontroller:

Var element \u003d nytt gui.elementnamn (tillval);
För att skapa menyalternativ kan du således använda följande design:

Var meny \u003d ny gui.menu ();
Dessutom kan alla egenskaper hos objektet som vi skapade enkelt ändras med standard JS-strukturer, till exempel enligt följande:

Meny.title \u003d "(! Lang: Ny titel"; !}
Menyn är skapad, nu måste du fylla den, för manipulering av barnelement. Det finns metoder:

Meny.append (New Gui.Menuitem ((etikett: "Etikett av menyalternativ")); Meny.RemoVeat (0);
Dessutom kan du använda metoden för mer flexibla tillsatser i menyn föra in., vars parametrar du behöver passera Menuitem. och positionsnumret där du ska infoga det ( position innan det första elementet motsvarar 0).

För att komma åt de skapade elementen kan du använda fastigheten. objekt.:

Meny.items.title \u003d "(! Lang: Ny titel" !}
Observera att det är omöjligt att direkt skapa saker:

Meny.items \u003d new gui.menuitem (); // fel
Det viktigaste när du arbetar med inbyggda kontroller, det kommer ihåg det eventuellt fel när du arbetar med dem kan leda till kollaps av hela ansökan.Därför är det nödvändigt att vara extremt uppmärksam och, om möjligt, vid avlägsnande av objekt, också tilldela ett variabelt värde null. På det här sättet för att ta bort kontrollen, Du kan göra följande:

Control.Remove (); Kontroll \u003d null;
För bekvämare operationer med kontroller är de ärvda från EventeMitter, så bra nyheter är att vi enkelt kan arbeta med händelser, till exempel:

Menuitem.on ("Klicka", funktion () (// gör något användbart));
Menyn skapades, men om du startar programmet, kommer du inte att se någon meny. För att visa menyn finns det en popup-metod, i vars parametrar är det nödvändigt att överföra koordinaterna för att visa menyn.

För att visa huvudfunktionerna i menyn, lägg till följande skript till det skapade projektet. Hej världen.:

Var gui \u003d kräver ("nw.gui"); VAR MENU1 \u003d NEW GUI.MENU (); Menu1.Append (New Gui.Menuitem ((Etikett: "Artikel 1")); var undermeny1 \u003d ny gui.menu (); undermeny1.Append (New Gui.Menuitem ((etikett: "Artikel 2")); Menu1.Append (NEW GUI.MENUITEM ((Etikett: "Undermeny", undermeny: undermeny1))); document.body.addeventlistener ("contextmenu", funktion (EV) (EV.PreventDefault (); meny1.Popup (EV.X, EV.Y); returnera falskt;));
Efter att ha startat programmet kan vi se den skapade kontextmenyn för kropp. Således kan vi definiera snabbmenyn för något element.

Lägg till taggar