När vi jobbar med AngularJS och vi börjar läsa dokumentationen, det första vi ser är ordet OmfattningDetta kan översättas till spanska som ett tillämpningsområde, men användningen inom denna ram är mycket bredare.
Det är därför vi måste förstå att det verkligen är det Omfattning och hur det beter sig i våra applikationer, på så sätt kan vi ta ett steg mellan att försöka använda AngularJS och använd den med bas, övertygelse och inte bara genom att upprepa kod.
Det mest intressanta är att som AngularJS är helt inbyggd JavaScript, vi kan ta språkets begrepp och tillämpa dem i studien och förståelsen av ramverktygen, vilket ger oss en ytterligare kompetensnivå för att kunna utveckla logiken som vi tycker för våra applikationer
Krav
1- För att uppfylla denna handledning behöver vi en webbserver som Wamp, eller om vi befinner oss i miljöer som Linux en konfiguration Lampa Det kommer att räcka för oss, tanken är att kunna betjäna våra filer som innehåller AngularJS och inte bara öppna ett dokument HTML.
2- Vi måste också ha en rich text -editor som gör att vi kan skriva nödvändig kod för våra exempel, detta kan vara Sublim text eller Anteckningsblock ++.
3- Slutligen måste vi ha tillgång till Internet för att använda inkluderingen av AngularJS via dess CDN eller ha laddat ner filen som innehåller ramarna för att betjäna den lokalt.
Vad är omfattningen?
Det är inget annat än ett enkelt föremål JavaScript som har möjlighet att lagra en nyckelvärdesstruktur, förutom att kunna lagra fastigheter. Detta hjälper oss mycket eftersom om vi ser det från den synvinkeln kan vi tillämpa de grundläggande begreppen i programmeringsspråket
Hur fungerar det?AngularJS är ansvarig för att skapa detta objekt automatiskt och bädda in det i vår programkörning, därav dess namn är omfattning, eftersom det tillåter oss att manipulera och komma åt modellernas värden och också fungera som ett gränssnitt för att kommunicera med vyn. Denna struktur är det som gör att vi kan använda Omfattning inuti våra styrenheter och lägga till egenskaper, som vi kan kalla direkt i vyn, och därmed uppfyller vi en cykel där allt är anslutet och relaterat inom vår applikation.
I följande bild ser vi hur skalan är eller hur AngularJS genererar annorlunda Omfattningar, även om alla härrör från Omfattning av elementet som innehåller dem utom för Root Scope som är den första som genereras. Naturligtvis, om det finns två element på samma nivå inom rotomfånget, kommer de båda att ärva från det.
FÖRSTORA
Hur fungerar prototypen?
Till skillnad från språk som Java, C ++ och andra, JavaScript hanterar arvsbegreppet annorlunda, det är därför vi måste lära oss vad som används prototyp vilket inte är mer än en metod som finns inom klasskonstruktörer som gör att vi kan lägga till nya egenskaper i vår kod.
Detta trots att det är något typiskt för JavaScript tillåter oss att förstå lite mer hur vi kan få några resultat, förutom att hjälpa oss att förstå hur Omfattning inom AngularJS.
I följande exempel kommer vi att se hur vi skapar en klass med särskilda egenskaper eller attribut, sedan genom prototyp Vi kan lägga till en ytterligare egendom i vår klass och därmed genom att göra instansen kan vi komma åt den.
Det intressanta är att det finns en metod som hjälper oss att verifiera om något attribut är typiskt för klassen, om denna metod returnerar ett falskt värde så vet vi att det är ett attribut som härrör från ett arv med prototyp. Låt oss se koden som representerar allt detta:
DokumenteraLåt oss nu se hur på konsolen JavaScript vi får de resultat vi söker:
Vi märker sedan hur metoden hasOWnProperty Det hjälper oss att identifiera de ursprungliga attributen eller egenskaperna för klassen eller inte. Således kan vi förstå om vi har skapat ett effektivt arv eller inte, eftersom vi kan inse hur vi utökar attributkapaciteten för en klass.
ViktigDenna typ av arv genom prototyp är det som gäller AngularJS när man skapar det olika Omfattningar av ett dokument i en applikation, där det rör sig genom trädet SOL där först identifieras om egendomen finns ng-app, i det ögonblicket tro $ rootScope, då hittar du en kontroller en variabel $ omfattning som härrör från tillämpningen av metoden $ rootScope.new ().
Och så eskalerar den när den hittar interna element i varandra, som ärver från den omedelbart tidigare strukturen och tar dess funktioner härledda från $ rootScope och dess egna funktioner.
I följande exempel har vi utvecklat en applikation där vi har två kontroller, på detta sätt ser vi hur vi genom arv av omfattning de olika egenskaperna eller attributen till samma ärvs, tills det resulterar i en kapslad struktur som kan komma åt föräldrarnas egenskaper och utöka applikationens funktioner som sådana. Låt oss se koden:
{{redaktörer}} har böcker från: {{category}}
De mest populära böckerna från {{redaktörer}} är:
- {{bok}}
Detta kan ses som lite långsökt, men det är det bästa sättet att förstå hur variabeln $ omfattning fungerar inom våra applikationer och därmed kunna tillämpa detta inom vår logik för att få ut det mesta av ramverktygen. Låt oss se i följande bild hur vår tidigare applikation ser ut och hur de förklarade punkterna har uppfyllts:
Vi märker sedan hur listan över böcker tillhör objektet Omfattning mer internt, men eftersom vi inte definierar det redaktionella attributet kan vi använda det vi definierar i den överordnade kontrollen och nå slutsatsen att vi förväntade oss att använda prototyp förbi AngulaJS.
Betraktaren som ett avancerat koncept
Det finns tillfällen när vi vill fortsätta och på något sätt övervaka en viss situation, det är här objektet kommer in. $ klocka, vilket gör att vi kan göra exakt vad vi förklarar.
Hur fungerar det?Genom att lägga till det som lyssnare av något element i vår applikation, kommer detta objekt att registreras varje gång det ändras. På detta sätt kan vi tillämpa villkor varje gång en händelse som vi bestämmer inträffar. Ett exempel kan vara när vi bygger en kundvagn, om användaren lägger till mer än en vara kan vi visa ett meddelande, eller om han försöker köpa flera gånger frågar vi honom om han har problem.
Detta vid första anblicken kan verka som något mycket avancerat, men AngularJS tar det nära våra händer, utan att göra mycket komplikationer. Objektet $ klocka Det kan inte bara observera ett specifikt värde, vi kan också tilldela det att göra det med en samling, vilket ger oss möjlighet att ta hänsyn till flera värden samtidigt och därmed uppnå mer komplexa resultat än med den tidigare formen .
Med detta har vi avslutat med denna handledning, vi har lärt oss att förstå vad Omfattning inom AngularJS och för detta har vi förlitat oss på de mest abstrakta begreppen JavaScript, vilket visar att detta språk ger oss alla verktyg för att uppnå jobb lika avancerade som samma ramverk som vi pratar om, men att om vi behärskar dess koncept kan vi göra verktygen vi använder något överlägset.
Gillade du och hjälpte denna handledning?Du kan belöna författaren genom att trycka på den här knappen för att ge honom en positiv poäng
