Repúbl

icaBoli
var
ianadeVenezuela
Mini
ster
iodelPoderPopul
arParalaDefensa
Uni
ver
sidadNaci
onalExperi
mentalDelasFuerzasArmadasNaci
onal
SanTome-Edo.Anzoat
egui

JAVASCRI
PTJQUERYYAJAX

Tut
or: Autor:
Kar
inal
eal

Cl
26124152

Sant
ome,
4denovi
embr
e
 I
NTRODUCCI
ON
Javascr i
tesunl enguaj edepr ogr amaci ónqueseut ili
zapar acr earpági nawebdi námi caque
i
ncor por aef ect oscómot ext oqueapar eceydesapar ece,ani maci onesqueseact ivanalpr obar
bot onesyvent anascomomensaj esdeavi soalusuar ioespecí ficament ej avascr itpesun
l
enguaj edepr ogr amaci óni nter pret adoesoqui er edeci r ,quenoesnecesar iocompi larl os
progr amaspar aej ecut arlo.Javascr iptnosepuedepr obardi rectament ei nt er acci ónondade
navegadorconot rospr ogr amassi nnecesi daddepr ocesosi ntermedi os. JavaScr iptsedi señó
con una si nt axi s si mi lar all enguaj e de pr ogr amaci ón C,aunque adopt a nombr es y
convenci onesdell enguaj edepr ogr amaci ónJavasi nembar goJavayJavaScr i
ptnoest án
relaci onadosyt i
enensemánt icasypr opósi tosdi ferent esseut i
lizapr inci palment eenell adodel
cli
ent ei mpl ement andocomopar tedeunnavegadorwebper mi ti
endocr eari nteracci ónconel
usuar ioaunqueact ual ment eesposi bleej ecut arJavascr iptenelpr opi oser vi dor .
JavaScr iptes
unaBaséacci ónpr ogr amaci óni nter pret ado,di al
ect odelest ándarECMAScr iptsedef i
necomo
orient ado a obj et os,basado en pr ot otipos,i mper act ivo,débi lment et ipado y di námi co. A
princi piosdel osañosConunasapl icaci oneswebcadavezmáscompl ejasyunavel oci dadde
navegaci ónt anl ent a,sur giól anecesi daddeunl enguaj edepr ogramaci ónqueseej ecut ar aen
elnavegadordelusuar i
o.Deest af or ma, sielusuar ionor el l
enabacor rect ament eunf ormul ar io,
nosel ehací aesper armuchot iempohast aqueelser vi dorvol vi eraamost rarelf or mul ario
i
ndi candol oser r
or esexi stent es.
BrendanEi ch,unpr ogr amadorquet rabaj abaenNet scape,pensóquepodr í
asol uci onarest e
probl emaadapt andoot r
ast ecnol ogí asexi st entes( comoScr iptEase)alnavegadorNet scape
Navi gat or2. 0,que i ba a l anzar se en 1995.I nicial ment e,Ei ch denomi nó a su l enguaj e
LiveScr ipt.Post er iorment e, Net scapef irmóunaal ianzaconSunMi crosyst emspar aeldesar rollo
delnuevol enguaj edepr ogr amaci ón.Además,j ust oant esdell anzami entoNet scapedeci dió
cambi arelnombr eporeldeJavaScr i
pt .Lar azóndelcambi odenombr ef ueexcl usivament epor
mar ket i
ng,yaqueJavaer al apal abr ademodaenelmundoi nf ormát i
coydeI nt er netdel a
época.
La pr i
mer a ver sión de JavaScr i
ptf ue un compl et o éxi to y Net scape Navi gat or3. 0 ya
i
ncor por abal asi gui entever sióndell enguaj e,l aver sión1. 1.Almi smot iempo,Mi cr osof tlanzó
JScr i
ptconsunavegadorI nter netExpl or er3.JScr i
pter aunacopi adeJava
Par aevi tarunaguer r
adet ecnol ogí as,Net scapedeci dióquel omej orser íaest andar izarel
l
enguaj eJavaScr ipt.Deest af or ma,en 1997 seenvi ól aespeci ficaci ón JavaScr ipt1. 1 al
organi smoECMAEur opeanComput erManuf actur ersAssoci ation) .
ECMAcr eóelcomi téTC39
conelobj et i
vode" estandar i
zardeunl enguaj edescr iptmul t
iplat afor maei ndependi ent ede
cual qui erempr esa" .Elpr imerest ándarquecr eóelcomi téTC39sedenomi nóECMA- 262,enel
quesedef ini óporpr i
mer avezell enguaj eECMAScr ipt.Porest emot ivo, al gunospr ogr amador es
pref ieren l a denomi naci ón ECMAScr iptpar ar ef erirse all enguaj e JavaScr i
pt.De hecho,
JavaScr iptnoesmásquel ai mpl ement aciónquer eal i
zól aempr esaNet scapedelest ándar
ECMAScr i
pt.
Javascr i
ptnaci óconl anecesi daddeper mi ti
ral osaut oresdesi tiowebcr earpági nasque
per mi tani nter cambi arconl osusuar ios, yaquesenecesi tabacr earwebsdemayorcompl ejidad.
ElHTMLsol oper mi tí
acr earpági nasest áticasdondesepodí amost rart ext osconest il
os,per o
senecesi t
abai nt eract uarconl osusuar ios.
 QueesJavascr
ipt
?
Javascriptesunl enguaj econmuchasposi bil
idades,utili
zadopar acrearpequeñospr ogramas
queluegosoni nser tadosenunapági nawebyenpr ogramasmásgr andes, ori
entadosaobj etos
muchomáscompl ejos.ConJavascr i
ptpodemoscr eardi ferentesef ectosei nteractuarcon
nuestrosusuar ios.Est elenguajeposeevar i
ascar acterí
sticas,ent r
eel l
aspodemosmenci onar
queesun l enguaj ebasado en acci onesqueposeemenosr est
ri
cciones.Además,esun
l
enguaj equeut il
izaWi ndowsysi stemasX- Wi ndows,gr anpar t
edel apr ogramaciónenest e
l
enguaj eest ácent radaendescr i
birobj et
os,escr i
birfuncionesquer espondanamovi mientos
delmouse, apert
ur as, uti
li
zaci
óndet eclas,cargasdepági nasent reotr
os.
Esnecesar ioresal tarquehaydost iposdeJavaScr ipt:porunl adoest áelqueseej ecutaenel
cl
iente,esteeselJavascr i
ptpropi
ament edicho,aunquet écnicament esedenomi naNavi gator
JavaScript.Perot ambi énexist
eunJavascr iptqueseej ecutaenelser vidor,esmásr eci
entey
sedenomi naLi veWi r
eJavascr i
pt

JAVASCRI
PTENLAACTUALI
DAD
JavaScr ipt,es uno de l os más pot ent es e i mpor tantes lenguaj es de pr ogr amaci ón en l a
actual i
dad,port resenf oquescl aros:esút il
,pr ácticoyest ádi sponibleencual quiernavegador
web. JavaScr iptescr eadoporBr endanEi chyvi ol al uzenelaño1995conelnombr ede
LiveScr ipt,quel uegof uenombr adoJavaScr ipt,nacecomounl enguaj esenci ll
odest inadoa
añadi ral gunascar acter í
st i
casi nter
activasal aspági nasweb.Si nembar go,hoyendí aha
crecidodemaner aacel er adayesell enguaj edepr ogramaci ónqueseut il
izaencasit odosl os
siti
oswebenelmundo. ElpoderdeJavaScr i
ptest ádi sponi blepr i
ncipalmenteenl adof ront end,
agregandomayori nteract i
vidadal aweb, tambi énpuedesusarl aslibrer
íasyf ramewor kcomo:
j
quer y, angul ar,backbone, reactydemás, escritassobr eJavaScr i
pt,yquet eayudanacr earuna
mej orexper i
enciadeusuar ioennuest rossi tiosweb.Dei gualmaner aJavaScr iptsepuede
util
izarenl osser vidoresweb.Node. JSest umej oropci ónpar ausarest el enguaj edell ado
servidor .Mul t
iplatafor ma,yaquesepuedeut i
lizarenWi ndows,Li nuxoMacoenelnavegador
det upr eferencia,esI mper ati
voyest ructur ado, medi anteunconj untodei nstrucci onesi ndicaal
comput adorquét ar eadeber eali
zar.
prot ot i
pado, clasespar aelusodeher enci aOr i
ent adoa
objetos y event os,es I nterpretado,no se compi la para poderej ecutarse. Estas son l as
caract erísti
casquehacendej avascri
ptunl enguaj equet eper mi t
edesar r ollarapl i
caci ones
gigant esypot entes, comol oes:googl edoc, facebook, twitt
erei nclusocapazdeej ecutarseen
elser vidorcomounser vidorWebmuyr ápi do.

Var
iabl
esenJavascr
ipt
Aunquet odaslasvari
abl
esdeJavaScr
iptsecreandelami smaforma(mediant
elapal
abra
reser
vadavar),l
aformaenlaquesel
esasignaunval
ordependedelt
ipodeval
orquesequi
ere
almacenar(números,t
ext
os,
etc.
)

Ti
posdevar
iabl
es

Numér i
cas
Seutili
zanparaalmacenarvaloresnuméricosenter
os(l
lamadosintegereningl
és)odeci
males
(l
lamadosf l
oateninglés)
.Enest ecaso,elvalorseasi
gnai ndi
candodirect
amenteelnúmero
enter
oodeci mal.Losnúmer osdecimalesuti
li
zanelcaráct
er.(punto)envezde,(coma)para
separarlapart
eenter
ayl apartedeci
mal:

vari
va=16; //var
iabl
etipoent
ero
vart
otal=234.
65; /
/vari
ableti
podeci
mal
Cadenasdet
ext
o

Seutil
izanparaalmacenarcaracter
es,pal
abr
asy/of
rasesdetexto.Paraasignarelvaloral
a
vari
able,seenci
err
aelvalorentrecomill
asdobl
esosimpl
es,paradeli
mitarsucomi enzoysu
fi
nal:

varmensaje="Bienveni
doanuestr
osit
ioweb"
;
varnombreProducto='Product
oABC'
;
varl
etr
aSelecci
onada=' c'
;

Enocasiones,elt
extoquesealmacenaenl asvari
abl
esnoestansenci
ll
o.Siporej
empl
oel
propi
otextoconti
enecomil
lassi
mplesodobles,l
aestrat
egi
aquesesi
gueesladeencer
rarel
text
oconlascomill
as(si
mplesodobles)quenouti
li
ceelt
ext
o:

/*Elcontenidodetexto1t
ienecomill
assimples,porl
oque
seencierraconcomil
lasdobl
es* /
vartext
o1=" Unafr
asecon'comil
lassimples'dent
ro"
;

/*Elcontenidodet
exto2t
ienecomi l
lasdobl
es,porloque
seencierr
aconcomil
lassi
mpl es*/
vartext
o2=' Unafr
asecon"comil
lasdobles"dentr
o';

Noobstante,avecesl ascadenasdet ext

ocont ienentantocomill
assimplescomodobl es.
Además,existenotroscar act
eresquesondi
fíci
lesdei ncl
uirenunavari
abl
edet exto(t
abulador,
ENTER,etc.
)Par ar esolverestosprobl
emas,JavaScr i
ptdefineunmecanismopar ai
ncluirde
for
masencillacaracteresespecial
esyprobl
emát i
cosdent r
odeunacadenadet exto.

Elmecanismoconsist
eensust
it
uirelcarácterpr
obl
emát i
coporunacombinaciónsi
mpl
ede
car
act
eres.Acont
inuaci
ónsemuestr
alatabladeconver
siónquesedebeut
il
izar
:

Sisequiereinclui
r.
.. Sedebeincl
uir
..
.
Unanueval ínea \n
Untabulador\ t
Unacomi ll
asimpl e \ '
Unacomi ll
adobl e \ "
Unabarrainclinada \ \
Deestaf orma,elejemploanteri
orquecont
ení
acomi
ll
assi
mpl
esydobl
esdent
rodelt
ext
ose
puederehacerdel asi
guient
eforma:

vart
ext
o1='
Unaf
rasecon\
'comi
ll
assi
mpl
es\
'dent
ro'
;

vart
ext
o2="
Unaf
rasecon\
"comi
ll
asdobl
es\
"dent
ro"
;

Ar
ray

Enocasi
ones,al
osarr
aysselesl
lamavect
ores,matr
iceseincl
usoarr
egl
os.Noobstant
e,el
tér
minoarr
ayeselmásuti
li
zadoyesunapalabracomúnmenteacept
adaenelent
ornodela
progr
amaci
ón.

Unar r
ayesunacoleccióndevar
iabl
es,quepuedensertodasdelmismoti
poocadaunadeun
ti
podi f
erent
e.Suutil
idadsecompr endemejorconunej emplosenci
ll
o:siunaapl
icaci
ón
necesi
tamanejarl
osdíasdelasemana,sepodrí
ancrearsi
etevar
iabl
esdeti
potext
o:

vardi
a1="
Lunes"
;
vardi
a2=" Mart
es";
..
.
vardi
a7=" Domingo"
;
Aunqueelcódigoanteri
ornoesincorrect
o,síqueespocoef ici
ent
eycompl i
caenexcesol a
progr
amación.Sienvezdel osdíasdel asemanaset uvi
eraqueguardarelnombredel os
meses delaño,elnombr e de t
odos los países delmundo o las medici
ones di
arias de
temperat
uradelosúlt
imos100años,setendrí
anquecr eardecenasoci
entosdevari
ables.

Enesteti
podecasos,sepuedenagrupartodaslasvari
abl
esrel
aci
onadasenunacol
ecci
ónde
var
iabl
esoarr
ay.Elej
emploanter
iorsepuederehacerdelasi
gui
ent
eforma:

vardias=["Lunes","
Mar t
es"
,"Miér
col
es",
"Jueves",
"Vi er
nes",
"Sábado",
"Domi ngo"
];
Ahora,unaúni cavariabl
ellamadadiasalmacenat odoslosvaloresrel
acionadosentr
esí,en
estecasol osdíasdel asemana.Paradefinirunar r
ay,seutil
izanloscar act
eres[y]para
del
imitarsucomi enzoysufinalyseuti
li
zaelcarácter,(coma)parasepararsuselement
os:

varnombr e_arr
ay=[ valor
1,valor
2,.
..
,val
orN]
;
Unavezdef ini
do un ar r
ay,esmuysenci l
lo accederacadauno desuselementos.Cada
elementoseaccedei ndi
candosuposi ci
óndent rodelarr
ay.Laúni
cacompli
cación,quees
responsabledemuchoser r
orescuandoseempi ezaaprogramar
,esquel
asposici
onesdelos
elementosempi ezanacont arseenel0ynoenel1:

vardi
aSel
ecci
onado=di
as[
0]; //di
aSel
ecci
onado="Lunes"
varot
roDi
a=dias[
5]; /
/otroDi
a="Sábado"

Enelejemploant
eri
or,lapri
merainst
rucci
ónquiereobtenerelpri
merelement
odelar
ray.Para
el
lo,seindi
caelnombredelarrayyentrecor
cheteslaposicióndelel
ementodent
rodelarr
ay.
Comosehacoment ado,lasposici
onesseempi ezanacont arenel0,porloqueelprimer
el
ementoocupalaposición0yseaccedeaelmedi ant
edias[0].

Elval
ordi
as[
5]hacer ef
erenci
aalel
ementoqueocupalasext
aposi
cióndentr
odelarr
aydias.
Comolasposici
onesempiezanacont
arseen0,l
aposi
ción5hacer
eferenci
aalsext
oel
emento,
enest
ecaso,elval
orSábado.

Bool
eanos

Lasvar i
abl
esdetipobooleanobooleanotambiénseconocenconelnombredevari
abl
esde
ti
pol ógi
co.Aunqueparaent enderreal
mentesuut i
li
dadsedebeestudi
arlapr
ogramaci
ón
avanzadaconJavaScr
iptdelsigui
ent
ecapít
ulo,
sufuncionami
ent
obási
coesmuysenci
ll
o.

Unavariabledeti
pobooleanalmacenauntipoespeci
aldeval
orquesol
amentepuedetomar
dosvalores:tr
ue(ver
dadero)ofal
se(fal
so)
.Nosepuedeut i
li
zarpar
aalmacenarnúmerosy
tampocoper mi
teguar
darcadenasdetext
o.

Losúnicosvalor
esquepuedenal
macenarest
asvariabl
essont
rueyfal
se,
porl
oquenopueden
uti
li
zarselosval
oresver
dader
oyfal
so.Acontinuaciónsemuest
raunpardevar
iabl
esdet
ipo
booleano:

varcl
ienteRegi
str
ado=fal
se;
vari
vaInclui
do=true;

Oper
aci
onesenJavascr
ipt

JavaScr
iptt
ienel
ossi
gui
ent
est
iposdeoper
ador
es,
est
ásecci
óndescr
ibedi
chosoper
ador
esy
cont
ienei
nfor
maci
ónsobr
eelor
dendel
osmi
smos:

JavaScr
iptt
ienel
ossi
guient
estiposdeoper
ador
es.Est
asecci
óndescr
ibedi
chosoper
ador
esy
conti
eneinf
ormaci
ónsobreelor
dendelosmismos:

Operadoresdeasi gnaci ón
Operadoresdecompar aci
ón
Operadoresaritméticos
Operadoresbitabi t
Operadoreslógicos
Operadoresdecadenadecar acter
es
Operadorcondi ci
onal( t
ernar
io)
Operadorcoma
Operadoresunar i
os
Operadoresrelacionales
JavaScri
pttieneoper adoresbinari
osyunar ios,yunoperadort
ernari
oespeci
al,eloper
ador
condici
onal.Un oper adorbinariorequi
ere dos oper
andos,uno ant
es deloperadoryotro
despuésdeest e.

oper
ando1oper
adoroper
ando2
Porej
emplo,
3+4ox*y.

Unoper
adorunar
ior
equi
eresol
ament
eunoper
ando,
yaseaant
esodespuésdeloper
ador
:

oper
andooper
ador
o

oper
adoroperando
Porej
emplo,x++o++x

Operadoresdeasignación
Unoper adordeasignaciónasignaunvaloraloperandodelaizqui
erdaenfuncióndelval
ordel
operandodel aderecha.Eloperadorbási
codeasignacióneseldeigual(
=),queasi
gnaelvalor
deloperandodel ader echaaloperandodelaizquier
da.Porejemplo,x=y,estáasignandoel
val
ordeyax.

Tambiénexist
enoperador
escompuest
osdeasi
gnaci
ónquesonl
afor
maabr
evi
adadel
as
oper
acionesdelasi
gui
entetabl
a:

Operadoresdeasi gnaci ón
Nombr e Operadorabr eviado Si
gnifi
cado
Operadoresdeasi gnaciónx=y x=y
Asi
gnacióndeadi ciónx+=y x=x+y
Asi
gnacióndesust r
acci ónx- =y x=x-y
Asi
gnacióndemul ti
plicación x* =y x=x*y
Asi
gnacióndedi visión x/ =y x=x/y
Asi
gnaciónder esto x%=y x=x%y
Asi
gnacióndeexponenci aciónx**=y x=x* *y
Asi
gnacióndedespl azami entoalaizqui
erda x<<=y x=x<<y
Asi
gnacióndedespl azami entoaladerechax>>=y x=x>>y
Asi
gnacióndedespl azami entoaladerechasi
nsi
gnox>>>=yx=x>>>y
Asi
gnaciónANDbi nar i
a x&=y x=x&y
Asi
gnaciónXORbi naria x^ =y x=x^y
Asi
gnaciónORbi naria x|=y x=x|y
Destr
ucturaci
ón
Para asi
gnaci
ones mas complejas,la sint
axis de asignación con dest
ruct
uraci
ón es una
expr
esióndeJavascri
ptqueper miteextraerdatosdear r
eglosuobj et
osusandounasi nt
axis
queseasemejaalacontr
uccióndear r
eglosoobj etosli
teral
es.

varf
oo=[
'
uno'
,
'dos'
,
't
res'
]
;

//si
ndest
ructuraci
ón
varuno =foo[0];
vardos =foo[1];
vartr
es=foo[
2];

//condest r
ucturación
var[uno,dos,tr
es]=f oo;
Operadoresdecompar ación
Unoper adordecompar acióncompar asusoper andosydevuel veunval orlógicoenf unciónde
silacompar aci
ónesver dader a( t
rue)of alsa(false).Losoperador espuedensernúmer i
cos, de
cadena de car acteres (Strings),lógicos o de obj et
os.Las cadenas de car acteres son
compar adasbasándoseenunor denl exicográficoestándar,usandoval oresUni code.Enl a
mayor í
a de los casos,sil os dos oper andos no son delmi smo tipo,JavaScr i
pti ntenta
converti
rl
osenelt ipoapr opiadopar aper mi t
irl
acompar aci
ón, gener almenteest aconver siónse
real
iza de maner a numér ica.Las úni cas excepci ones que t iene esta conver sión son l os
operadores===y! ==queej ecutancompar acionesdei gualdadodesi gual daddemaner a
estr
icta(chequeandosiambosoper andossondelmi smot i
po) .Est osoper adoresnoi ntentan
converti
rlosoper andosaunt ipocompat ibleant esdecompr obarsui gualdad.Lasi guiente
tabl
adescr i
belosoper adoresdecompar aciónenbasealsi guient ecódi godeej empl o:

varvar
1=3;
varvar
2=4;

Oper
ador
esdecompar
aci
ón

Oper
ador Descr i
pci
ón Ejempl
osdevol
viendotr
ue
I
gual
dad(==)
Devuel
vetruesiambosoper
adorandossoni
gual
es.3==var
1
"
3"==var1
3=="3"

Desi
gual dad(!
=)Devuelvetr
uesiambosoper
andosnosonigual
es. var
1!=4
var
2! ="3"
Est
rict
ament eigual
es(
===)
Devuelvet r
uesilosoperandossonigual
esyti
enenelmismot i
po.Mir
atambi
énObj
ect
.i
sy
samenessi nJS.

3===var 1
Est
rict
amentedesi
gual
es(!
==)
Devuelvet
ruesil
osoper
andosnosoni
gual
esy/
onosondelmi
smot
ipo.

var1!
=="3"
3!=="3"
Mayorque(>)
Devuel
vetr
uesieloper
andodel
aizqui
erdaesmayorqueeloper
andodel
ader
echa.

var2>var1
"12">2
Mayoroi gualque(>=) Devuel
vetr
uesieloper
andodel
aizqui
erdaesmayoroi
gualqueel
operandodel ader
echa. var
2>=var
1
var1>=3
Menorque( <) Devuel vet
ruesieloperandodelaizqui
erdaesmenorqueeloper
andodela
derecha.var
1<var2
"2"<12
Menoroi gualque(<=) Devuel vet
ruesieloper
andodel aizqui
erdaesmenoroi
gualqueel
operandodel ader
echa. var1<=var2
var2<=5
Nota:(=>)noesunoperador,
sinounanotaci
ónparal
asFuncionesFlecha.

Oper
ador
esar
it
mét
icos

Losoperadoresarit
mét icostomanl osval oresnúmericos(
tantolit
eral
escomovar iables)desus
operandosydevuel venunúni coresultadonumér i
co.Losoper adoresari
tméticosest andarson
l
asuma( +),l
aresta( -
),lamul ti
pli
cación( *
)yladivisión(
/).Estosoperadoresf uncionancomo
enlamayor í
adel osl enguajesdepr ogramacióncuandosonusadosconnúmer osdecoma
fl
otante(enpart
icul
ar ,
tengaencuent aquel adivi
siónporceroproduceInfi
nity).Porejemplo:

1/2;//0.5
1/2==1. 0/2.0;ar
itmét
ico
Ademásdel asoperaci
onesdearit
méti
caest
ándar(
+,-
,*y/
),JavaScr
iptbr
indal
ossi
gui
ent
es
oper
adoresari
tméti
cosdescri
tosenlat
abl
a:

Oper
ador
esar
it
mét
icos

Oper
ador Descr i
pción Ejemplo
Rest
o(%)
Oper
adorbi
nari
ocorrespondient
ealmódul
odeunaoper
aci
ón.Devuel
veelr
est
odel
adi
visi
ón
dedosoper
andos.

12%5devuel ve2.
Incr
emento(++)
Operadorunari
o.Incr
ementaenunauni dadaloper
ando.Siesusadoant
esdeloper
ando(
++x)
devuel
veelvalordeloperandodespuésdeañadirl
e1ysiseusadespuésdeloperando(
x++)
devuel
veelvalordeesteantesdeañadi
rl
e1.

Sixes3,ent onces++xest abl

ecexa4ydevuel
ve4,mi
ent
rasquex++devuel
ve3y,sol
o
despuésdedevolverelval
or,
est
abl
ecexa4.
Decrement
o(--
)

Oper
adorunari
o.Restaunauni
dadaloper
ando.Dependi
endodelaposi
ciónconr
espect
oal
oper
andot
ieneelmismocomport
ami
entoqueeloper
adordeincr
ement
o.

Sixes3, entonces- -
xest ablecexa2ydevuel
ve2,mient
rasquex--devuel
ve3y,solodespués
dedevol verelvalor,establecexa2.
NegaciónUnar i
a( -
)
Operaciónunar i
a.Int entaconvert
iranúmer
oaloper
andoydevuel
vesuf ormanegat
iva.

-
"3"devuel
ve-3.
-
truedevuel
ve-1.

Unari
oposi t
ivo(+) Oper aci
ónunar ia.I
ntentaconver
ti
ranúmer oaloperando.+"
3"devuel
ve3.
+tr
uedevuel ve1.
Exponenciación(**) Calcul
al apotenciadel abasealval ordelexponente.Esequival
ent
ea
baseexponent e 2* *3devuelve8.
10**-1devuel ve0.1.Oper
adoresBitabi t
Losoperador esbitabittr
atanasusoper andoscomounconj unt
ode32bi ts(cer
osyunos),en
vezdecomonúmer osdecimales,hexadecimalesuoctales.Porejemplo,elnúmerodecimal9
serepresent
aenbinari
ocomo1001.Losoperador
esbitabi
treal
izansusoper
aci
onesendi
cha
repr
esentaci
ónbi
naria,
per
odevuel
venunvalornúmer
icoest
ándar.

Lasi
gui
ent
etabl
amuest
ral
osoper
ador
esbi
tabi
tconl
osquecuent
aJavaScr
ipt

Tabl
a3. 4Operador
esbitabit
Operador UsoDescr ipci
ón
ANDbi tabi
ta&b
Devuelveuno porcadaposi ci
ón debi
ten l
acual
esl
osbi
tscor
respondi
ent
esdeambos
operandost
ienenvaloruno.

ORbitabi
t a|b
Devuel
veunoporcadaposici
óndebi
tenl
acualalmenosunodel
osbi
tscor
respondi
ent
esde
ambosoperandost
ieneval
oruno.

XORbitabita^b
Porcadaposici
óndebitenlacuallosbi
tscor
respondi
ent
esdeambosoper
andossoni
gual
es
devuel
veceroysisondi
fer
entesdevuel
veuno.

NOTbitabit~aI nviert
el osbi
tsdeloper
ando.
Despl
azamient
oal aizquierdaa<<b
Despl
aza b posi
ciones a l aizqui
erda l
ar epr
esent
aci
ón binar
ia de a,elexceso de bi
ts
despl
azadosalai
zqui er
dasedescar t
a,dej
andocerosalader
echadel osbi
tsdespl
azados.

Despl
azami
ent
oal
ader
echaconpr
opagaci
óndesi
gno

a>>b
Despl
aza b posi
ciones a l
a derecha l
arepr
esent
aci
ón bi
nar
ia de a,elexceso de bi
ts
despl
azadosaladerechasedescart
a.

Despl
azamient
oalader echaconrel
lenodeceros a>>>b
Despl
aza b posi
ciones a la der
echa lar epr
esent
ación binar
ia de a,elexceso de bi
ts
despl
azadosaladerechasedescart
a, dej
andocerosalaizqui
erdadelosbit
sdespl
azados.

Oper
ador
esl
ógi
cosbi
tabi
t

Concept
ual
ment
e,l
osoper
ador
esl
ógi
cosbi
tabi
tfunci
onandel
asi
gui
ent
emaner
a:

Losoperandossonconver
ti
dosaenterosde32bi tsyexpr
esadoscomoser
iesdebits(cer
osy
unos).Sedescar
tar
ánlosbit
smásrelevant
esdel osnúmerosconmásde32bits.Porejempl
o
elsi
guient
eenter
oconmásde32bitsser áconver
tidoaunenter
ode32bi
ts:

Antes: 11100110111110100000000000000110000000000001
Después: 10100000000000000110000000000001
Cadabi ten elpr i
meroper ando esempar ejado con elcorrespondient
ebi ten elsegundo
operando:elpri
merbitdelprimeroperandoconelpr imerbi
tdelsegundooper ando,elsegundo
bi
tdelprimeroperandoconelsegundobi tdelsegundooperandoyasíconsecut i
vament e.
Laoperaciónseaplicaacadapardebi t
syelr esult
adoesconst rui
dobitabi t
.
Porejemplo,larepr
esentaci
ónbi nari
ade9es1001,yl arepresentaci
ónbi nari
ade15es1111.
Cuandosel eapli
canaest osvaloresl
asoper acionesbitabi
t,losresult
adossonl ossiguient
es:

Ej
empl
odeoper
adoresbi
tabi
t
Expr
esi
ón Result
ado Descri
pci
ónbi
nar
ia
15&9 9 1111&1001=1001
15|9 15 1111|1001=1111
15^9 6 1111^1001=0110
~15-16 ~00000000...
00001111=11111111. .
.11110000
~9 -10 ~00000000...
00001001=11111111. .
.11110110
Observaquelos32bi t
ssoninvert
idoscuandoseusaeloper adorNOTbitabi
t(~),yquel
os
val
oresconl osbi t
smásr el
evantes(extr
emoi zqui
erdo)convalor1repr
esent
annúmeros
negati
vos(r
epresentaci
ónencompl ementoados) .

Losoper
ador
esdedespl
azami
ent
obi
nar
io

Losoperadoresdedesplazamient
obinar
iouti
li
zandosoperandos:elpri
meroeselnúmeroque
serádespl
azado,yelsegundoeselnúmer odeposici
onesbinar
iasqueelpri
meroperandoser
á
despl
azado.Ladir
eccióndeldespl
azamientoescontr
oladaporeloper
adorut
il
izado.

Losoperador
esdedesplazami
ent
obinar
ioconvi
ert
enlosoperandosenent er
osde32bi
tsy
ret
ornar
ánunresul
tadoqueser
ádelmi
smotipoqueeloper
andodelaizqui
erda

Lasiguientetablarecogel osoperadoresdedesplazami entobinari

o:
Operadoresdedespl azamient
obi nar
io
Operador Descr ipción Ejemplo
Desplazami ent
oal ai zqui
erda(<<)
Esteoper adordespl azahaci alaizquierdalarepr
esent aciónbinari
adelpr
imeroperando.La
canti
daddeposi ci
onesdebi tsdespl
azadasesmar cadaporelsegundooperando.Elexcesode
bit
sdespl azadoalai zquierdasedescar t
a,dej
andocer osal aderechadel
osbit
sdesplazados.

9<<2retor
na36,puest
oquelar epr
esent
aci
ónbinari
ade9es1001yalserdespl azado2
posi
cionesdebi
tshaci
alai
zqui
erda,dacomoresul
tado100100,cuyar
epr
esent
aci
óndecimal
es36.

Desplazamient
oal ader
echaconpropagacióndesigno(>>)
Esteoperadordesplazahacial
ader echal arepr
esentaci
ónbinari
adelprimeroperando.La
canti
daddeposi ci
onesdebit
sdesplazadasesmar cadaporelsegundooper
ando.Elexcesode
bit
sdesplazadoaladerechasedescart
a.

9>>2r etorna2,puest oquel ar epresentaci

ónbi nar i
ade9es1001yalserdespl azada2
posicionesdebi tshacial aderecha,dacomor esultado10,cuyar epresentacióndecimales2.
Delmi smomodo,- 9>>2r etor
na- 3,puestoquealmant enerl
osbi tsrel
evantesal aizquierda,el
si
gnosemant i
ene.
Despl azami ent
oal ader echaconr ell
enodecer os(>>>)
Esteoper adordespl azahaci alader echal arepr
esent aci
ónbi nari
adelpr i
meroper ando.La
cantidaddeposi ci
onesdebi t
sdespl azadasesmar cadaporelsegundooper ando.Elexcesode
bit
sdespl azadoal aderechasedescar t
a,dejandocer osalaizquier
dadel osbitsdesplazados.

19>>>2r et
orna4,puestoquelarepresent
aciónbinari
ade19es10011yalserdespl azada2
posici
onesdebi t
shacialader
echadacomor esul
tado100,cuyar
epr
esentaci
óndecimales4.
Para númer os no negati
vos este operador generará elmismo result
ado que elde
desplazamient
oal ader
echaconpropagacióndesigno( >>)
.

Operadoreslógicos
Losoperador eslógicossoncomúnment eutil
izadosconvaloresbooleanos;estosoper
adores
devuel
venunval orbooleano.Si
nembargo,losoperadores&&y| |r
ealmentedevuelvenelvalor
deunodel osoper andos,asiquesiestosoperadoressonusadosconval or
esnobool eanos,
podrí
andevol veranunval ornobooleano.Enl asiguient
etablasedescr i
benl osoper
adores
l
ógicos:
Operadoreslógicos
Operador UsoDescr i
pción
ANDLógi co(&&)expr 1&&expr2
Devuelveexpr 1sipuedeserconver t
idoaf al
sedel ocontr
ariodevuelveexpr2.Porlotanto,
cuandoseusaconvalor
esbool
eanos,&&devuel
vet
ruesiambosoper
andossont
rue,encaso
contr
ari
odevuel
vef
alse.

ORLógico(|
|) expr1||expr
2
Devuel
veexpr1sipuedeserconvert
idoatruedelocont
rar
iodevuelveexpr2.Porl
otanto,
cuandoseusaconvaloresbool
eanos,|
|devuel
vet
ruesial
gunodel osoperandosestr
ue,o
fal
sesiambossonfal
se.

NOTLógico(!
) ! expr
Devuel
vefal
sesisuoperandopuedeserconver
ti
doat
rue,
encasocont
rar
io,
devuel
vet
rue.

Ejemplosdeexpresi
onesquepuedenserconverti
dasaf al
sesonaquel
lasquepuedenser
evaluadascomonull
,0,
NaN,undef
inedounacadenavací
a.

Elsi
gui
ent
ecódi
gomuest
raej
empl
osdeloper
ador&&(
ANDLógi
co)
.

vara1=true &&t rue; //t&&tdevuelvetrue

vara2=true &&f alse; / /t&&fdevuelvefalse
vara3=false&&true; //f&&tdevuelvefalse
vara4=false&&(3==4) ;//f&&fdevuelvefalse
vara5="Cat"&&"Dog" ; / /t&&tdevuelve"Dog"
vara6=false&&"Cat "
; / /f&&tdevuelvefalse
vara7="Cat"&&false; / /t&&fdevuelvefalse
Elsi
gui
entecódigomuest r
aej empl
osdeloperador||(
ORLógi
co)
.

varo1=true ||true; //t||tdevuelvetrue

varo2=false|
|true; /
/f||tdevuelvetrue
varo3=true ||false; / /t||fdevuelvetrue
varo4=false|
|(3==4) ;/
/f||fdevuelvefalse
varo5="Cat"|
|"Dog" ; / /t|
|tdevuelve"Cat"
varo6=false|
|"Cat "
; / /f||tdevuelve"Cat"
varo7="Cat"|
|false; / /t||fdevuelve"Cat"
Elsi
gui
entecódigomuest r
aejempl osdeloperador!(
NOTLógi
co)
.

varn1=!t
rue; //!tdevuelvefalse
varn2=!f
alse;/
/!fdevuelvetrue
varn3=!"
Cat";/
/!tdevuelvefalse
Eval
uaci
ónmí ni
maoeval uacióndecir
cui
tocor
to

Comolasexpr
esi
oneslógi
cassonevaluadasdeizquier
daader
echa,est
assoneval
uadasde
maner
amínima(t
ambiénll
amadadecir
cuitocor
to)usandol
assi
gui
entesr
egl
as:

false&&algo esmínimamenteeval
uadaaf alse.
true||al
go esmíni
mament eeval
uadaat r
ue.
Lasr egl
asdelal
ógicagar
anti
zanquel ananterior
eseval
uaci
onessonsiemprecor
rect
as.Not
a
queeloperandoal
gonoesevaluado,porloquesi t
uar
lonosurt
eningúnefect
o.

Operadoresdecadenasdecar act
eres
Ademásdel osoperadoresdecomparaci
ón,quepuedenserusadosencadenasdecar acter
es,
eloperadordeconcat enaci
ón (
+)unedosval oresdet i
po Str
ing,devol
viendo ot
ro Str
ing
cor
respondientealaunióndelosdosoperandos.

Porej
empl
o,

consol
e.l
og("mi"+"st
ring"
);/
/lanzaelStr
ing"
mistri
ng"enlaconsol
a.
La ver
sión acor
tada deesteoper adordeasignaci
ón (+=)puedeserusada t
ambi
én par
a
concat
enarcadenasdecar
act
eres.

Porej
empl
o,

varmistr
ing="alf
a";
mist
ring+="beto"
;//devuel
ve"al
fabet
o"yasignaest
eval
ora"mist
ri
ng".
Operadorcondi
cional(
ter
nari
o)
Eloperadorcondici
onaleselúnicooperadordeJavaScri
ptquenecesit
atr
esoperandos.El
oper
adorasignaunodedosval or
esbasadoenunacondici
ón.Lasi
ntaxi
sdeesteoper
adores:

condi
ción?valor1:valor2
Silacondiciónestrue,eloperadortomar
áelvalor
1,delocontr
ari
otomaráelval
or2.Puedes
usareloperadorcondi
cionalencualqui
erl
ugarqueuseunoper
adorest
ándar.

Porej
empl
o,

varestado=(edad>=18)?" adul
to":"
menor
";
Estasentenciaasignaelval
oradult
oalavari
abl
eest
adosiedadesmayoroi
guala18,del
o
contr
arioleasignaelval
ormenor.

Operadorcoma
Eloperadorcoma( ,
)simplementeevalúaambosoperandosyr et
ornaelvalordelúlt
imo.Este
oper
adoresant etodouti
li
zadodentrodeuncicl
ofor
,permit
iendoquedif
erentesvari
ablessean
act
ualizadasencadait
eracióndelci
clo.

Porejemplo,siaesunArraybi-
dimensionalcon10elementosencadal
ado,elsi
gui
ent
ecódi
go
usaeloper adorcomaparaactual
izardosvar i
abl
esalmismot i
empo.Elcódi
goimpri
meenla
consolal
osval or
escor
respondi
entesaladiagonaldelAr
ray:

for(vari=0, j=9;i<=j;i
++,j-
-)
console.
log("a[
"+i+" ]
["+j+"]="+a[i
][
j]
);
Oper ador
esunar i
os
Unaoper aciónunariaesunaoper aci
ónquesól
onecesi
taunoper
ando.

del
ete

Lafuncióndeloperadordel
eteeselimi
narunobjet
o,unapropi
edaddeunobj
eto,
ounel
ement
o
enelindiceespecí
fi
codeunAr ray.Lasi
ntaxi
seslasi
guient
e:

del
etenombr eObjeto;
del
etenombr eObjeto.pr
opiedad;
del
etenombr eObjeto[i
ndice]
;
del
etepropiedad;//soloadmi t
idoconunadeclar
ación"wit
h"
Dondenombr eObjetoeselnombr edeunobjeto,propi
edadelnombredelapr
opi
edaddeun
obj
eto,eindiceunent eroquerepresent
alal
ocali
zacióndeunel
ementoenunArr
ay.

Lacuart
afor
maesadmi
ti
dasol
odent
rodeunasent
enci
awi
th,
par
ael
imi
narunapr
opi
edadde
unobjet
o.

Puedesusareloperadordel
eteparaeli
minaraquellasvar
iabl
esquehan si
do decl
aradas
i
mplíci
tament
e,per
onoaquell
asquehansidodecl
aradasconvar.

Silaoperaci
óndeletefi
nal
izaconéxi
to,est
abl
ecelapropi
edadoelelementoaundefi
ned.El
operadordel
etedevuel
vetr
uesil
aoperaci
ónhasidoposi
bleyfal
seencasocont
rar
io.

x=42;
vary=43;
miObj=newNumber ()
;
miObj.h=4; / /crealapropi edad" h"
delet
ex; //devuel vetrue( sepuedeel iminarsisedecl aróimpl íci
tamente)
delet
ey; //devuel vefalse( nosepuedeel iminarsisedecl aróconvar )
delet
eMat h.
PI;//devuelvefalse( nosepuedenel i
mi narpropi
edadespr edefi
nidas)
delet
emi Obj
.h;/
/devuel vetrue( sepuedenel i
mi narpropiedadesdef inidasporelusuari
o)
delet
emi Obj
; / /devuelvetrue( sepuedeeliminarsisehadecl aradoi mplí
cit
ament e)
Eli
minandoelement osdeunAr ray
Cuandoseel iminaunel ement odeunAr ray,sut amañonosever áaf ect
ado.Porej emplo,si
el
iminaa[3],
a[4]seguiráexistiendoper oelvalordea[ 3]seráundef inedyaquedej arádeexist
ir
enelAr r
ay.

Enelsi
gui
enteejempl
o,arbol
es[
3]esel
imi
nadocondel
eteycomosepuedeconst
atarelmi
smo
dej
arádeexi
sti
renelArr
ay.

vararboles=newAr r
ay("
secoya",
"laurel
","
cedro"
,"robl
e","
arce")
;
del
etearboles[3]
;
i
f(3inar bol
es){
//Estonoseej ecutar
á
}
Sideseaqueunel ementodeunAr rayexistaper osuvalorseaundefi
ned,debeasignarl
eel
val
orundef i
nedenvezdeusareloper adordelete.Enelsi gui
ent
eej
emploaar bol
es[3]sele
asi
gnaelval orundefi
ned,peroelelementoseguiráexist
iendo

varar boles=newAr r
ay("
secoya"
,"l
aur
el"
,"cedr
o",
"robl
e",
"ar
ce"
);
arboles[3]=undef i
ned;
i
f( 3inar boles){
//Est etrozosiseejecutar
á
}
typeof

Eloper
adort
ypeofesusadodel
assi
gui
ent
esmaner
as:

typeofoperando
typeof(operando)
Eloperadort ypeofdevuel
veunacadenadecar acteresindicandoeltipodeloperandoeval
uado.
En losej empl osanteri
oresoper
ando hacer eferenciaal acadenadecar acter
es,var
iabl
e,
palabraclaveuobj et
odelqueseintent
aobtenersut ipo.Losparéntesissonopcional
es.

Supónquedef
inesl
assi
gui
ent
esvar
iabl
es:

varmiFuncion=newFunct i
on("
5+2")
;
varfor
ma=" redonda";
varl
argo=1;
varhoy=newDat e();
Eloperadortypeofdevolver
álossi
gui
ent
esr
esul
tadosenest
asvar
iabl
es:

typeofmiFuncion;//devuel
ve"funct i
on"
typeoffor
ma; //devuelve"str
ing"
typeoflar
go; /
/devuelve"number "
typeofhoy; //devuelve"object"
typeofnoExist
e; //devuelve"undef i
ned"
Conl aspalabr
asclavetrueynul l
,eloperadort
ypeofdevuel
vel
ossi
gui
ent
esr
esul
tados:

t
ypeoft
rue;/
/devuel
ve"
bool
ean"
typeofnul
l;/
/devuel
ve"
obj
ect"
Conl osnúmerosol ascadenasdecar
act
eres,eloper
adort
ypeofdevuel
vel
ossi
gui
ent
es
result
ados:

typeof62; /
/devuel
ve"number
"
typeof'
Hell
oworld'
;//devuel
ve"
str
ing"
Enelcasodequeseut i
li
cecomooperandounapr
opi
edad,
eloper
adort
ypeofdevol
ver
áelt
ipo
dedichapropi
edad:

typeofdocument.l
astModi
fi
ed;//devuelve"stri
ng"
typeofwindow.l
ength; //devuelve"number"
typeofMath.LN2; / /devuelve"number"
Conmét odosyf unci
ones,
eloperadortypeofdevolver
álossi
gui
ent
esr
esul
tados:

typeofblur; //devuelve"f
unct i
on"
typeofeval; //devuelve"functi
on"
typeofparseInt
; / /devuelve"f
unction"
typeofshape.spl
it
;//devuelve"f
unction"
Paraobjetospredefi
nidos,
elobjetotypeofdevuel
vel
ossi
gui
ent
esval
ores:

typeofDate; //devuelve"funct
ion"
typeofFunction;/
/devuelve" f
uncti
on"
typeofMath; //devuelve"obj
ect"
typeofOption; / /devuelve"funct
ion"
typeofStr
ing; / /devuelve" f
uncti
on"
void

Eloper
adorvoi
dpuedeusar
seencual
qui
eradel
assi
gui
ent
esmaner
as:

voi
d(expresion)
voi
dexpresion
Eloper
adorvoi despeci
ficaunaexpresiónqueseráevaluadaynor et
ornar
áningúnresult
ado.
Enlosejempl osant
eri
ores,expr
esi
onhacer ef
erenci
aal aexpresi
ónqueseráeval
uada.Sibien
l
osparéntesisqueenvuel venalaexpresi
ónsonopci onal
es,encuantoaesti
lodelcódigo,es
unabuenapr ácti
causarl
os.

Eloper
adorvoi
dpuedeserusadoparaespeci
fi
carunaexpr
esióncomounli
nkdehi
per
text
o.La
expr
esi
ónseráeval
uadaperonocargar
áunapáginaeneldocumentoact
ual
.

Elsi
gui
entecódi
gocreaunli
nkdehiper
textoquenohacenadacuandoelusuar
iohacecl
icken
él
.Cuandoelusuari
ohacecl
icksobr
eellink,voi
d(0)ser
áeval
uadacomoundef
ined,l
ocualno
ti
eneef
ectoenJavaScr
ipt
.

<ahref="
javascr
ipt
:voi
d(0)
">Hazcl
ickaquíparanohacernada</
a>
Elsigui
entecódigocreaunl i
nkdehipert
extoqueenvíaunf or
mular
iocuandoelusuar
iohace
cl
ickenél.

<ahr
ef="j
avascr
ipt:
void(document
.f
orm.
submit
()
)"
>
Hazcli
ckparaenviar</a>
Oper
adoresrel
acionales
Unoperadorrel
acionalcompar asusoper
andosyret
ornaunval
orbool
eanobasadoensil
a
comparaci
ónesver dadera.

i
n

Eloper
adori
ndevuel
vet
ruesil
apr
opi
edadespeci
fi
cadacomopr
imeroper
andoseencuent
ra
enelobj
etoespeci
fi
cadocomosegundooper
ando.Lasi
ntaxi
ses:

nombrePr
opi
edadoNumeroinnombr
eObjet
o
DondenombrePropi
edadoNumer
oesunacadenaoexpr esiónnuméri
caquer epr
esent
aun
nombredepr
opiedadoíndi
cedematr
izynombr
eObj
etoeselnombredeunobj
eto.

Lossi
gui
ent
esej
empl
osmuest
ranal
gunosusosdeloper
adori
n.

//Arrays
vararboles=newAr r
ay("secoya","laur
el"
,"cedr
o",
"roble","
arce"
);
0inar bol
es; //devuelvet rue
3inar bol
es; //devuelvet rue
6inar bol
es; //devuelvef alse
"l
aurel"i
narboles;//devuelvefalse( Sedebeespecificarelnúmerodeí
ndi
ce,
//noelval orcontenidoeneseí ndi
ce)
"l
ength"inarboles;/
/devuel vetr
ue( l
engt
hesunapr opiedaddelArr
ay)

//Objetospredef
ini
dos
"PI
"inMat h; /
/devuel vetr
ue
varmiCadena=newSt ri
ng("coral"
);
"l
ength"inmiCadena; //devuelvetr
ue

//Objetoscr
eados
varmiCoche={ marca:"Honda"
,model
o:"
Accor
d",
fecha:1998}
;
"marca"inmiCoche; //devuel
vetr
ue
"modelo"inmiCoche;//devuel
vet
rue
i
nstanceof

Eloperadori
nstanceofdevuel
vet
ruesielobj
etoespeci
fi
cadocomopr
imeroper
andoesdelt
ipo
deobjetoespeci
ficadocomosegundoparámetr
o.Lasint
axises:

nombreObjet
oinst
anceoft
ipoObj
eto
Dondenombr eObj
etoeselnombredelobj
etoquesedeseacompar
aryt
ipoObj
etoesunt
ipode
obj
eto,comoDateoAr r
ay.

Ut
ili
cei nst
anceofcuandonecesi
teconfi
rmarelti
podeunobj etoenti
empodeejecución.Por
ej
empl o,alcaptarexcepci
ones,puede der
ivar
se a un códi
go de manej
o de excepci
ones
di
ferentedependi
endodelti
podeexcepciónl
anzada.

Porejemplo,elcódi
gosi
gui
ent
euti
li
zai
nstanceofparadeter
minarsielDi
aesunobjetodetipo
Date.YdebidoaqueelDi
aesunobj
etoDat
e,lassentenci
asenlasentenci
aifseej
ecut
arán.

varelDia=newDat e(1995,12,17)
;
i
f(elDiainst
anceofDate){
//códigoaejecutar
}
Precedenciadeoperadores
Laprecedenciadeoper adoresdet
ermi
naelordenenqueestossonapl
icadoscuandoseeval
úa
unaexpr esi
ón.Est
apr ecedenci
apuedeseral
teradausandopar
ént
esi
s.

Lasi
gui
ent
etabl
adescr
ibel
apr
ecedenci
adeoper
ador
es,
demayoramenori
mpor
tanci
a.

Tabla3.
7Precedenciadeoperador
es
Tipodeoperadoroperador
esindi
vidual
es
miembro .[
]
l
lamar/crearinst
ancia ( )new
negaci ón/i ncremento !~-+++- -typeofvoi
ddelet
e
mul t
iplicación/divisi
ón */%
adici
ón/sust r
acción+-
desplazami ent
obinario <<>>>>>
rel
ación<<=>>=i ninstanceof
i
gual dad==! ====! ==
ANDbi nar i
o&
XORbi nario^
ORbi nar io |
ANDl ógico &&
ORl ógico | |
condi ci
onal? :
asi
gnaci ón =+=- =*=/ =%=<<=>>=>>>=&=^ =|=
coma ,
Unaver siónmásdet all
adadeest al
ista,compl
etayconlinksadet
all
esadi
cional
esacer
cade
cadaoper ador,puedeencont r
arseenRef er
enci
adeJavaScri
pt.

Expr
esi
ones

Unaexpr
esi
ónescual
qui
eruni
dadvál
idadecódi
goquer
esuel
veunval
or.

Cadaexpresiónsint
áct
icavál
idar
esuel
veaalgúnval
or,per
oconceptualment
e,haydosti
posde
expr
esi
ones:l asqueti
enenefect
ossecundar
ios(
porejemplo:aquel
lasqueasignanunval
ora
unavar
iable)ylasquedealgunamanerasoneval
uadasyresuelvenunval
or.

Laexpresiónx=7esunejemplodelpri
merti
po.Est
aexpresi
ónusaeloper
ador=par
aasi
gnar
elval
orsieteal
avar
iabl
ex.Laexpr
esiónensímismaeval
úaasiet
e.

Elcódi
go3+4esunej emplodelsegundotipodeexpresi
ones.Estaexpr
esi
ónusaeloper
ador+
parasumart
resycuat
rosinasi
gnarelvalor(si
ete)ani
ngunavariabl
e.

JavaScr
iptcuent
aconl
assi
gui
ent
escat
egor
íasdeexpr
esi
ones:

Ari
tmét i
cas:eval úan a un númer o,por ej empl o 3.14159.( Usos general
es Oper
adores
ari
tméticos.)
Cadenasdecar acteres:evalúanaunacadenadecar act
eres,porejempl
o, "
Juan"o"234"
.(Usos
generalesOper adoresdecadenasdecar acteres.)
Lógicas:evalúanat rueof alse.(Amenudoi nvolucranalosOper adoresl
ógicos.)
Expresionesprimar i
as:Palabr ascl
avebásicasyexpr esi
onesgener al
esenJavaScri
pt.
Expresionesalladoi zqui
er do:Losvalor
esizquierdossoneldest inodeunaasignaci
ón.
Expresionesprimar i
as
Sonpal abrasclavesbási casyexpresionesgener al
esenJavaScr i
pt.

t
his

Useestapalabr
areser
vadathi
spararef
eri
rsealobjet
oactual
.Engener
al,t
hishacer
efer
enci
a
alobj
etol
lamadorenunmétodo.Seusadelasigui
entemanera:

t
his[
"nombr
eDePr
opi
edad"
]
o

this.
nombreDePropiedad
Ejemplo1:
Supongamosunaf unciónl
lamadavali
dat
equevali
dalapropi
edadval
uedeunobj
eto,dadoun
objetoydosvalores,l
owvalyhival
,comoext
remosdeunrango.
functi
onval i
date(obj,
lowval,hi
val
){
if(
(obj.
value<l owval)|
|(obj.
val
ue>hival
))
aler
t("
¡Valorinvál
ido!
")
;
}
Puedesi nvocaraest afunciónvali
dat
eparacadaeventoonChangedel
oselement
osdeun
formulari
o,utili
zandot hi
spar apasarelcampodelfor
mulari
ocomoelement
oaval i
dar
.Por
ejemplo:

<b>Ingreseunnúmer oentre18y99: </b>

<i
nputt ype="t
ext"name=" age"size=3onChange=" vali
date(t
his,18,
99);">
Ejemplo2:
Cuandoescombi nadaconl apr opi
edadf orm,thispuedehacerr eferenci
aalfor
mulari
opadr e
delelement oactual.Enelsi guienteejemplo,elformulari
omi Formulari
oconti
eneunel ement o
i
nputdet i
potextyunel ement oi nputdetipobutton.Cuandoelusuar i
ohaceclicenelbot ón,se
l
easi gnaelnombr edelfor mularioalinputdet i
potext.Elevent
oonCl i
ckdelbot
ónusat his.for
m
parahacerr ef
erenciaalformul ari
opadr e,
mi Formular
io.

<f
orm name="miFor mulari
o">
Nombr edelformul ar
io:
<i
nputtype="text"name="text1"val
ue="Beluga"
/>
<i
nputtype="button"name=" butt
on1"value="Most
rarnombr
edelf
ormul
ari
o"
onCl
ick="thi
s.for
m.text1.val
ue=this.f
orm.name;"
/>
</
for
m>
Oper
adordeagr upación

Eloperadordeagrupación()cont
rol
alapr
ecedenciadel
aevaluaci
ónenlasexpr
esi
ones.Por
ej
emplo,puedescambi arelor
dendelamult
ipl
icaci
ónyladi
visi
ónantesdelasumaylaresta
paraqueseevalúelasumapr i
mero:

vara=1;
varb=2;
varc=3;

//precedenci
apordef
ect
o
a+b*c //7
//seevalúapordef
ect
ocomo
a+(b*c) / /7

/
/ahor
acambiamosl
aprecedenci
apordefect
o
/
/sumaremospr
imer
oantesdemul t
ipl
icar
(
a+b)*c / /9

//l
ocualesequivalentea
a*c+b*c/ /9
Expr
esi
onesalladoi zqui
erdo
Losval
oresi
zquierdossoneldest
inodeunaasi
gnaci
ón

new

Uti
li
ceeloperadornew paracrearunainstanci
adeunt i
popropi
oodeunodel ostiposde
obj
etospredef
ini
dos:Ar
ray,Boolean,Dat
e,Functi
on,I
mage,Number,Obj
ect
,Opt
ion,RegExpo
Str
ing.Lasemánti
caesl
asi gui
ente:

varnombr
eDeObj
eto=newt
ipoDeObj
eto(
[par
am1,
par
am2,
..
.,
par
amN]
);
super
Lapal
abr
aclavesuperesusadapar al
lamarfunci
onesenelobj
etopadr
e.Esút
ilconcl
ases
par
all
amaralconst
ruct
orpadr
e,porej
emplo.

super(
[argumentos])
;//ll
amaalconstr
uct
orpadr
e.
super.
funcionEnPadre(
[ar
gumentos]
);
Operadordepr opagaci
ón

Eloperadordepropagaci
ónper
mi t
equeunaexpr
esi
ónseaexpandidaensit
uacionesdondese
esperanmúlti
plesargument
os(paral
lamadasaf
unci
ones)omúlt
iplesel
ementos(paraArr
ays
l
iter
ales)
.

Ejemplo:
Hoy,sitienesunArrayydeseascrearunnuevoAr rayquecont
engatambiénloselementosdel
primero,lasi
ntaxi
sdeunAr r
ayli
teralnoessuf i
cient
eydebesrecurr
irapiezasdecódigoque
haganusodemét odoscomopush,spl i
ce,concat,et
c.Conlasi
ntaxi
sdepr opagaci
ónestose
conviert
eenalgomuchomássi mple:

varpar
tes=["hombros","
rodil
las"
];
varl
etr
a=["cabeza",.
..
partes,
"y",
"dedos"
];
Demanerasimi l
areloperadordepropagaci
ónf
unci
onat
ambi
énconl
lamadasaf
unci
ones:

functionf(x,y,z){}
varar gs=[ 0,1,2]
;
f(.
..
args);
«Ant eri
orSiguiente»

Funci
onesenJavascr
ipt
Las funci
ones son uno de l
os pi
lar
es fundamental
es en JavaScri
pt,
una f
unci
ón es un
procedimi
ent
oenJavaScr i
ptunconj
untodesent enci
asquer eal
izanunatar
eaocalcul
anun
valor
.Parausarunaf unci
ón,debedefi
nir
laenal gúnlugardelámbitodesdeelcualdesea
l
lamarla.

Def
ini
cióndef
unci
ones

Declaracionesdefunción
Ladef i
nicióndeunaf unción(t
ambiénl
lamadadeclaraci
óndefunci
ónosent
enci
adef
unci
ón)
consistedel apal
abraclave(r
eser
vada) funct
ion,
seguidapor
:

Elnombredel afunción(opcional
).
Unali
stadear gument osparalafunci
ón,encerradosentr
eparént
esisyseparadosporcomas(
,)
.
Lassentenci
asJavaScr iptquedefi
nenlafunción,encer
radasporl
laves,
{}.
Porej
empl o,
elsiguientecódigodefi
neunaf unciónsimplel
lamadasquare:

functionsquare(number){
returnnumber*number ;
}
Laf unciónsquar etomaunar gumento,l
lamadonumber.Lafunci
ónconsi
stedeunasent
enci
a
queexpr esaelretornodelargumentodel afunci
ón(elcuales,number
)multi
pli
cadoporsí
mismo.Lasent enciaret
urnespeci
fi
caelvalorr
etor
nadoporl
afunción.

ret
urnnumber*number;
Losparámet
rospri
miti
vos( comopuedeserunnúmer o)sonpasadosalasfunci
onesporval
or;
elval
orespasadoalaf unción,sil
afunci
óncambiaelvalordelpar
ámetr
o,estecambi
onoes
ref
lej
adogl
obalment
eoenot rall
amadaalafunci
ón.
Sipasaunobject
o(p.ej
.unvalornopr
imit
ivo,
comounAr r
ayounobjetodefi
nidoporelusuari
o)
comopar ámetr
o,ylafuncióncambialaspropi
edadesdelobjet
o,estecambiosíesvi sibl
e
desdeafuer
adelafunci
ón,comoseveenelsigui
enteej
emplo:

f
uncti
onmyFunc(t
heObject){
t
heObj
ect
.make='Toyota';
}

varmycar={
make:'
Honda'
,model
:'
Accor
d',
year
:1998}
,
varx,
y;

x=mycar
.make; /
/xt
omaelval
or"
Honda"

myFunc(
mycar);
y=mycar.make; //ytomaelvalor"Toyota"
//(l
apropi
edadmakef uecambidaporl
afunci
on)
Tengaencuent aqueasi gnarunnuevoobj et
oalparámetr
onotendráni
ngúnef
ect
ofueradela
función,porqueestoestácambiandoelvalordelparámet
roenlugardeunadel
aspropi
edades
delobj et
o:
functionmyFunc(theObject
){
theObject={make:'Ford'
,model
:'Focus',
year:2006}
;
}

varmycar={
make:'
Honda'
,model
:'
Accor
d',
year
:1998}
,
varx,
y;

x=mycar
.make; /
/xt
omaelval
or"
Honda"

myFunc(mycar);
y=mycar .
make; //ysigueconelvalor"Honda"
Expresi
onesdefunción
Sibienladeclar
acióndel afunci
ónanterioressintáct
icamenteunasentenci
a,lasfunci
ones
puedentambiénsercr eadasporunaexpr esi
óndef unci
ón.Talfunciónpuedeseranónima;no
debetenerunnombr e.Porejemplo,l
afunciónsquarepodríahabersi
dodefi
nidacomo:

varsquar
e=f uncti
on(number){r
eturnnumber*number
};
varx=square(4)//xobti
eneelvalor16
Sinembargo,sepuedepr oporci
onarunnombr eaunaexpr
esi
óndefunci
ón,yést
epuedeser
uti
li
zadodentrodel afunciónpararefer
ir
seasímisma,oenundepur
adorpar
aident
if
icarl
a
funci
óneneltrazadodepila:

varf
act
ori
al=f
unct
ionf
ac(
n){
ret
urnn<2?1:n*
fac(
n-1)
};

pri
nt(
fact
orial(
3));
Lasexpresi
onesdef unci
ónsonconveni
entescuandosepasaunafunci
óncomoar
gument
oa
otr
afunción.Elsi gui
enteej
empl
omuest r
aunaf unciónmapsiendodef
ini
dayl
uegol
lamada
conunaexpr esióndefunci
óncomoprimerparámetr
o:

functionmap( f,
a){
varr esul
t=[ ]
,/ /CreaunnuevoAr
ray
i
;
for(i=0;i! =a.length;i
++)
result[
i]=f(a[i]
);
returnresult;
}
Elsiguientecódi go:
varmult
ipl
icar=funct
ion(x){r
etur
nx*x*x;
}//
Expr
esi
óndef
unci
on
map(multi
pli
car,
[0,1,2,5,10]
);
ret
orna[
0,1,8,125,1000].

En JavaScr
ipt,una f
unción puedeserdef
inida en basea una condi
ción.Porej
empl
o,l
a
si
guient
edefini
cióndefunci
ónmyFuncesdefinidasól
osinum esiguala0:

varmyFunc;
i
f(num ==0) {
myFunc=f uncti
on(theObject){
t
heObject.
make=" Toyota"
}
}
Ademásdedef i
nirfuncionescomosedescri
beaquí
,sepuedeuti
li
zarelconst
ruct
orFunct
ion
paracrearf
uncionesdesdeunacadenaentiempodeejecuci
ón,
muyalesti
lodeeval
().

Unmétodo,esunaf unci
ónqueespropi
edaddeunobj
eto.Puedel
eermásacer
cadeobj
etosy
mét
odosenTr abaj
andoconobjet
os.

Ll
amandof
unci
ones

Defi
nirunaf unci
ónnol aejecut
a.Defi
nirunafunciónsimplementel
anombrayespeci
ficaque
hacercuandol afunci
ónesl l
amada.Ll
amarl afunciónesloquereal
menter
eal
izal
asacciones
especi
ficadasconl ospar
ámet r
osindi
cados.Porej empl
o,sidefi
nel
afunci
ón square,podrí
a
l
lamarlacomosi gue:

square(5);
Lasent enci
aanter
iorl
lamaal
afunci
ónconelar
gument
o5.Laf
unci
ónej
ecut
asussent
enci
as
yretornaelval
or25.

Lasfunci
onesdebendeestardentr
odelámbitocuandosonl
lamadas,
perol
adecl
araci
óndel
a
funci
ónpuedeserizada(aparecerpordebaj
odel all
amadaenelcodigo)
,comomuestrael
sigui
ent
eejempl
o:

console.
log(
square(
5));
/*..
.*/
functi
onsquare(
n){returnn*n}
Elámbi t
odel afuncióneslafunci
ónenl
aqueesdecl
aradaoelpr
ogr
amaent
erosiést
aes
declar
adaenelnivelsuperi
or.

Estosólof uncionacuandosedef inelafunciónut i

li
zandol asintaxi
sant erior(
p.ej
.function
funcName( ){
}).Elsiguientecódigonof uncionará.Estoqui er
edeci rqueeli zadodef unci
ones
sólofuncionaconunadecl aracióndef unciónynoconunaexpr esióndefunci ón
console.l
og(square);//squareescr eadoconunval orinici
alindefi
nido
console.l
og(square(5))
;/ /
TypeEr r
or:squarenoesunf uncion
square=f unction(n){
ret
urnn*n;
}
Losar gument osdeunaf unciónnoest ánl i
mitadosacadenasynúmer os.Puedenenvi arse
objet
osent erosaunaf unci
ón.Laf unciónshow_ props()(defi
nidaenTr abajandoconobj etos)
esunej emplodeunaf unciónquet omaunobj et
ocomoar gument o.

Unaf unci
ónpuedeserr
ecursi
va;esdecir
,quepuedell
amarseasími sma.Porej
empl
o,a
cont
inuaci
ónt
enemosunafunci
ónquecalcul
aelf
act
ori
aldef
ormarecur
siva:
functi
onf actori
al(n){
if((
n==0)| |(
n==1) )
retur
n1;
else
retur
n( n*f actori
al(n-1)
);
}
Entonces, podrí
acal cularl
osfact
ori
alesdesdeunohast
aci
ncodel
asi
gui
ent
emaner
a:

vara, b,c,
d,e;
a=f actori
al(
1);//aobt i
eneelvalor1
b=f actori
al(
2);//bobt i
eneelvalor2
c=f actori
al(
3);//cobt i
eneelvalor6
d=f actori
al(
4);//dobt i
eneelvalor24
e=f actori
al(
5);//eobt i
eneelvalor120
Hayot r
asf ormasdel lamaral asf unci
ones.A menudohaycasosendondeunaf unción
necesitaserllamadadef ormadi námi ca,oendondeelnúmer odear gumentosdelamisma
varí
a;oenl acual,elcontextodelallamadadel afunciónnecesit
aserajust
adaparaunobjeto
específi
codet er
mi nadoenelt i
empodeej ecuci
ón.Resul t
aquel asfunci
onesensímismasson
objetos,yest osobj et
osasuvezt ienenmét odos( verelobjetoFuncti
on).Unodeéstos,el
mét odoapply(),
sepuedeut i
li
zarparal ogr
aresteobjeti
vo.

Ámbi
todeunaFunci
ón

Lasvar i
ablesdef i
nidasdent r
odeunaf unciónnopuedenseraccedi dasdesdeningúnl ugar
fueradelafunción,yaquel avariableestádef inidasóloenelámbitodelafunci
ón.Si
nembar go,
unaf unci
ónpuedeaccederat odasl asvar iablesyfuncionesdef
inidasdentr
odelámbitoenel
cualestádefini
da.Enot raspalabr as,unaf uncióndefini
daenelámbi togl
obalpuedeaccedera
todaslasvariablesdefi
nidasenelámbi togl obal.Unafuncióndefi
nidadentr
odeotrafunción,
tambiénpuedeaccederat odasl asvar i
ablesdef ini
dasensuf unciónpadreyacualquierotra
vari
ablealaquel afunciónpadr et engaacceso.

//Lassigui
ent
esvari
abl
esest
án def
ini
dasenelámbi
togl
obal
varnum1=20,
num2=3,
nombre="Messi
";

/
/Est afunci
ónsedefi
neenelámbi
togl
obal
f
unctionmulti
pli
car
(){
r
eturnnum1*num2;
}

mul
ti
pli
car
();/
/Ret
orna60

/
/Unej empl
odef unci
ónani
dada
f
unctionobtener
Puntaje(
){
varnum1=2,
num2=3;

f
unctionagr
egar(
){
r
eturnnombre+"punt
aje"+(
num1+num2)
;
}

r
etur
nagr
egar
();
}

obt
ener
Punt
aje(
);/
/Ret
orna"
Messi
punt
aje5"
Ámbi
toyl
api
ladel
afunci
ón

Larecursi
vidad
Unaf unci
ónpueder ef
eri
rseyl
lamar
seasími
sma.Hayt
resf
ormasdeunaf
unci
ónpar
a
ref
eri
rseasími sma:

Elnombr edelafunción
arguments.cal
lee
Unavariabl
eenelámbi t
oenelqueseref
iereal
afunci
ón
Porejemplo,consider
elasi
gui
entedef
ini
cióndefunci
ón:

varfoo=functi
onbar(
){
/
/lassentenci
asvanaqui
};
Dentrodelcuer
podelafunci
ón,
todol
osi
gui
ent
eesequi
val
ent
e:

bar()
argument s.
cal
lee(
)
foo()
Unaf unciónquesel l
amaasími smasedenomi naunafunciónrecur
siva.Enci er
tomodo,l
a
recursi
vidadesanál ogaaunbucl e.Ambosejecut
anelmismocódi govariasveces,yambos
requi
erenunacondi ción(paraevi
tarunbucl
einfi
nit
o,omásbien,l
arecursi
vidadinfi
nit
aenest
e
caso).Porejemplo,elsigui
entebucle:

varx=0;
while(x<10){//"x<10"eslacondici
ondelbucl
e
//hacercosas
x++;
}
sepuedeconver t
irenunaf
unciónrecursi
vayunall
amadaaesaf
unci
ón:

functionloop(x){
if(x>=10)/ /"x>=10"eslacondi
ciondesali
da(equi
valent
ea" !
(x<10) "
)
return;
//hacercosas
loop(x+1) ;//l
all
amadarecursi
va
}
l
oop( 0);
Sinembar go,al
gunosal
gori
tmosnopuedenserbucl esi
terat
ivossimples.Porej
emplo,obtener
todosl osnodosdeunaestructur
adeár bol(
p.ej
.elDOM)esmásf áci
luti
li
zandorecur
sivi
dad:

functi
onwal kTree(node){
if(
node==nul l
)/ /
return;
//haceral gunacosaconelnodo
for(vari=0;i<node. chil
dNodes.lengt
h;i
++){
wal kTree(node.chil
dNodes[i]
);
}
}
Encompar aciónconl afunci
ónl oop(def
ini
daanter
iomente),
aquí(enelej
empl
owal
kTr
ee)cada
l
lamadar ecursivaasími sma, hacemuchasl l
amadasrecursi
vas.

Esposi
bleconver
ti
rcualqui
eral
gori
tmor ecur
sivoaunono-
recur
sivo,per
oamenudolalógi
ca
esmuchomáscompl ejayhacerl
orequiereelusodeunapil
a.Dehecho,lar
ecur
sivi
dadensí
mismauti
li
zaunapil
a:l
api l
adel
afunción.
Elcompor
tami
ent
oti
po-
pil
apuedeservi
stoenelsi
gui
ent
eej
empl
o:

f
unct ionfoo(i
){
i
f( i<0)
retur
n;
console.l
og('
inici
o:'+i
);
foo(i-1);
console.l
og('
final
:'+i)
;
}
f
oo( 3);

/
/Sal
ida:

//inicio:
3
//inicio:
2
//inicio:
1
//inicio:
0
//final:0
//final:1
//final:2
//final:3
Funci onesani dadasycierr
es
Sepuedeani darunaf unci
óndentr
odeunafunción.Lafunciónanidada(int
erna)esprivadaa
su f unción contenedora(exter
na)
.También f
orma un cierre.Un cier
re,es una expresi
ón
(t
ípicament eunaf unci
ón)quepuedet
enervari
ablesli
bresjuntoconunent ornoqueat aesas
variables(que" ci
erra"l
aexpresi
ón)
.

Dadoqueunaf unci
ónanidadaesunci err
e,estosigni
ficaqueunafunci
ónani dadapuede
"
heredar
"losar
gumentosyvari
ablesdesuf unci
óncontenedor
a.Enot
raspalabr
as,lafunci
ón
i
nter
naconti
eneelámbit
odelafunci
ónexter
na.xnml
l.

Lafunciónint
ernasólosepuedeaccederapar t
irdesent
enci
asdentr
odel afunciónext
erna.
Lafunciónint
ernaformaunci erre:l
af unci
óninter
napuedeuti
li
zarl
osar gument osyvari
abl
es
delafunciónexterna,mientr
asquel afunci
ónexternanopuedeutil
izarl
osar gumentosylas
vari
abl
esdel afuncióni
nterna.
Elsi
guienteej
emplomuest rafuncionesanidadas:

functi
onaddSquar es(
a,b){
functi
onsquar e(x){
ret
urnx*x;
}
ret
urnsquar e(
a)+squar e(b);
}
a=addSquar es(2,3);//retorna13
b=addSquar es(
3,4);//retorna25
c=addSquar es(4,5);//retorna41
Dadoquel afuncióninternaf ormauncier
re,sepuedell
amaralaf
unciónexter
nayespeci
fi
car
argument osparaambas, tantoparal
afunci
ónexternacomopar
alaint
erna:

f
unctionoutside(x){
f
unct i
oninside(y){
r
eturnx+y;
}
r
eturninside;
}
f
n_inside=out side(3)
;//Pensarenest
ocomo:darunaf
unci
onquesuma3al
oqueseaque
des
resul
t=f
n_i
nsi
de(
5);/
/ret
orna8

resul
t1=outside(3)(
5) ;//r
etorna8
Preser
vacióndevar iables
Observa cómo x se conser va cuando inside es r
etor
nada.Un cierr
e debe preser
varlos
argumentosyvar i
ablesdent r
odet odoslosámbi tosquerefer
encí
a.Dadoquecadal lamada
proporci
ona potencialmente difer
entes argumentos,un nuevo ci
err
e es creado par
a cada
l
lamadaaout side.Lamemor iapuedeserl iber
adasólocuandola(funci
ón) i nsi
deretor
nada
yanoesaccesi bl
e.

Est
onoesdi f
erent
edealmacenarr
efer
enci
asenotrosobj
etos,per
oamenudoesmenos
evi
dent
epor
queunonoest
abl
ecelasr
efer
enci
asdi
rect
ament
eynopuedeinspecci
onar
las.

FuncionesMulti
-anidadas
Lasfuncionespuedensermul ti
-ani
dadas,p.ejunafunción(A)quecontieneunafunci
ón( B)que
conti
eneunaf unción( C)
.Aquiambasf unci
onesByCf or
manci err
es,asíqueBpuedeacceder
A,yC puedeaccederB.Además,dadoqueC puedeaccederB,l acualpuedeaccederA,
entoncesCpuedet ambiénaccederA.Enconsecuenci a,l
oscierrespuedencontenermúl ti
ples
ámbitos;quecontienendef or
mar ecursi
vaelámbi t
odel asfuncionesquel osconti
enen.Est o
seconocecomo encadenami ento deámbi to.(
¿Porquésel el l
ama "encadenamiento"se
expli
carámásadel ante.)

Consi
der
eelsi
gui
ent
eej
empl
o:

functi
onA( x){
functi
onB( y){
functi
onC( z){
console.l
og(
x+y+z) ;
}
C(3);
}
B(2);
}
A(1);//regi
stra6(1+2+3)
Enest eejemplo,CaccedeaydeByaxdeA.Est
osepuedehacerpor
que:

Bf or
maunci er
requeincluyeA,esdecirBpuedeaccederal osar
gumentosyvari
ablesdeA.
Cf or
maunci er
requeincluyeB.
Debidoaqueelci er
redeBi ncl
uyeaA,yelci er
redeCi ncluyeaA,estopermit
equeCpuede
accederalos argument osyvariabl
esdeByA.Enot r
aspal abr
as,Cencadenalosámbit
osde
ByAeneseor den.
Locontrari
o,si
nembar go,noesci er
to.AnopuedeaccederaC,yaqueAnopuedeaccedera
ningunargumentoovar i
abledeB,delqueCesunavar i
able.Así
,queCpermancepr i
vadosól
o
paraB.

Confli
ctosdenombres
Cuandodosar gument
osovar i
abl
esenlosámbi tosdeunci er
reti
enenelmismonombr e, ocur
re
unconf l
ict
odenombr e.Losámbitosmási nt
ernost omanprecedenci
a,asiqueelambi tomás
i
nternodet odostomalaprecedenci
amásal t
a,mi ent
rasqueelámbi tomásexternot omal a
másbaj a.Estaeslacadenadeámbi t
o.Elpr i
mer oenlacadenaeselámbi t
omási nter node
todos,yelúlt
imo,
eselámbitomásexterno.Considerel
osigui
ente:

f
unct i
onout
side(){
varx=10;
functi
oni
nside(x){
 r
etur
nx;
}
r
eturni
nsi
de;
}
resul
t=out si
de(
)(20);//ret
orna20enlugarde10
Elconfli
ctodenombr essucedeenlasentenciar
eturnxyesentreelpar
ámetr
oxdei nsi
deyla
vari
ablexdeout side.Aquílacadenadeámbi t
oes{insi
de,
out
side,obj
etogl
obal}
.Porl
otanto,
x
deinsidetomapr ecedenciasobrexdeout si
de,y20(laxdei
nside)sedevuel
veenlugarde10
(l
axdeout si
de)
.

Cl
ausur
as(
oci
err
es)

Lascl ausuras( i
nformalment ellamadasci err
es)sonunadel ascaracterísti
casmáspoder osas
deJavaScr i
pt .JavaScriptper mi tedebi doalani damientodef uncionesyconcesi onesal a
funcióninterna,elaccesot otalat odasl asvar i
ablesyf uncionesdef i
nidasdent r
odel afunción
externa(yat odasl asvariablesyf uncionesal ascualesl afunciónext ernat i
eneacceso) .Sin
embar go,laf unciónexternanot ieneaccesoal asvar i
ablesyf uncionesdef inidasdent r
odel a
funcióninterna.Est oproveeunaespeci edesegur i
dadal asvar i
ablesdel af unci
óni nterna.
Además,yaquel afunci
óni nternat ieneaccesoalámbi todel afunciónext erna,lasvariablesy
funcionesdef i
nidasenl af unci ónext er naviviránmást iempoquel af unciónexternaensí
mi smasil af uncióninternal asadmi nistrapar asobr evi
virmásal l
ádelci clodevi dadel a
funciónexterna.Unacl ausur aescr eadacuandol af
unci óninter
naes, deal gunamaner a,hecha
disponibleacual quier ámbi tofuer adel af unciónexterna.

varpet=f uncti
on(
name){ /
/Laf
unci
onext
ernadef
ineunavar
iabl
ell
amada"
name"
vargetName=funct
ion(
){
ret
urnname; /
/Laf
unci
oni
nter
nat
ieneacesoal
avar
iabl
e"name"de
l
af uncionexter
na
}

r
etur
ngetName; /
/Devol
verl
afunci
oni
nter
na,
porl
otant
oexponi
endol
a
aunambitoext
eri
or
}
,
myPet=pet("
Vivi
e")
;

myPet()
; /
/Devuelve"Vi
vie"
Estopuedesermuchomáscomplej
oqueelcódigoanteri
or.Puedeserr
etornadounobj
etoque
conti
enemétodospar
amani
pularl
asvari
abl
esinter
nasdel afunci
ónext
erna.

varcreat
ePet=f
unct
ion(
name){
varsex;

r
eturn{
setName:f
unct
ion(
newName){
name=newName;
},

getName:funct
ion(
){
ret
urnname;
},

getSex:f
unct
ion(
){
ret
urnsex;
},

set
Sex:f
unct
ion(
newSex){
 i
f(
typeof newSex == " st
ri
ng" && (
newSex.
toLower
Case(
) == "
mal
e" |
|
newSex.toLower
Case()=="
femal
e")
){
sex=newSex;
}
}
}
}

varpet=creat
ePet
("
Vivi
e")
;
pet.
getName()
; /
/Vi
vie

pet.
setName( "Oli
ver")
;
pet.
setSex("male");
pet.
getSex(); /
/male
pet.
getName( ); //Ol
iver
Enelcódi goant eri
or,l
avar i
ablenamedel afunciónext ernaesaccesi bledesdel asf unciones
i
nternas,ynohayot raformadeaccederal asvar i
ablesi nternasexcept oat ravésdel as
funci
ones i nternas. Las var i
ables inter
nas de l as f unciones internas act úan como
almacenami entossegur osparalasvari
ablesyar gument osext ernos.Mantienen"persistente"
,y
aúnsegur a,lainformaciónconl aquenecesi t
ant rabaj
arl asfuncionesinternas.Lasf unciones
i
nclusonot ienenporqueserasi gnadasaunavar iable,
ot enerunnombr e.

vargetCode=( f
unct
ion(){
varsecureCode="0]Eal
(eh&2"
; /
/Uncodi
goquenoquer
emosqueext
ernosseancapaces
demodi f
icar.
..

r
eturnfunct
ion(
){
r
etur
nsecureCode;
}
;
}
)()
;

getCode()
; / /Retor
naelcodi
gosecreto
Hay,sinembargo,unaseri
eobstácul
osavi gil
arcuandoseusanclausuras.Siunafunci
ón
encerr
adadef
ineunavari
abl
econelmismonombr equeunavari
abl
edentr
odelámbitoext
eri
or,
nohayf or
marefer
ir
sedenuevoalavariabl
edelámbit
oexter
ior
.

varcr eatePet=funct
ion(name){ / /lafunci
onexter
nadefineunavariablell
amada" name"
return{
set Name:functi
on(name){ / /lafunci
onencerr
adat ambiendefineunavar i
ablell
amada
"name"
name=name; //¿¿¿Comoaccedemosl a"name"def i
nidaporlafuncion
externa? ??
}
}
}
La var i
able mágica this es muy t ramposa en las clausuras.Deben de ser usadas
cuidadosament e( l
as clausuras que usan thi
s),elmodo en que t his se refi
ere depende
compl etamentedeendondel afunciónfuell
amada,enlugardeendondef uedefini
da.

Unexcel
ent
eyel
abor
adoar
tí
cul
osobr
ecl
osur
espuedeencont
rar
seaqui
.

Usandoelobj
etoar
gument
s

Losargument
osdeunaf
unciónsonmanteni
dosenunobj
etosimil
araunarr
ay.Dentr
odeuna
funci
ón,l
osar
gument
ospasadosalami
smapuedenserdi
recci
onadosdel
asigui
entefor
ma:
arguments[
i]
dondeieselnúmer oor dinaldelargument
o,comenzandodesdecero.Entonces,elpri
mer
argumento pasado a una funci
ón serí
a ar
gument
s[0]
.Elnúmerot otalde argument
os es
mostradoporarguments.l
ength.

Usandoelobjetoarguments,sepuedellamarunaf unciónconmásargumentosdel osque

formal
mentefuerondecl
aradosquepuedeacept ar.Est
oesamenudomuyút i
lcuandonose
sabe con ant
elaci
ón cuantos ar
gumentos serán pasados a laf
unci
ón.Se puede usar
argument
s.l
engthparadeter
minarelnúmerodear gumentosreal
ment
epasadosalafunci
ón,y
l
uegoaccederacadaargument ousandoelobj
etoarguments.

Porej
emplo,consi
deremosunaf unci
ónqueconcatenavari
ascadenasdecaract
eres(str
ings)
.
Elúnicoargumentoformalpar
al afunciónesunast r
ingqueespecifi
caloscaract
eresque
separ
anloselementosaconcat
enar.Lafunci
ónesdefi
nidadel
asiguient
eforma:

functi
onmyConcat (separ at
or){
varresul t="",//init
iali
zeli
st
i;
//it
er atethroughar gument s
for(i=1;i<ar gument s.l
ength;i
++){
resul t+=argument s[
i]+separat
or;
}
ret
ur nr esul
t;
}
Sepuedenpasarcual quiernúmerodear gument
osaest
afunci
ón,
ylami
smaconcat
enar
ácada
argument oenuna" l
ista"destri
ngs:

/
/ret
urns"r
ed,orange,bl
ue,
"
myConcat
("
,",
"red"
,"or
ange"
,"bl
ue"
);

/
/ret
urns"elephant;gi
raf
fe;l
ion;cheetah;"
myConcat
(";","
elephant
","
gir
affe"
,"l
ion","
cheet
ah"
);

//r
etur
ns"sage.basi
l.oregano.pepper.parsl
ey."
myConcat
("."
,"sage"
,"basil
","
oregano",
"pepper"
,"par
sley"
);
Lavari
abl
eargumentsesde" esti
loarr
ay",per
onoesunar ray.

Par
ámet
rosdef
unci
on

Apart
irdeECMAScri
pt6,haydosnuevost
iposdepar
ámet
ros:Par
ámet
rospordef
ect
oy l
os
par
ámetrosREST.

Parámet r
opordef ect
o
EnJavaScr ipt
,lospar ámetr
osdef uncionesestánestabl
eci
dospordef ectoaundefi
ned.Si
n
embar go,encier
tassit
uacionespuedeserútilest
abl
ecerl
osaunvalorsumi ni
str
adopordef
ect
o
di
ferente. Esentoncescuandol osparámetrospordef
ectopuedenayudar.

Enelpasado,laestrat
egiageneralparaestablecerlosparámetrospordefectoeracompr obar
l
osval oresdeést
osenelcuerpodel afunci
ónyasi gnarunvalorsiestoseranundef
ined.Sien
elsiguienteej
emploningúnvaloressumi ni
stradoparabdur anteelll
amado,suval orsería
undefi
nedcuandoseeval úea*b;yl all
amdade mul ti
ply ret
or nar
íaNaN.Sinembar go,esto
seevitaconlasegundalí
neaenest eejemplo:

f
uncti
onmul t
ipl
y(a,b){
b=typeofb!=='undef
ined'
? b:1;
 r
etur
na*
b;
}

mult
ipl
y(5)
;//5
Conlosparámetr
ospordefect
o,l
acompr
obaci
ónenelcuer
podelaf
unci
ónyanoesnecesar
ia.
Ahor
a,puedesimplement
eponer1comoval
orpordef
ect
oparabenl
acabezadel
afunci
ón.

f
unctionmult
ipl
y(a,
b=1){
r
eturna*
b;
}

mult
ipl
y(5)
;//5
Par
amásdet al
les,
puedeconsul
tarpar
ámet
rospordef
ect
oenl
aref
erenci
a.

Parámetr
osr est
Lasyntaxisdepar ámetr
osrest(eni
ngl
és)nosper mi
terespresent
arunnúmer oindefi
nidode
argumentosenf or
madear ray.Enelej
emplo,usamoslospar ámet
rosrestpararecol
ectarl
os
argumentosapar ti
rdelsegundoyhastaelfinal
.Ent
onceslosmul ti
pli
camosporelpr imero.
Esteej
empl oestáusandounafunci
ónfl
echa,l
acualesint
roducidaenlasigui
ent
esección.

f
unctionmul
ti
ply(
mult
ipl
ier
,..
.t
heAr gs){
r
eturnt
heAr
gs.map(
x=>mul t
ipl
ier*x);
}

vararr=multipl
y(2,
1,2,3)
;
console.
log(
arr)
;//[2,
4,6]
Funcionesfl
echa

Unaexpr esi
óndef unci
ónf l
echa( t
ambiénconoci
dacomof unciónflechagruesaofatarr
ow
funct
ioneni ngl
és)ti
eneunasi nt
axismáscortacomparadaconl asexpresi
onesdefunci
óny
nottienesupr opiothi
s,arguments,superonew.tar
get.Lasfuncionesf l
echasonsiempre
funci
onesanónimas.Véaset ambiénestaent
radaenelbloghacks.mozil
la.
org:"ES6I
nDepth:
Arrowfuncti
ons"(eni
nglés)
.

Dosfact
oresi
nfl
uenci
aronl
aint
roduci
óndel
asf
unci
onesf
lecha:f
unci
onesmáscor
tasyel
l
éxi
cothi
s.

Funcionesmáscort
as
Enalgunospat
ronesfunci
onal
es,
lasf
unci
onesmáscor
tassonbi
enveni
das.Compar
e:

vara=[
"Hydrogen",
"Heli
um",
"Li
thium",
"Beryl­l
ium"
];

vara2=a.
map(
funct
ion(
s){r
etur
ns.
lengt
h})
;

vara3=a. map(s=>s. l
ength);
Sinpr opi
othi
s
Hast aantesdelasfunci
onesf l
echa,cadanuevafunci
óndefi
níasupropi
ovalorthi
s(unnuevo
objectoenelcasodeunconst ruct
or,nodefini
doenll
amadaaf unci
onesenmodoest ri
cto,el
objetodecontextosilafuncionesllamadacomoun" metododeobjeto"
,et
c.).Est
oprobóser
mol estoenunesti
lodeprogramaciónorient
adaaobjet
os.
f
unctionPerson(
){
/
/Elconstruct
orPer
son(
)def
ine`
thi
s`comoelmi
smo.
t
his.age=0;

setI
nterval
(funct
iongrowUp(){
//Enmodonoest ri
cto,
lafunciongr owUp()def
ine`
this`
//comoelobj etogl
obal,elcualesdi f
erent
edeel`t
his`
//defini
doporelconstructorPerson().
t
his.age++;
},
1000) ;
}

varp=newPerson(
);
EnECMAScri
pt3/5,est
of uesol
uci
onadoasi
gnadoelval
orcont
eni
doport
hisa unavar
iabl
e
sobr
elaquesepodí
acerrar(ocl
ausur
ar)
.

f
unctionPerson(){
varself=t
his;//Al
gunosel
igen`
that
`enl
ugarde`sel
f`
.
//El
ij
aunoyseaconsi
stent
e.
sel
f.age=0;

setI
nterval(
funct
iongr
owUp(){
//Lar et
roll
amadaserefi
erealavar
iabl
e`sel
f`del
acual
//elvaloreselobj
etoesperado.
sel
f.age++;
},
1000) ;
}
Alt
ernat
ivament
e,unafunci
ónli
gadapodr
íasercr
eadademodoqueelpr
opi
oval
orde t
his
ser
íapasadoalafunci
óngrowUp()
.

Lasfunci
onesf
lechacapt
uranelval
ordet
hisdelcont
ext
oci
rcundant
e,porl
oqueelsi
gui
ent
e
códi
gofunci
onacomoseespera.

f
unctionPerson(
){
t
his.age=0;

setI
nterval
((
)=>{
t
his.age++;/
/|t
his|ser
efi
ereapr
opi
adament
ealobj
etoi
nst
anci
adePer
son.
},
1000) ;
}

varp=newPer
son(
);

I
nter
acci
óndeJavaScr
iptenHTML
Haydosfor
masdei ncl
uirJavaScr
iptenHTMLyhacerquef uncionenjuntos,
lasf
ormasenque
podemosconect
arJavaScri
ptconHTML.AgregarJavaScr
iptdirectamenteaunarchi
voHTML

Lapr i
meraformadeinser
tarJavaScr
iptenHTMLesdi r
ect
a.Puedeshacer
loutil
izandol a
eti
queta<scr
ipt
></
scr
ipt
>quedebeenvolvert
odoelcódi
goJSqueescri
bas.Sepuedeagr egar
elcódi
goJS:

entr
elasetiquet
as<head>
entr
elasetiquet
as<body>
Dependiendo dedóndeagregueselcódigo JavaScr
ipten t
u ar
chivo HTML,l
acargaserá
dif
erent
e.Porl ogener
alser
ecomiendaagregarl
oenlasección<head>paraqueper
manezca
separadodelcont
eni
dodet uarchi
voHTML.Per ocol
ocar
lodentrode<body>puedeayudara
mejorarl
aveloci
daddecarga,yaqueelcontenidodelsi
ti
owebsecar garámásrápido,ysol
o
despuésdeesoseprocesar
áelJavaScri
pt.Paraesteej
emplo,echemosunvist
azoalsigui
ent
e
archi
voHTMLquedebemost rarlahor
aactual
:

<!
DOCTYPEht ml >
<htmllang="en-US">
<head>
<metachar set
="UTF- 8">
<metaname=" vi
ewpor t"cont
ent="
width=devi
ce-wi
dth,i
nit
ial
-scal
e=1">
<scri
pt>JAVASCRI PTI SUSUALLYPLACEDHERE</ scr
ipt
>
<ti
tl
e>Timer i
ghtnowi s:</t
it
le>
</head>
<body>
<scri
pt>JAVASCRI PTCANALSOGOHERE</ scri
pt>
</body>
</html>
Enestemoment o,
elcódi goanter
iornocontieneJavaScri
pty,porlotant
o,nopuedemostrarl
a
hora.Podemosagr egarelsigui
entecódigoparaasegurar
nosdequemuest r
elahoracor
rect
a:

varti
me=newDat e(
);
console.
log(
ti
me. get
Hours()+":
"+ti
me.getMi nut
es()+":
"+ti
me.getSeconds()
);
Envolver
emos est e códi
go con l
as et
iquetas <scri
pt> y</scr
ipt> ylo colocar
emos en l
a
cabecera(head)delcódigoHTMLpar agar anti
zarquecadavezquesecar guelapági
na,se
genereunaal er
taquemuest relahor
aact ualalusuari
o.Asíescomosever áelarchi
voHTML
despuésdeagr egarelcódi
go:

<!
DOCTYPEht ml>
<htmllang="en-US">
<head>
<metachar set="
UTF- 8">
<metaname=" vi
ewpor t"content
="widt
h=device-widt
h,i
nit
ial
-scal
e=1">
<ti
tl
e>Timer i
ghtnowi s:</t
itl
e>
<scri
pt>
varti
me=newDat e(
);
console.l
og(ti
me. get
Hour s()+":
"+time.getMinutes(
)+":
"+time.getSeconds()
);
</scri
pt>
</head>
<body>
</body>
</html>
Siquieresmost rarlahor adentr
odelcuer po(body)delapágina,deberásincl
uirl
ascr
iptdent
ro
delaset i
quetas<body>del apáginaHTML.Asíescomosever áelcódigocuandolohagas:

<!
DOCTYPEht ml >
<htmllang="en-US">
<head>
<metachar set
="UTF-8" >
<metaname=" vi
ewpor t"cont
ent="
widt
h=device-
widt
h,i
nit
ial
-scal
e=1"
>
<ti
tl
e>Timer i
ghtnowi s:</t
it
le>
</head>
<body>
<scri
pt>
l
etd=newDat e();
document .
body.innerHTML=" <h1>Ti
merightnowis: "+d. get
Hours(
)+"
:"+d.
get
Minut
es(
)+
":
"+d.getSeconds( )
"</h1>"
</scri
pt>
</body>
</html>

Queesj
quer
y?
j
Quer yesunabi bli
otecamul ti
platafor
madeJavaScr i
pt,cr
eadai nicial
ment eporJohnResi g,que
permitesi mplifi
carlamaner adeinteractuarconl osdocument osHTML, mani pularelárbol DOM,
manej arevent os,desar r
ollaranimacionesyagr egarint
eracci
ónconl atécnicaAJAXapági nas
web.Fuepr esent adael14deener ode2006enelBar CampNYC.Deacuer doaunanál isi
sdel a
Web( reali
zadoen2017)JQuer yesl abi bl
iotecadeJavaScr i
ptmásut i
li
zada,porunampl io
mar gen.
j
Quer yessof t
war elibreydecódi goabiert
o,poseeundobl eli
cenci amientobaj ol aLicenciaMI T
ylaLi cenciaPúbl i
caGener aldeGNUv2,per miti
endosuusoenpr oyectosl ibresypr i
vados.
j
Quer y,ali gualque ot ras bibli
otecas,of rece una serie de f uncionali
dades basadas en
JavaScr iptquedeot r
amaner arequer i
rí
andemuchomáscódi go,esdeci r,conl asfunciones
propiasdeest abibli
otecasel ograngr andesr esult
adosenmenost iempoyespaci o.

I
nter
acci
ónj
quer
yJavascr
ipt
jQueryestádiseñadopar acambi arlafor maenqueescr i
bimosJavaScr i
pt.jQuer yessof t
war e
l
ibreydecódi goabi er
to,permiti
endosuusoencual quierpr oyect
o.jQuer y,aligualqueot r
as
bibl
iotecas,ofreceunaser iedef uncional i
dadesbasadasenJavaScr iptquedeot r
amaner a
requerir
íandemuchomáscódi go,esdeci r
,conl asf unci
onespr opi asdeest abi bli
otecase
l
ogr an grandes result
ados en menos t iempo y espaci o.La car act erísti
ca pr i
ncipalde l a
bibl
iotecaesqueper mitecambiarelcont enidodeunapági nawebsi nnecesi dadder ecar gar
la,
medi antelamani pul
acióndelárbolDOM ypet i
cionesAJAX.Par aell
out il
izal afunciónj Query()
osuf ormaabr evi
ada$( ).
jQueryconsi steenunúni cof i
cher oJavaScr iptquecont i
enel as
funcionali
dadescomunesdeDOM,event os,efectosyAJAX.Est ear chi vo( enelmoment ode
escribi
resto,laulti
maver si
óndej Queryesl a1. 8.
0,porl ot antoelarchi voeselj query-1.8.0.
js)
l
opodemosbaj ardelsi
tioofici
aldejQuer y.

Exist
endosver sionesdelar chi
vo,unoparadesar
roll
o(j
query-
1.8.
0.j
s)de252KByotropara
producci
ón( j
query-1.8.
0.min.
js)de32KB.
Unavezbaj ado,paraut i
li
zarl
oenunapági naweb,debemosrefer
enciar
loenl
asecci
ón<head>
delapágina,delasi gui
entemaner a:

<scr
iptt
ype="
text
/javascr
ipt
"sr
c="
jquer
y-1.
8.0.
js"
/>

Jquer
yysuf
unci
ONenht
ml

funciónj
Queryht
ml(
)podemosobt
enercódi
gohtmldeunnododelDOM oasi
gnár
sel
o.Deest
a
maner apodr
emosmanipul
ardeunamaner afáci
llosdi
fer
ent
eselement
osquehayenuna
páginaweb.

Secompl
ement
aper
fect
ament
econl
asf
unci
onesget
()ypost
()
.Ot
rasf
unci
onessi
mil
aresson:

l
oad()
empty()yremove( )
text
()
addClass(
)yr emoveClass()
append(),
pr epend()yafter
()
Sint
axisdej Queryhtml()
Vamosar epasarlassintaxi
sdeest
afunci
óndej
Quer
yext
raí
dadel
awebof
ici
al:
$(
sel
ector
).
html(
)
$(
sel
ector
).
html(
cont
enido)
Osexpl
icolas2manerasquehayder
efer
enci
arl
a:

Enlaprimeral
lamadaobtendr
íamoselconteni
doHTMLdelpr imernodoquecoi ncidaconel
sel
ect
or.
Enlasegundaasi
gnarí
amosundet er
minadoconteni
doat odoslosnodosquecoincidanconel
sel
ect
or.
Talycomohemosvi st
o,est
afunci
ónescapazdeasi gnarconteni
douobtenerelcont eni
dode
undeter
minadonododelDOM.

Ej
emplodej
Queryht
ml(
)paraobt
enerelcont
eni
dodeunnododelDOM
Vamosconest
epri
merejempl
oparavercómopodemosobt
enerelval
ordeunnododelDOM:

<!
--li
brer
iaj
quer
y--
>
<scri
pt type='
text
/javascr
ipt
'
src="
//aj
ax.
googl
eapi
s.com/
ajax/
li
bs/
jquer
y/1.
8.3/
jquer
y.mi
n.j
s"></
scr
ipt
>

<scri
pt>
$(document)
.ready(f
uncti
on()
{
$("
#boton01").
cli
ck(f
uncti
on()
{
al
ert
($(
"p").
html()
);
})
;
})
;
</scri
pt>

QuéesAJAX?
AJAX signif
ica JavaScri
ptasíncrono y XML (Asynchronous JavaScr
iptand XML).Es un
conjunt
odet écnicasdedesarroll
owebqueper mi t
enquel asapli
caci
oneswebf unci
onende
for
maasí ncr
ona, pr
ocesandocualquiersol
ici
tudalservi
dorensegundoplano.

Elusodeaj
ax
Lapr i
mer aimpresiónquehet eni
dosobr eelusodeAj axenj Queryesreal
ment egrata,porla
facili
dad con l a que se puede r eal
izar un pr i
mer ejempl o.Se trat
a de un ej emplo
extremadament e senci
ll
o,per o si
rve par a abri
rnos las puer t
as a muchas apl i
caciones
i
nt eresantes.Habíamosvistoenot r
osf ramewor ksJavascriptejemplossimilar
es,comoenel
artículo Ajax con Mootool
s,perot enemos que qui t
arnos elsombr er
o ant ela extr
emada
senci l
lezconl aquesepuedehacerunej emplosimi l
arenj Query.Seasufi
cientedecirqueen
esteej empl odeAj axuti
li
zaremost ansól o4l í
neasdecódi go,delascualessólo1espar a
ejecutarlapr opi
all
amadaalser vi
dorporAj ax.

Tr
aeruncont
eni
doconAj
axalpul
sarunenl
ace

Enestesencil
loej
emploharemosll
amadaaAjax,paratr
aerunconteni
do,cuandosepulseun
enl
ace.Estolohemospuestoenmarchaenelser
vidordeDesar
rol
loWeb.comoylopuedesver
enunapáginaapart
e.
Aquípodemosverelenlace,alqueponemosunidenti
fi
cador(
atr
ibutoid)parasel
ecci
onarl
o
desdejQuery.

<ahr
ef="
#"i
d="
enl
aceaj
ax"
>Hazcl
ic!
</a>

Sihemosl
eídohast
aaquíelManualdej
Quer
ypodr
emossabercómoasi
gnarunevent
oaun
enl
ace.Noobst
ant
e,r
ecor
demoscómoasi
gnarunaf
unci
ónpar
acuandosehagacl
icenel
enl
ace:

$(document ).
ready(functi
on(){
$("
#enlaceajax").cl
ick(
functi
on(event
o){
//el
iminoelcompor tamient
opordefect
odelenl
ace
evento.preventDefault
()
;
//Aquípondr í
aelcódi godelallamadaaAj
ax
})
;
})

Yaset r
atasól
odeponerenmar chaAj
axdentr
odelaf uncióndelevent
o" cli
ck"sobr
eelenlace.
Per
oant esvoyanecesitarunacapadondemost r
arelcont enidoquevamosar eci
birdel
ser
vidorconlall
amadaAj ax.Lepondremosid="
destino"parapoderr eferi
rnosael l
adesde
j
Query:

Yahor
alapart
emási nt
eresant
e,dondepodemosverquétanfáci
lessonl
ascosasconest
e
f
ramewor
kJavascr
ipt
.Unaúnicalí
neadecódi
goser
ásufi
cient
e:

$(
"#dest
ino"
).
load(
"cont
eni
do-
ajax.
html
")
;

Conestasi
mplesentenci
aest amosr eal
izandounal
lamadaaAj axconjQuer
y.Esunasimpl
e
i
nvocaci
ónalmétodoload()deunel ement odel
apágina,enconcr
etoelquehabí
amospuest
o
con i
d="
dest
ino"
.Almét odo load(
)l epasamoscomo par ámet
rolarutadel apági
naque
quer
emoscargardent
rodelelemento.

Elarchi
voquecar gamosconl oad()enesteej emploes" cont eni
do- aj
ax.ht
ml"ysi mplementele
hemoscolocadount extocualquiera.Lohemosguar dadoenelmi smodi r
ectori
oquel apágina
webdondeest áelscri
ptjQuery.
paraqueesteejemplofuncionedebecol ocarseenunser vidorweb, puestoquel all
amadapor
Ajaxsehaceporht t
pyelar chi
voquesecar gaent oncestienequer ecibi
rseporunser vi
dorweb,
quel omandeconesepr ot
ocoloalnavegador .Siponesl osar chivosent udi scoduroyl os
ejecut
astalcual
,not efuncionará.Puedesut i
li
zarcualqui erespaci odehost i
ngquet engaso
bienunservi
dorwebquepuedast eneri
nstaladoent uordenador .

Asídesi mple!Podemosverelcódi gocompl etodeesteejemplo:

<html>
<head>
<ti
tl
e>AjaxSi mpl e</ t
it
le>
<scri
ptsrc="jquery-1.3.2.mi n.
js"type="text/j
avascr
ipt
"></
scri
pt>
<scri
pt>
$(document ).
ready(funct ion(){
$("
#enlaceajax").click(function(evento){
evento.prevent Default(
);
$("
#dest i
no").load("cont enido-aj
ax.html"
);
})
;
})
</scri
pt>
</head>
<body>

<ahref
="#"id="enlaceaj
ax"
>Hazcl
ic!
</a>
<br
>
<di
vid="desti
no"></div>

</
body>
</
html
>

Basesdei nt
eracci
ondelost
rest
iposdel
enguaj
esquesepuedel
ogr
arl
os
resul
tadosdeunapági
naweb?
Conestostresti
posdel enguajessepuedel ogr
arquel apaginawebseadi námi
caquepermita
alusuari
osinter
actuarconl apáginaenl acualqui er
asinfor
marconst ant
ementeelcont
enido
delapaginawebpar aof recermayorposibil
idaddedesar r
oll
oquet engaunacapacidadef
icaz
en cada uno deest ost i
posdel enguaj
es,yt ienen una expect
ati
va paraimpl
ementarsu
i
nteracci
ónypoderl l
evaracabosuf unci
ón