1import{S as Dv,i as Tv,s as Mv,N as Pk,z as Kv,A as Iv,C as Lv,R as Rv,T as bm,t as Hv,b as Sv,D as Nv,O as Om,e as l,d as r,f as p,l as c,m as u,k as i,j as a,n as o,o as k,B as Fv,p as e,q as n,y as Av}from"./index.bd0d3ab8.js";import{L as Bv}from"./Layout.872cfa2b.js";function Uv(ua){let f,y,h,es,d,x,ra,En,ol,Ee,ia,ll,_e,ka,cl,we,he,be,fa,ps,ul,da,rl,il,Oe,je,Je,ma,kl,Pe,os,_n,fl,dl,Ce,D,wn,ml,vl,hn,yl,El,bn,_l,xe,ls,Jm=`<code class="language-js"><span class="token keyword">const</span> names <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jack'</span><span class="token punctuation">,</span> <span class="token string">'Jace'</span><span class="token punctuation">,</span> <span class="token string">'Jane'</span><span class="token punctuation">,</span> <span class="token string">'Josh'</span><span class="token punctuation">,</span> <span class="token string">'Kai'</span><span class="token punctuation">,</span> <span class="token string">'Kevin'</span><span class="token punctuation">,</span> <span class="token string">'Ken'</span><span class="token punctuation">,</span> <span class="token string">'Kyle'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 2names<span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">val<span class="token punctuation">,</span> idx<span class="token punctuation">,</span> arr</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> 3 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>val<span class="token punctuation">,</span> idx<span class="token punctuation">,</span> arr<span class="token punctuation">)</span><span class="token punctuation">;</span> 4<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,De,va,wl,Te,ya,hl,Me,cs,Pm=`<code class="language-js"><span class="token keyword">const</span> names <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jack'</span><span class="token punctuation">,</span> <span class="token string">'Jace'</span><span class="token punctuation">,</span> <span class="token string">'Jane'</span><span class="token punctuation">,</span> <span class="token string">'Josh'</span><span class="token punctuation">,</span> <span class="token string">'Kai'</span><span class="token punctuation">,</span> <span class="token string">'Kevin'</span><span class="token punctuation">,</span> <span class="token string">'Ken'</span><span class="token punctuation">,</span> <span class="token string">'Kyle'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 5<span class="token keyword">let</span> namesStartingJ <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">;</span> 6names<span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">val</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> 7 <span class="token keyword">if</span> <span class="token punctuation">(</span>val<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token operator">===</span> <span class="token string">'J'</span><span class="token punctuation">)</span> namesStartingJ<span class="token operator">++</span><span class="token punctuation">;</span> 8<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 9console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>namesStartingJ<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Ke,us,On,bl,Ol,Ie,rs,Cm=`<code class="language-js"><span class="token keyword">const</span> names <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jack'</span><span class="token punctuation">,</span> <span class="token string">'Jace'</span><span class="token punctuation">,</span> <span class="token string">'Jane'</span><span class="token punctuation">,</span> <span class="token string">'Josh'</span><span class="token punctuation">,</span> <span class="token string">'Kai'</span><span class="token punctuation">,</span> <span class="token string">'Kevin'</span><span class="token punctuation">,</span> <span class="token string">'Ken'</span><span class="token punctuation">,</span> <span class="token string">'Kyle'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 10names<span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">val</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> 11 val <span class="token operator">=</span> val <span class="token operator">+</span> <span class="token string">' is cool'</span><span class="token punctuation">;</span> 12<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 13console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>names<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Le,Ea,jl,Re,_a,jn,Jl,He,is,Jn,Pl,Cl,Se,wa,xl,Ne,ks,xm=`<code class="language-js"><span class="token keyword">const</span> names <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jack'</span><span class="token punctuation">,</span> <span class="token string">'Jace'</span><span class="token punctuation">,</span> <span class="token string">'Jane'</span><span class="token punctuation">,</span> <span class="token string">'Josh'</span><span class="token punctuation">,</span> <span class="token string">'Kai'</span><span class="token punctuation">,</span> <span class="token string">'Kevin'</span><span class="token punctuation">,</span> <span class="token string">'Ken'</span><span class="token punctuation">,</span> <span class="token string">'Kyle'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 14names<span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">val<span class="token punctuation">,</span> idx<span class="token punctuation">,</span> arr</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> 15 arr<span class="token punctuation">[</span>idx<span class="token punctuation">]</span> <span class="token operator">=</span> val <span class="token operator">+</span> <span class="token string">' is cool'</span><span class="token punctuation">;</span> 16<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 17console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>names<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Fe,ha,Pn,Dl,Ae,ba,Tl,Be,Oa,Ml,Ue,fs,Dm=`<code class="language-js"><span class="token keyword">const</span> names <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jack'</span><span class="token punctuation">,</span> <span class="token string">'Jace'</span><span class="token punctuation">,</span> <span class="token string">'Jane'</span><span class="token punctuation">,</span> <span class="token string">'Josh'</span><span class="token punctuation">,</span> <span class="token string">'Kai'</span><span class="token punctuation">,</span> <span class="token string">'Kevin'</span><span class="token punctuation">,</span> <span class="token string">'Ken'</span><span class="token punctuation">,</span> <span class="token string">'Kyle'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 18<span class="token keyword">const</span> coolNames <span class="token operator">=</span> names<span class="token punctuation">.</span><span class="token function">map</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token operator">=></span> name <span class="token operator">+</span> <span class="token string">' is cool'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 19console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>coolNames<span class="token punctuation">)</span><span class="token punctuation">;</span> 20console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>names<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Ye,ds,Kl,Cn,Il,qe,ms,Ll,xn,Rl,We,vs,Dn,Hl,Sl,Ge,T,Tn,Nl,Fl,Mn,Al,Bl,Kn,Ul,Ve,q,Yl,In,ql,Wl,$e,M,Gl,Ln,Vl,$l,Rn,zl,Xl,ze,ja,Ql,Xe,Ja,Zl,Qe,ys,Tm=`<code class="language-js"><span class="token keyword">const</span> names <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jack'</span><span class="token punctuation">,</span> <span class="token string">'Jace'</span><span class="token punctuation">,</span> <span class="token string">'Jane'</span><span class="token punctuation">,</span> <span class="token string">'Josh'</span><span class="token punctuation">,</span> <span class="token string">'Kai'</span><span class="token punctuation">,</span> <span class="token string">'Kevin'</span><span class="token punctuation">,</span> <span class="token string">'Ken'</span><span class="token punctuation">,</span> <span class="token string">'Kyle'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 21<span class="token keyword">const</span> JNames <span class="token operator">=</span> names<span class="token punctuation">.</span><span class="token function">filter</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token operator">=></span> name<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token operator">===</span> <span class="token string">
21'J'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 22console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>JNames<span class="token punctuation">)</span><span class="token punctuation">;</span> 23console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>names<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Ze,Es,gl,Hn,sc,ge,_s,ac,Sn,nc,sp,P,Nn,tc,ec,Fn,pc,oc,An,lc,cc,ap,ws,Mm=`<code class="language-js"><span class="token keyword">const</span> cars <span class="token operator">=</span> <span class="token punctuation">[</span> 24 <span class="token punctuation">{</span> <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'Volvo'</span><span class="token punctuation">,</span> <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2016</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> 25 <span class="token punctuation">{</span> <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'Saab'</span><span class="token punctuation">,</span> <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2001</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> 26 <span class="token punctuation">{</span> <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'BMW'</span><span class="token punctuation">,</span> <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2010</span> <span class="token punctuation">}</span> 27<span class="token punctuation">]</span><span class="token punctuation">;</span> 28<span class="token keyword">const</span> newCars <span class="token operator">=</span> cars<span class="token punctuation">.</span><span class="token function">filter</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">car</span><span class="token punctuation">)</span> <span class="token operator">=></span> car<span class="token punctuation">.</span>year <span class="token operator">></span> <span class="token number">2005</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,np,hs,uc,Bn,rc,tp,bs,ic,Un,kc,ep,Pa,fc,pp,Ca,dc,op,Os,Km=`<code class="language-js"><span class="token keyword">const</span> nums <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">,</span> <span class="token number">9</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 29<span class="token keyword">const</span> sum <span class="token operator">=</span> nums<span class="token punctuation">.</span><span class="token function">reduce</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">total<span class="token punctuation">,</span> val<span class="token punctuation">,</span> idx<span class="token punctuation">,</span> arr</span><span class="token punctuation">)</span> <span class="token operator">=></span> total <span class="token operator">+</span> val<span class="token punctuation">)</span><span class="token punctuation">;</span> 30console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>sum<span class="token punctuation">)</span><span class="token punctuation">;</span> 31console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>nums<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,lp,js,mc,Yn,vc,cp,Js,yc,qn,Ec,up,W,_c,Wn,wc,hc,rp,b,Gn,bc,Oc,Vn,jc,Jc,$n,Pc,Cc,zn,xc,ip,xa,Dc,kp,Da,Tc,fp,Ps,Im=`<code class="language-js"><span class="token keyword">const</span> nums <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">,</span> <span class="token number">9</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 32<span class="token keyword">const</span> sum <span class="token operator">=</span> nums<span class="token punctuation">.</span><span class="token function">reduce</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">total<span class="token punctuation">,</span> val<span class="token punctuation">,</span> idx<span class="token punctuation">,</span> arr</span><span class="token punctuation">)</span> <span class="token operator">=></span> total <span class="token operator">+</span> val<span class="token punctuation">,</span> <span class="token number">100</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 33console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>sum<span class="token punctuation">)</span><span class="token punctuation">;</span> 34console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>nums<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,dp,Cs,Mc,Xn,Kc,mp,K,Ic,Qn,Lc,Rc,Zn,Hc,Sc,vp,Ta,Nc,yp,Ma,Fc,Ep,Ka,Ac,_p,xs,Lm=`<code class="language-js"><span class="token keyword">const</span> nums <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">,</span> <span class="token number">9</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 35<span class="token keyword">const</span> everyOver5 <span class="token operator">=</span> nums<span class="token punctuation">.</span><span class="token function">every</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">num</span><span class="token punctuation">)</span> <span class="token operator">=></span> num <span class="token operator">></span> <span class="token number">5</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 36<span class="token keyword">const</span> someOver5 <span class="token operator">=</span> nums<span class="token punctuation">.</span><span class="token function">
36some</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">num</span><span class="token punctuation">)</span> <span class="token operator">=></span> num <span class="token operator">></span> <span class="token number">5</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 37console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>everyOver5<span class="token punctuation">)</span><span class="token punctuation">;</span> 38console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>someOver5<span class="token punctuation">)</span><span class="token punctuation">;</span> 39console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>nums<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,wp,Ia,Bc,hp,Ds,Uc,gn,Yc,bp,Ts,qc,st,Wc,Op,Ms,Gc,at,Vc,jp,La,$c,Jp,Ra,zc,Pp,Ha,Xc,Cp,Ks,Rm=`<code class="language-js"><span class="token keyword">const</span> nums <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">,</span> <span class="token number">9</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 40<span class="token keyword">const</span> position <span class="token operator">=</span> nums<span class="token punctuation">.</span><span class="token function">indexOf</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 41console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>position<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,xp,Is,Qc,nt,Zc,Dp,Ls,tt,gc,su,Tp,G,et,au,nu,pt,tu,Mp,F,ot,eu,pu,lt,ou,lu,Kp,Rs,ct,cu,uu,Ip,Hs,ut,ru,iu,Lp,Sa,ku,Rp,Na,fu,Hp,I,du,rt,mu,vu,it,yu,Eu,Sp,L,R,kt,_u,wu,ft,hu,bu,dt,Ou,ju,Ju,A,mt,Pu,Cu,vt,xu,Du,yt,Tu,Mu,V,Et,Ku,Iu,Ss,Lu,Ru,Np,B,_t,Hu,Su,wt,Nu,Fu,Fp,Fa,Au,Ap,Ns,Hm=`<code class="language-js"><span class="token keyword">const</span> fruits <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'apple'</span><span class="token punctuation">,</span> <span class="token string">'banana'</span><span class="token punctuation">,</span> <span class="token string">'orange'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 42 43console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>fruits<span class="token punctuation">.</span><span class="token function">includes</span><span class="token punctuation">(</span><span class="token string">'banana'</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// true</span> 44console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>fruits<span class="token punctuation">.</span><span class="token function">includes</span><span class="token punctuation">(</span><span class="token string">'grape'</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// false</span> 45 46console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>fruits<span class="token punctuation">.</span><span class="token function">
46indexOf</span><span class="token punctuation">(</span><span class="token string">'banana'</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 1</span> 47console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>fruits<span class="token punctuation">.</span><span class="token function">indexOf</span><span class="token punctuation">(</span><span class="token string">'grape'</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// -1</span></code>`,Bp,Aa,Bu,Up,Ba,Uu,Yp,Ua,Yu,qp,Fs,Sm=`<code class="language-js"><span class="token keyword">const</span> nums <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">,</span> <span class="token number">9</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 48<span class="token keyword">const</span> firstNumGreater5 <span class="token operator">=</span> nums<span class="token punctuation">.</span><span class="token function">find</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">num</span><span class="token punctuation">)</span> <span class="token operator">=></span> num <span class="token operator">></span> <span class="token number">5</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 49<span class="token keyword">const</span> firstNumGreater5Index <span class="token operator">=</span> nums<span class="token punctuation">.</span><span class="token function">findIndex</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">num</span><span class="token punctuation">)</span> <span class="token operator">=></span> num <span class="token operator">></span> <span class="token number">5</span><span class="token punctuation">)</span><span class="token punctuation">;</span> 50console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>firstNumGreater5<span class="token punctuation">)</span><span class="token punctuation">;</span> 51console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>firstNumGreater5Index<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Wp,U,qu,ht,Wu,Gu,bt,Vu,Gp,Y,Ot,$u,zu,jt,Xu,Qu,Vp,H,Zu,Jt,gu,sr,Pt,ar,nr,$p,Ya,tr,zp,qa,er,Xp,As,Nm=`<code class="language-js">Array<span class="token punctuation">.</span><span class="token function">from</span><span class="token punctuation">(</span><span class="token string">'ABCDEFG'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Qp,Bs,pr,Ct,or,Zp,Wa,lr,gp,Ga,cr,so,Va,ur,ao,$a,rr,no,Us,Fm=`<code class="language-js"><span class="token keyword">const</span> names <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jack'</span><span class="token punctuation">,</span> <span class="token string">'Jace'</span><span class="token punctuation">,</span> <span class="token string">'Jane'</span><span class="token punctuation">,</span> <span class="token string">'Josh'</span><span class="token punctuation">,</span> <span class="token string">'Kai'</span><span class="token punctuation">,</span> <span class="token string">'Kevin'</span><span class="token punctuation">,</span> <span class="token string">'Ken'</span><span class="token punctuation">,</span> <span class="token string">'Kyle'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 52<span class="token keyword">
52for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> idx <span class="token keyword">of</span> names<span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 53 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>idx<span class="token punctuation">)</span><span class="token punctuation">;</span> 54<span class="token punctuation">}</span> 55<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> name <span class="token keyword">of</span> names<span class="token punctuation">.</span><span class="token function">values</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 56 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>name<span class="token punctuation">)</span><span class="token punctuation">;</span> 57<span class="token punctuation">}</span> 58<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> entry <span class="token keyword">of</span> names<span class="token punctuation">.</span><span class="token function">entries</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 59 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>entry<span class="token punctuation">)</span><span class="token punctuation">;</span> 60<span class="token punctuation">}</span></code>`,to,m,ir,xt,kr,fr,Dt,dr,mr,Tt,vr,yr,Mt,Er,_r,Kt,wr,hr,It,br,Or,eo,O,jr,Lt,Jr,Pr,Rt,Cr,xr,Ht,Dr,Tr,po,Ys,Am=`<code class="language-js"><span class="token keyword">const</span> car <span class="token operator">=</span> <span class="token punctuation">{</span> 61 <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'BMW'</span><span class="token punctuation">,</span> 62 <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2010</span><span class="token punctuation">,</span> 63 <span class="token literal-property property">color</span><span class="token operator">:</span> <span class="token string">'black'</span><span class="token punctuation">,</span> 64 <span class="token literal-property property">location</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">country</span><span class="token operator">:</span> <span class="token string">'USA'</span><span class="token punctuation">,</span> <span class="token literal-property property">state</span><span class="token operator">:</span> <span class="token string">'CA'</span> <span class="token punctuation">}</span> 65<span class="token punctuation">}</span><span class="token punctuation">;</span> 66<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> k <span class="token keyword">of</span> car<span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 67 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>k<span class="token punctuation">)</span><span class="token punctuation">;</span> 68<span class="token punctuation">}</span> 69<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> v <span class="token keyword">of</span> car<span class="token punctuation">.</span><span class="token function">values</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 70 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>v<span class="token punctuation">)</span><span class="token punctuation">;</span> 71<span class="token punctuation">}</span> 72<span class="token keyword">
72for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> e <span class="token keyword">of</span> car<span class="token punctuation">.</span><span class="token function">entries</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 73 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>e<span class="token punctuation">)</span><span class="token punctuation">;</span> 74<span class="token punctuation">}</span></code>`,oo,S,St,Mr,Kr,Nt,Ir,Lr,Ft,Rr,lo,qs,Bm=`<code class="language-js"><span class="token keyword">const</span> car <span class="token operator">=</span> <span class="token punctuation">{</span> 75 <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'BMW'</span><span class="token punctuation">,</span> 76 <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2010</span><span class="token punctuation">,</span> 77 <span class="token literal-property property">color</span><span class="token operator">:</span> <span class="token string">'black'</span><span class="token punctuation">,</span> 78 <span class="token literal-property property">location</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">country</span><span class="token operator">:</span> <span class="token string">'USA'</span><span class="token punctuation">,</span> <span class="token literal-property property">state</span><span class="token operator">:</span> <span class="token string">'CA'</span> <span class="token punctuation">}</span> 79<span class="token punctuation">}</span><span class="token punctuation">;</span> 80<span class="token comment">// Using Object.keys()</span> 81<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> k <span class="token keyword">of</span> Object<span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span>car<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 82 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>k<span class="token punctuation">)</span><span class="token punctuation">;</span> 83<span class="token punctuation">}</span> 84 85<span class="token comment">// Using Object.values()</span> 86<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> v <span class="token keyword">of</span> Object<span class="token punctuation">.</span><span class="token function">values</span><span class="token punctuation">(</span>car<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 87 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>v<span class="token punctuation">)</span><span class="token punctuation">;</span> 88<span class="token punctuation">}</span> 89 90<span class="token comment">// Using Object.entries()</span> 91<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> e <span class="token keyword">of</span> Object<span class="token punctuation">.</span><span class="token function">entries</span><span class="token punctuation">(</span>car<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 92 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>e<span class="token punctuation">)</span><span class="token punctuation">;</span> 93<span class="token punctuation">}</span></code>`,co,C,Hr,At,Sr,Nr,Bt,Fr,Ar,Ut,Br,uo,j,Ur,Yt,Yr,qr,qt,Wr,Gr,Wt,Vr,$r,ro,Ws,Um='<code class="language-js">console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>Object<span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span>car<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code>',io,za,zr,ko,Gs,Ym=`<code class="language-js"><span class="token keyword">const</span> cars <span class="token operator">=</span> <span class="token punctuation">[</span> 94 <span class="token punctuation">{</span> <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'Volvo'</span><span class="token punctuation">,</span> <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2016</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> 95 <span class="token punctuation">{</span> <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'Saab'</span><span class="token punctuation">,</span> <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2001</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> 96 <span class="token punctuation">{</span> <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'BMW'</span><span class="token punctuation">,</span> <span class="token literal-property property">year</span><span class="token operator">:</span> <span class="token number">2010</span> <span class="token punctuation">}</span> 97<span class="token punctuation">]</span><span class="token punctuation">;</span> 98<span class="token keyword">
98for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> k <span class="token keyword">of</span> cars<span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 99 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>k<span class="token punctuation">)</span><span class="token punctuation">;</span> 100<span class="token punctuation">}</span> 101<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> v <span class="token keyword">of</span> cars<span class="token punctuation">.</span><span class="token function">values</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 102 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>v<span class="token punctuation">)</span><span class="token punctuation">;</span> 103<span class="token punctuation">}</span> 104<span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> e <span class="token keyword">of</span> cars<span class="token punctuation">.</span><span class="token function">entries</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 105 console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>e<span class="token punctuation">)</span><span class="token punctuation">;</span> 106<span class="token punctuation">}</span></code>`,fo,Xa,Xr,mo,Qa,Qr,vo,$,Zr,Gt,gr,si,yo,Vs,qm=`<code class="language-js"><span class="token keyword">const</span> nums <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">,</span> <span class="token number">9</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 107Math<span class="token punctuation">.</span><span class="token function">max</span><span class="token punctuation">(</span><span class="token operator">...</span>nums<span class="token punctuation">)</span><span class="token punctuation">;</span></code>`,Eo,J,ai,Vt,ni,ti,$t,ei,pi,zt,oi,li,_o,$s,Wm=`<code class="language-js"><span class="token keyword">const</span> q1 <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jan'</span><span class="token punctuation">,</span> <span class="token string">'Feb'</span><span class="token punctuation">,</span> <span class="token string">'Mar'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 108<span class="token keyword">const</span> q2 <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Apr'</span><span class="token punctuation">,</span> <span class="token string">'May'</span><span class="token punctuation">,</span> <span class="token string">'Jun'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 109<span class="token keyword">const</span> q3 <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Jul'</span><span class="token punctuation">,</span> <span class="token string">'Aug'</span><span class="token punctuation">,</span> <span class="token string">'Sep'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 110<span class="token keyword">const</span> q4 <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token string">'Oct'</span><span class="token punctuation">,</span> <span class="token string">'Nov'</span><span class="token punctuation">,</span> <span class="token string">'May'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> 111 112<span class="token keyword">const</span> year <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token operator">...</span>q1<span class="token punctuation">,</span> <span class="token operator">...</span>q2<span class="token punctuation">,</span> <span class="token operator">...</span>q3<span class="token punctuation">,</span> <span class="token operator">...</span>q4<span class="token punctuation">]</span><span class="token punctuation">;</span></code>`,wo,zs,ci,Xt,ui,ho,Za,ri,bo,Xs,Gm='<code class="language-js"><span class="token keyword">const</span> year <span class="token operator">=</span> <span class="token punctuation">[</span>q1<span class="token punctuation">,</span> q2<span class="token punctuation">,</span> q3<span class="token punctuation">,</span> q4<span class="token punctuation">]</span><span class="token punctuation">;</span></code>',Oo,Qs,ii,Qt,ki,jo,z,fi,Zt,di,mi,Jo,Zs,Vm=`<code class="language-js"><span class="token keyword">function</span> <span class="token function">addTodo</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 113 todos<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span>name<span class="token punctuation">)</span><span class="token punctuation">;</span> 114<span class="token punctuation">}</span></code>`,Po,X,vi,gt,yi,Ei,Co,Q,_i,se,wi,hi,xo,gs,$m=`<code class="language-js"><span class="token keyword">function</span> <span class="token function">addTodo</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 115 todos<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span>name<span class="token punctuation">)</span><span class="token punctuation">;</span> 116 todos <span class="token operator">=</span> todos<span class="token punctuation">;</span> 117<span class="token punctuation">}</span></code>`,Do,ga,bi,To,sa,zm=`<code class="language-js"><span class="token keyword">function</span> <span class="token function">addTodo</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 118 todos<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span>name<span class="token punctuation">)</span><span class="token punctuation">;</span> 119 <span class="token comment">// update todos for reactivity</span> 120 todos <span class="token operator">=</span> todos<span class="token punctuation">;</span> 121<span class="token punctuation">}</span></code>`,Mo,sn,Oi,Ko,aa,Xm=`<code class="language-js"><span class="token keyword">function</span> <span class="token function">addTodo</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 122 todos <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token operator">...</span>todos<span class="token punctuation">,</span> name<span class="token punctuation">]</span><span class="token punctuation">;</span> 123<span class="token punctuation">}</span></code>`,Io,Z,ji,ae,Ji,Pi,Lo,na,Qm=`<code class="language-js"><span class="token keyword">function</span> <span class="token function">addTodo</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> 124 todos <span class="token operator">=</span> <span class="token punctuation">[</span>name<span class="token punctuation">,</span> <span class="token operator">...</span>todos<span class="token punctuation">]</span><span class="token punctuation">;</span> 125<span class="token punctuation">}</span></code>`,Ro,an,Ci,Ho,nn,xi,So,ta,Zm=`<code class="language-svelte"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span><span class="token punctuation">></span></span>Volume<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> 126<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>select</span><span class="token punctuation">></span></span> 127 <span class="token each"><span class="token punctuation">{</span><span class="token keyword">#each</span> <span class="token language-javascript"><span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">,</span> <span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">,</span> <span class="token number">6</span><span class="token punctuation">,</span> <span class="token number">7</span><span class="token punctuation">,</span> <span class="token number">8</span><span class="token punctuation">,</span> <span class="token number">9</span><span class="token punctuation">,</span> <span class="token number">10</span><span class="token punctuation">]</span> </span><span class="token keyword">as</span> <span class="token language-javascript">num<span class="token punctuation">}</span></span></span> 128 <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>option</span> <span class="token attr-name">value=</span><span class="token language-javascript"><span class="token punctuation">{</span>num<span class="token punctuation">}</span></span><span class="token punctuation">></span></span><span class="token language-javascript"><span class="token punctuation">{</span>num<span class="token punctuation">}</span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>option</span><span class="token punctuation">></span></span> 129 <span class="token language-javascript"><span class="token punctuation">{</span>num<span class="token punctuation">}</span></span> 130<span class="token each"><span class="token punctuation">{</span><span class="token keyword">/each</span><span class="token punctuation">}</span></span> 131<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>select</span><span class="token punctuation">></span></span></code>`,No,tn,Di,Fo,ea,gm='<code class="language-svelte"><span class="token each"><span class="token punctuation">{</span><span class="token keyword">#each</span> <span class="token language-javascript"><span class="token punctuation">[</span><span class="token operator">...</span><span class="token function">Array</span><span class="token punctuation">(</span><span class="token number">11</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">]</span> </span><span class="token keyword">as</span> <span class="token language-javascript">num<span class="token punctuation">}</span></span></span></code>',Ao,E,Ti,ne,Mi,Ki,te,Ii,Li,ee,Ri,Hi,pe,Si,Ni,Bo,g,Fi,oe,Ai,Bi,Uo,Yo,qo,en,v,Ui,pn,Yi,qi,le,Wi,Gi,ce,Vi,$i,ue,zi,Xi,re,Qi,Zi,ie,gi,sk,Wo,Go,Vo,on,ak,$o,ln,ke,pa,nk;return{c(){f=l("figure"),y=l("picture"),h=l("source"),es=r(),d=l("img"),ra=r(),En=l("figcaption"),ol=p("Photo credit @zburival on Unsplash"),Ee=r(),ia=l("p"),ll=p("Length: Long"),_e=r(),ka=l("p"),cl=p("Level: X Beginner â Intermediate â Advanced"),we=r(),he=l("hr"),be=r(),fa=l("p"),ps=l("strong"),ul=p("If you havenât yet, read part one on "),da=l("a"),rl=p("the basic JavaScript array methods"),il=p("!"),Oe=r(),je=l("hr"),Je=r(),ma=l("h3"),kl=p("For Each"),Pe=r(),os=l("p"),_n=l("code"),fl=p("forEac
131h"),dl=p(" takes 3 arguments:"),Ce=r(),D=l("ul"),wn=l("li"),ml=p("The item value"),vl=r(),hn=l("li"),yl=p("The index in the array"),El=r(),bn=l("li"),_l=p("The array"),xe=r(),ls=l("pre"),De=r(),va=l("p"),wl=p("You can see each value, its index, and the array printed at each iteration."),Te=r(),ya=l("p"),hl=p("You can also omit trailing parameters that you donât use."),Me=r(),cs=l("pre"),Ke=r(),us=l("p"),On=l("code"),bl=p("4"),Ol=p(" names start with âJâ"),Ie=r(),rs=l("pre"),Le=r(),Ea=l("p"),jl=p("You will notice that the above doesnât mutate the array:"),Re=r(),_a=l("p"),jn=l("code"),Jl=p("['Jack', 'Jace', 'Jane', 'Josh', 'Kai', 'Kevin', 'Ken', 'Kyle']"),He=r(),is=l("p"),Jn=l("code"),Pl=p("val"),Cl=p(" is mutated but then discarded and the original array remains intact."),Se=r(),wa=l("p"),xl=p("You must use the third parameter, the array, to mutate it:"),Ne=r(),ks=l("pre"),Fe=r(),ha=l("p"),Pn=l("code"),Dl=p("['Jack is cool', 'Jace is cool', 'Jane is cool', 'Josh is cool', 'Kai is cool', 'Kevin is cool', 'Ken is cool', 'Kyle is cool']"),Ae=r(),ba=l("h3"),Tl=p("Map"),Be=r(),Oa=l("p"),Ml=p("Map creates a new array and performs a function on each item. Map does not mutate the original array."),Ue=r(),fs=l("pre"),Ye=r(),ds=l("p"),Kl=p("Names: "),Cn=l("code"),Il=p("['Jack', 'Jace', 'Jane', 'Josh', 'Kai', 'Kevin', 'Ken', 'Kyle']"),qe=r(),ms=l("p"),Ll=p("Cool Names: "),xn=l("code"),Rl=p("['Jack is cool', 'Jace is cool', 'Jane is cool', 'Josh is cool', 'Kai is cool', 'Kevin is cool', 'Ken is cool', 'Kyle is cool']"),We=r(),vs=l("p"),Dn=l("code"),Hl=p("map"),Sl=p(" also takes in 3 arguments:"),Ge=r(),T=l("ul"),Tn=l("li"),Nl=p("The item value"),Fl=r(),Mn=l("li"),Al=p("The index in the array"),Bl=r(),Kn=l("li"),Ul=p("The array"),Ve=r(),q=l("p"),Yl=p("These are the same as "),In=l("code"),ql=p("forEach"),Wl=p("âs arguments."),$e=r(),M=l("p"),Gl=p("You can also use "),Ln=l("code"),Vl=p("flatMap"),$l=p(" to first map all elements then flatten an array. This is similar to "),Rn=l("code"),zl=p(".map().flat()"),Xl=p("."),ze=r(),ja=l("h3"),Ql=p("Filter"),Xe=r(),Ja=l("p"),Zl=p("Filter creates a new array with elements that meet certain condition. Filter does not mutate the original array."),Qe=r(),ys=l("pre"),Ze=r(),Es=l("p"),gl=p("Names: "),Hn=l("code"),sc=p("['Jack', 'Jace', 'Jane', 'Josh', 'Kai', 'Kevin', 'Ken', 'Kyle']"),ge=r(),_s=l("p"),ac=p("J Names: "),Sn=l("code"),nc=p("['Jack', 'Jace', 'Jane', 'Josh']"),sp=r(),P=l("p"),Nn=l("code"),tc=p("filter"),ec=p(" has the same three arguments as "),Fn=l("co
131de"),pc=p("forEach"),oc=p(" and "),An=l("code"),lc=p("map"),cc=p(" (value, index, array)."),ap=r(),ws=l("pre"),np=r(),hs=l("p"),uc=p("Cars: "),Bn=l("code"),rc=p("[{ type: 'Volvo', year: 2016 }, { type: 'Saab', year: 2001 }, { type: 'BMW', year: 2010 }]"),tp=r(),bs=l("p"),ic=p("New Cars: "),Un=l("code"),kc=p("[{ type: 'Volvo', year: 2016 }, { type: 'BMW', year: 2010 }]"),ep=r(),Pa=l("h3"),fc=p("Reduce"),pp=r(),Ca=l("p"),dc=p("Reduce runs a function on each array element to reduce the entire array to one value. Reduce does not mutate the original array."),op=r(),Os=l("pre"),lp=r(),js=l("p"),mc=p("Sum: "),Yn=l("code"),vc=p("25"),cp=r(),Js=l("p"),yc=p("Nums: "),qn=l("code"),Ec=p("[3, 1, 4, 1, 5, 9, 2]"),up=r(),W=l("p"),_c=p("The function inside "),Wn=l("code"),wc=p("reduce"),hc=p(" takes 4 arguments:"),rp=r(),b=l("ul"),Gn=l("li"),bc=p("The total (initial value / previous return value)"),Oc=r(),Vn=l("li"),jc=p("The item value"),Jc=r(),$n=l("li"),Pc=p("The index in the array"),Cc=r(),zn=l("li"),xc=p("The array"),ip=r(),xa=l("p"),Dc=p("The last 3 are the same as the 3 used in the other array methods above."),kp=r(),Da=l("p"),Tc=p("Reduce can take a second argument (after the function to run on the array) which is an initial value:"),fp=r(),Ps=l("pre"),dp=r(),Cs=l("p"),Mc=p("Sum: "),Xn=l("code"),Kc=p("125"),mp=r(),K=l("p"),Ic=p("Reduce runs from left-to-right, but "),Qn=l("co
131de"),Lc=p("reduceRight"),Rc=p(" can be used to reduce "),Zn=l("code"),Hc=p("right-to-left"),Sc=p("."),vp=r(),Ta=l("h3"),Nc=p("Every and Some"),yp=r(),Ma=l("p"),Fc=p("Every checks if every value in an array meets a condition."),Ep=r(),Ka=l("p"),Ac=p("Some checks if some values in an array meet a condition."),_p=r(),xs=l("pre"),wp=r(),Ia=l("p"),Bc=p("These methods do not mutate the original array."),hp=r(),Ds=l("p"),Uc=p("Every over 5: "),gn=l("code"),Yc=p("false"),bp=r(),Ts=l("p"),qc=p("Some over 5: "),st=l("code"),Wc=p("true"),Op=r(),Ms=l("p"),Gc=p("Nums: "),at=l("code"),Vc=p("[3, 1, 4, 1, 5, 9, 2]"),jp=r(),La=l("h3"),$c=p("Index Of"),Jp=r(),Ra=l("p"),zc=p("Index of searches an array for an element value and returns its index."),Pp=r(),Ha=l("p"),Xc=p("JavaScript arrays are zero-indexed, meaning the first item has index 0 and second has position 1."),Cp=r(),Ks=l("pre"),xp=r(),Is=l("p"),Qc=p("Position: "),nt=l("code"),Zc=p("1"),Dp=r(),Ls=l("p"),tt=l("code"),gc=p("indexOf"),su=p(" takes in up to 2 arguments:"),Tp=r(),G=l("ul"),et=l("li"),au=p("The item to search for"),nu=r(),pt=l("li"),tu=p("The start index to search. Negative values start counting from the end"),Mp=r(),F=l("p"),ot=l("code"),eu=p("indexOf"),pu=p(" returns "),lt=l("code"),ou=p("-1"),lu=p(" if the item is not found."),Kp=r(),Rs=l("p"),ct=l("code"),cu=p("indexOf"),uu=p(" returns the first occurrence if multiple of the item is found."),Ip=r(),Hs=l("p"),ut=l("code"),ru=p("lastIndexOf"),iu=p(" returns the last occurence of the specified element."),Lp=r(),Sa=l("h3"),ku=p("Includes"),Rp=r(),Na=l("p"),fu=p("Includes allows us to check if an array includes a specific item."),Hp=r(),I=l("p"),du=p("This is very similar to running "),rt=l("code"),mu=p("indexOf"),vu=p(" and comparing against "),it=l("code"),yu=p("-1"),Eu=p(". There are a few key differences:"),Sp=r(),L=l("ul"),R=l("li"),kt=l("code"),_u=p("includes"),wu=p(" returns a boolean and "),ft=l("code"),hu=p("indexOf"),bu=p(" returns a number (the index, else "),dt=l("code"),Ou=p("-1"),ju=p(")"),Ju=r(),A=l("li"),mt=l("code"),Pu=p("includes"),Cu=p(" can check for "),vt=l("code"),xu=p("NaN"),Du=p(", unlike "),yt=l("code"),Tu=p("indexOf"),Mu=r(),V=l("li"),Et=l("code"),Ku=p("includes"),Iu=p(" is from ES2016, so some old browsers may not support it. Itâs got "),Ss=l("a"),Lu=p("great support at 97.5%"),Ru=p(" at time of writing"),Np=r(),B=l("p"),_t=l("code"),Hu=p("includes"),Su=p(" is straightforward to check if an element exists, but "),wt=l("code"),Nu=p("indexOf"),Fu=p(" is more versatile."),Fp=r(),Fa=l("p"),Au=p("Hereâs a quick comparison:"),Ap=r(),Ns=l("pre"),Bp=r(),Aa=l("h3"),Bu=p("Find"),Up=r(),Ba=l("p"),Uu=p("Find returns the value of the first element that meets a condition."),Yp=r(),Ua=l("p"),Yu=p("Find index returns the index of the first element to meet a condition."),qp=r(),Fs=l("pre"),Wp=r(),U=l("p"),qu=p("First num greater 5: "),ht=l("code"),Wu=p("9"),Gu=p(` 132First num greater 5 index: `),bt=l("code"),Vu=p("5"),Gp=r(),Y=l("p"),Ot=l("code"),$u=p("find"),zu=p(" and "),jt=l("code"),Xu=p("findIndex"),Qu=p(" take the same 3 arguments as most functions above: value, index, array."),Vp=r(),H=l("p"),Zu=p("You can also use "),Jt=l("code"),gu=p("findLast"),sr=p(" and "),Pt=l("code"),ar=p("findLastIndex"),nr=p(" to find the last element (or index) that meets a condition."),$p=r(),Ya=l("h3"),tr=p("From"),zp=r(),qa=l("p"),er=p("From returns an array from any iterable object or object with a length."),Xp=r(),As=l("pre"),Qp=r(),Bs=l("p"),pr=p("Result: "),Ct=l("code"),or=p("['A', 'B', 'C', 'D', 'E', 'F', 'G']"),Zp=r(),Wa=l("h3"),lr=p("Keys, Values, and Entries"),gp=r(),Ga=l("p"),cr=p("Keys returns an array iterator object with the keys of an array."),so=r(),Va=l("p"),ur=p("Values returns an array iterator object with the values of an array."),ao=r(),$a=l("p"),rr=p("Entries returns an array iterator object with key/value pairs."),no=r(),Us=l("pre"),to=r(),m=l("p"),ir=p("In this example, "),xt=l("code"),kr=p("keys"),fr=p(" outputs the indices ("),Dt=l("code"),dr=p("0, 1, 2..."),mr=p("), "),Tt=l("code"),vr=p("values"),yr=p(" outputs the name values ("),Mt=l("code"),Er=p("Jack, Jace, Jane..."),_r=p(") and "),Kt=l("code"),wr=p("entries"),hr=p(" outputs the key value pairs (index and name) ("),It=l("code"),br=p("[0, 'Jack'], [1, 'Jace'], [2, 'Jane']..."),Or=p(")."),eo=r(),O=l("p"),jr=p("This is more logical with an object, but I felt an array example would be nice to have as well. On an object, you could instead use "),Lt=l("
132code"),Jr=p("Object.keys()"),Pr=p(", "),Rt=l("code"),Cr=p("Object.values()"),xr=p(", and "),Ht=l("code"),Dr=p("Object.entries()"),Tr=p(". The following code would not work:"),po=r(),Ys=l("pre"),oo=r(),S=l("p"),St=l("code"),Mr=p("car.keys is not a function"),Kr=r(),Nt=l("code"),Ir=p("car.values is not a function"),Lr=r(),Ft=l("code"),Rr=p("car.entries is not a function"),lo=r(),qs=l("pre"),co=r(),C=l("p"),Hr=p("Keys: "),At=l("code"),Sr=p("['type', 'year', 'color', 'location']"),Nr=p(` 133Values: `),Bt=l("code"),Fr=p("['BMW', 2010, 'black', {â¦}]"),Ar=p(` 134Entries: `),Ut=l("code"),Br=p("['type', 'BMW'], ['year', 2010], ['color', 'black'], ['location', {â¦}]"),uo=r(),j=l("p"),Ur=p("You can also directly use the array returned by "),Yt=l("code"),Yr=p("Object.keys(car)"),qr=p(" (or "),qt=l("code"),Wr=p("values"),Gr=p(" or "),Wt=l("code"),Vr=p("entries"),$r=p(") without iterating over with a for loop:"),ro=r(),Ws=l("pre"),io=r(),za=l("p"),zr=p("Note that an array of objects would behave just like our array of strings above. Hereâs a code example:"),ko=r(),Gs=l("pre"),fo=r(),Xa=l("p"),Xr=p("Iâve gone a little off-topic out of arrays and into objects, but itâs important not to confuse the array methods with the object methods."),mo=r(),Qa=l("h3"),Qr=p("Spread Operator"),vo=r(),$=l("p"),Zr=p("Use three dots ("),Gt=l("code"),gr=p("..."),si=p(") to âspreadâ an array out. This can be useful if you have an array and you want to pass each individual item into a function, for example:"),yo=r(),Vs=l("pre"),Eo=r(),J=l("p"),ai=p("In the above example, we want to pass in every single item of the array into "),Vt=l("code"),ni=p("Math.max"),ti=p(". "),$t=l("code"),ei=p("Math.max"),pi=p(" canât take in an array object, and instead takes in individual values. We want to do: "),zt=l("code"),oi=p("Math.max(3, 1, 4, 1, 5, 9, 2)"),li=p(". Rather than rewrite the entire array, especially if we donât know what the items are or how many there are, this makes it way easier."),_o=r(),$s=l("pre"),wo=r(),zs=l("p"),ci=p("Year: "),Xt=l("code"),ui=p("['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'May']"),ho=r(),Za=l("p"),ri=p("In the above example, we have four arrays, and we want one array that combines all of them. Instead of writing them all out, we can just spread them together. If we didnât use the spread operator, weâd have a 2 dimensional array:"),bo=r(),Xs=l("pre"),Oo=r(),Qs=l("p"),ii=p("Year: "),Qt=l("code"),ki=p("['Jan', 'Feb', 'Mar'], ['Apr', 'May', 'Jun'], ['Jul', 'Aug', 'Sep'], ['Oct', 'Nov', 'May']"),jo=r(),z=l("p"),fi=p("Spreading can also be c
134ommonly used instead of using "),Zt=l("code"),di=p("push"),mi=p(" then reassigning a variable in a reactive JavaScript framework. For example:"),Jo=r(),Zs=l("pre"),Po=r(),X=l("p"),vi=p("Some frameworks might not âknowâ that "),gt=l("code"),yi=p("name"),Ei=p(" was updated here, since even though a method was called on it, it was reassigned."),Co=r(),Q=l("p"),_i=p("This would mean that the "),se=l("code"),wi=p("todos"),hi=p(" used in the UI wouldnât update, and the user wouldnât see their todo."),xo=r(),gs=l("pre"),Do=r(),ga=l("p"),bi=p("This would result in the user writing redundant and confusing code like above."),To=r(),sa=l("pre"),Mo=r(),sn=l("p"),Oi=p("Maybe a comment would help, but instead we can simply use the spread operator to add the item and reassign in one swoop:"),Ko=r(),aa=l("pre"),Io=r(),Z=l("p"),ji=p("Or we can add it in the front instead of "),ae=l("code"),Ji=p("shift"),Pi=p(":"),Lo=r(),na=l("pre"),Ro=r(),an=l("p"),Ci=p("You might also find yourself wanting to loop a specific number of times (not through an array or object) in an each loop."),Ho=r(),nn=l("p"),xi=p("Hereâs an example in svelte:"),So=r(),ta=l("pre"),No=r(),tn=l("p"),Di=p("Instead of manually writing out all 10 items (or letâs say we have 100 items), we could use the spread operator:"),Fo=r(),ea=l("pre"),Ao=r(),E=l("p"),Ti=p("If we tried to just use "),ne=l("code"),Mi=p("Array(11).keys()"),Ki=p(", it wouldnât work beause "),te=l("code"),Ii=p("keys"),Li=p(" returns an iterator, not an array. The spread operator ("),ee=l("code"),Ri=p("..."),Hi=p(") iterates and spreads out the array, and the square brackets ("),pe=l("code"),Si=p("[]"),Ni=p(") contain the spread out array (otherwise itâs just âfloating in spaceâ and not inside an array)."),Bo=r(),g=l("p"),Fi=p("Last example: lets say we have default themes and user themes, in two arrays, and we want to iterate through both. Instead of making two for loops, we could just iterate on "),oe=l("code"),Ai=p("[...defaultThemes, ...userThemes]"),Bi=p(". Easy."),Uo=r(),Yo=l("hr"),qo=r(),en=l("p"),v=l("strong"),Ui=p("Check out "),pn=l("a"),Yi=p("Part 3"),qi=p(" where we cover new array methods such as "),le=l("code"),Wi=p("groupBy"),Gi=p(", "),ce=l("code"),Vi=p("with"),$i=p(", "),ue=l("code"),zi=p("at"),Xi=p(", "),re=l("code"),Qi=p("fill"),Zi=p(", "),ie=l("code"),gi=p("toSorted"),sk=p(" and more!"),Wo=r(),Go=l("hr"),Vo=r(),on=l("h3"),ak=p("Further Reading"),$o=r(),ln=l("ul"),ke=l("li"),pa=l("a"),nk=p("W3 schools"),this.h()},l(s){f=c(s,"FIGURE",{});var t=u(f);y=c(t,"PICTURE",{});var zo=u(y);h=c(zo,"SOURCE",{type:!0,srcset:!0,alt:!0}),es=i(zo),d=c(zo,"IMG",{src:!0,alt:!0}),zo.forEach(a),ra=i(t),En=c(t,"FIGCAPTION",{});var Ck=u(En);ol=o(Ck,"Photo credit @zburival on Unsplash"),Ck.forEach(a),t.forEach(a),Ee=i(s),ia=c(s,"P",{});var xk=u(ia);ll=o(xk,"Length: Long"),xk.forEach(a),_e=i(s),ka=c(s,"P",{});var Dk=u(ka);cl=o(Dk,"Level: X Beginner â Intermediate â Advanced"),Dk.forEach(a),we=i(s),he=c(s,"HR",{}),be=i(s),fa=c(s,"P",{});var Tk=u(fa);ps=c(Tk,"STRONG",{});var Xo=u(ps);ul=o(Xo,"If you havenât yet, read part one on "),da=c(Xo,"A",{href:!0});var Mk=u(da);rl=o(Mk,"the basic JavaScript array methods"),Mk.forEach(a),il=o(Xo,"!"),Xo.forEach(a),Tk.forEach(a),Oe=i(s),je=c(s,"HR",{}),Je=i(s),ma=c(s,"H3",{});var Kk=u(ma);kl=o(Kk,"For Each"),Kk.forEach(a),Pe=i(s),os=c(s,"P",{});var tk=u(os);_n=c(tk,"CODE",{});var Ik=u(_n);fl=o(Ik,"forEach"),Ik.forEach(a),dl=o(tk," takes 3 arguments:"),tk.forEac
134h(a),Ce=i(s),D=c(s,"UL",{});var cn=u(D);wn=c(cn,"LI",{});var Lk=u(wn);ml=o(Lk,"The item value"),Lk.forEach(a),vl=i(cn),hn=c(cn,"LI",{});var Rk=u(hn);yl=o(Rk,"The index in the array"),Rk.forEach(a),El=i(cn),bn=c(cn,"LI",{});var Hk=u(bn);_l=o(Hk,"The array"),Hk.forEach(a),cn.forEach(a),xe=i(s),ls=c(s,"PRE",{class:!0});var sv=u(ls);sv.forEach(a),De=i(s),va=c(s,"P",{});var Sk=u(va);wl=o(Sk,"You can see each value, its index, and the array printed at each iteration."),Sk.forEach(a),Te=i(s),ya=c(s,"P",{});var Nk=u(ya);hl=o(Nk,"You can also omit trailing parameters that you donât use."),Nk.forEach(a),Me=i(s),cs=c(s,"PRE",{class:!0});var av=u(cs);av.forEach(a),Ke=i(s),us=c(s,"P",{});var ek=u(us);On=c(ek,"CODE",{});var Fk=u(On);bl=o(Fk,"4"),Fk.forEach(a),Ol=o(ek," names start with âJâ"),ek.forEach(a),Ie=i(s),rs=c(s,"PRE",{class:!0});var nv=u(rs);nv.forEach(a),Le=i(s),Ea=c(s,"P",{});var Ak=u(Ea);jl=o(Ak,"You will notice that the above doesnât mutate the array:"),Ak.forEach(a),Re=i(s),_a=c(s,"P",{});var Bk=u(_a);jn=c(Bk,"CODE",{});var Uk=u(jn);Jl=o(Uk,"['Jack', 'Jace', 'Jane', 'Josh', 'Kai', 'Kevin', 'Ken', 'Kyle']"),Uk.forEach(a),Bk.forEach(a),He=i(s),is=c(s,"P",{});var pk=u(is);Jn=c(pk,"CODE",{});var Yk=u(Jn);Pl=o(Yk,"val"),Yk.forEach(a),Cl=o(pk," is mutated but then discarded and the original array remains intact."),pk.forEach(a),Se=i(s),wa=c(s,"P",{});var qk=u(wa);xl=o(qk,"You must use the third parameter, the array, to mutate it:"),qk.forEach(a),Ne=i(s),ks=c(s,"PRE",{class:!0});var tv=u(ks);tv.forEach(a),Fe=i(s),ha=c(s,"P",{});var Wk=u(ha);Pn=c(Wk,"CODE",{});var Gk=u(Pn);Dl=o(Gk,"['Jack is cool', 'Jace is cool', 'Jane is cool', 'Josh is cool', 'Kai is cool', 'Kevin is cool', 'Ken is cool', 'Kyle is cool']"),Gk.forEac
134h(a),Wk.forEach(a),Ae=i(s),ba=c(s,"H3",{});var Vk=u(ba);Tl=o(Vk,"Map"),Vk.forEach(a),Be=i(s),Oa=c(s,"P",{});var $k=u(Oa);Ml=o($k,"Map creates a new array and performs a function on each item. Map does not mutate the original array."),$k.forEach(a),Ue=i(s),fs=c(s,"PRE",{class:!0});var ev=u(fs);ev.forEach(a),Ye=i(s),ds=c(s,"P",{});var ok=u(ds);Kl=o(ok,"Names: "),Cn=c(ok,"CODE",{});var zk=u(Cn);Il=o(zk,"['Jack', 'Jace', 'Jane', 'Josh', 'Kai', 'Kevin', 'Ken', 'Kyle']"),zk.forEach(a),ok.forEach(a),qe=i(s),ms=c(s,"P",{});var lk=u(ms);Ll=o(lk,"Cool Names: "),xn=c(lk,"CODE",{});var Xk=u(xn);Rl=o(Xk,"['Jack is cool', 'Jace is cool', 'Jane is cool', 'Josh is cool', 'Kai is cool', 'Kevin is cool', 'Ken is cool', 'Kyle is cool']"),Xk.forEach(a),lk.forEach(a),We=i(s),vs=c(s,"P",{});var ck=u(vs);Dn=c(ck,"CODE",{});var Qk=u(Dn);Hl=o(Qk,"map"),Qk.forEach(a),Sl=o(ck," also takes in 3 arguments:"),ck.forEach(a),Ge=i(s),T=c(s,"UL",{});var un=u(T);Tn=c(un,"LI",{});var Zk=u(Tn);Nl=o(Zk,"The item value"),Zk.forEach(a),Fl=i(un),Mn=c(un,"LI",{});var gk=u(Mn);Al=o(gk,"The index in the array"),gk.forEach(a),Bl=i(un),Kn=c(un,"LI",{});var sf=u(Kn);Ul=o(sf,"The array"),sf.forEach(a),un.forEach(a),Ve=i(s),q=c(s,"P",{});var Qo=u(q);Yl=o(Qo,"These are the same as "),In=c(Qo,"CODE",{});var af=u(In);ql=o(af,"forEach"),af.forEach(a),Wl=o(Qo,"âs arguments."),Qo.forEach(a),$e=i(s),M=c(s,"P",{});var rn=u(M);Gl=o(rn,"You can also use "),Ln=c(rn,"CODE",{});var nf=u(Ln);Vl=o(nf,"flatMap"),nf.forEach(a),$l=o(rn," to first map all elements then flatten an array. This is similar to "),Rn=c(rn,"CODE",{});var tf=u(Rn);zl=o(tf,".map().flat()"),tf.forEach(a),Xl=o(rn,"."),rn.forEach(a),ze=i(s),ja=c(s,"H3",{});var ef=u(ja);Ql=o(ef,"Filter"),ef.forEach(a),Xe=i(s),Ja=c(s,"P",{});var pf=u(Ja);Zl=o(pf,"Filter creates a new array with elements that meet certain condition. Filter does not mutate the original array."),pf.forEach(a),Qe=i(s),ys=c(s,"PRE",{class:!0});var pv=u(ys);pv.forEach(a),Ze=i(s),Es=c(s,"P",{});var uk=u(Es);gl=o(uk,"Names: "),Hn=c(uk,"CODE",{});var of=u(Hn);sc=o(of,"['Jack', 'Jace', 'Jane', 'Josh', 'Kai', 'Kevin', 'Ken', 'Kyle']"),of.forEach(a),uk.forEach(a),ge=i(s),_s=c(s,"P",{});var rk=u(_s);ac=o(rk,"J Names: "),Sn=c(rk,"CODE",{});var lf=u(Sn);nc=o(lf,"['Jack', 'Jace', 'Jane', 'Josh']"),lf.forEach(a),rk.forEach(a),sp=i(s),P=c(s,"P",{});var oa=u(P);Nn=c(oa,"CODE",{});var cf=u(Nn);tc=o(cf,"filter"),cf.forEach(a),ec=o(oa," has the same three arguments as "),Fn=c(oa,"CODE",{});var uf=u(Fn);pc=o(uf,"forEach"),uf.forEach(a),oc=o(oa," and "),An=c(oa,"CODE",{});var rf=u(An);lc=o(rf,"map"),rf.forEach(a),cc=o(oa," (value, index, array)."),oa.forEach(a),ap=i(s),ws=c(s,"PRE",{class:!0});var ov=u(ws);ov.forEach(a),np=i(s),hs=c(s,"P",{});var ik=u(hs);uc=o(ik,"Cars: "),Bn=c(ik,"CODE",{});var kf=u(Bn);rc=o(kf,"[{ type: 'Volvo', year: 2016 }, { type: 'Saab', year: 2001 }, { type: 'BMW', year: 2010 }]"),kf.forEach(a),ik.forEach(a),tp=i(s),bs=c(s,"P",{});var kk=u(bs);ic=o(kk,"New Cars: "),Un=c(kk,"CODE",{});var ff=u(Un);kc=o(ff,"[{ type: 'Volvo', year: 2016 }, { type: 'BMW', year: 2010 }]"),ff.forEach(a),kk.forEach(a),ep=i(s),Pa=c(s,"H3",{});var df=u(Pa);fc=o(df,"Reduce"),df.forEach(a),pp=i(s),Ca=c(s,"P",{});var mf=u(Ca);dc=o(mf,"Reduce runs a function on each array element to reduce the entire array to one value. Reduce does not mutate the original array."),mf.forEach(a),op=i(s),Os=c(s,"PRE",{class:!0});var lv=u(Os);lv.forEach(a),lp=i(s),js=c(s,"P",{});var fk=u(js);mc=o(fk,"Sum: "),Yn=c(fk,"CODE",{});var vf=u(Yn);vc=o(vf,"25"),vf.forEach(a),fk.forEach(a),cp=i(s),Js=c(s,"P",{});var dk=u(Js);yc=o(dk,"Nums: "),qn=c(dk,"CODE",{});var yf=u(qn);Ec=o(yf,"[3, 1, 4, 1, 5, 9, 2]"),yf.forEach(a),dk.forEach(a),up=i(s),W=c(s,"P",{});var Zo=u(W);_c=o(Zo,"The function inside "),Wn=c(Zo,"CODE",{});var Ef=u(Wn);wc=o(Ef,"reduce"),Ef.forEach(a),hc=o(Zo," takes 4 arguments:"),Zo.forEach(a),rp=i(s),b=c(s,"UL",{});var ss=u(b);Gn=c(ss,"LI",{});var _f=u(Gn);bc=o(_f,"The total (initial value / previous return value)"),_f.forEach(a),Oc=i(ss),Vn=c(ss,"LI",{});var wf=u(Vn);jc=o(wf,"The item value"),wf.forEach(a),Jc=i(ss),$n=c(ss,"LI",{});var hf=u($n);Pc=o(hf,"The index in the array"),hf.forEach(a),Cc=i(ss),zn=c(ss,"LI",{});var bf=u(zn);xc=o(bf,"The array"),bf.forEach(a),ss.forEach(a),ip=i(s),xa=c(s,"P",{});var Of=u(xa);Dc=o(Of,"The last 3 are the same as the 3 used in the other array methods above."),Of.forEach(a),kp=i(s),Da=c(s,"P",{});var jf=u(Da);Tc=o(jf,"Reduce can take a second argument (after the function to run on the array) which is an initial value:"),jf.forEach(a),fp=i(s),Ps=c(s,"PRE",{class:!0});var cv=u(Ps);cv.forEach(a),dp=i(s),Cs=c(s,"P",{});var mk=u(Cs);Mc=o(mk,"Sum: "),Xn=c(mk,"CODE",{});var Jf=u(Xn);
134Kc=o(Jf,"125"),Jf.forEach(a),mk.forEach(a),mp=i(s),K=c(s,"P",{});var kn=u(K);Ic=o(kn,"Reduce runs from left-to-right, but "),Qn=c(kn,"CODE",{});var Pf=u(Qn);Lc=o(Pf,"reduceRight"),Pf.forEach(a),Rc=o(kn," can be used to reduce "),Zn=c(kn,"CODE",{});var Cf=u(Zn);Hc=o(Cf,"right-to-left"),Cf.forEach(a),Sc=o(kn,"."),kn.forEach(a),vp=i(s),Ta=c(s,"H3",{});var xf=u(Ta);Nc=o(xf,"Every and Some"),xf.forEach(a),yp=i(s),Ma=c(s,"P",{});var Df=u(Ma);Fc=o(Df,"Every checks if every value in an array meets a condition."),Df.forEach(a),Ep=i(s),Ka=c(s,"P",{});var Tf=u(Ka);Ac=o(Tf,"Some checks if some values in an array meet a condition."),Tf.forEach(a),_p=i(s),xs=c(s,"PRE",{class:!0});var uv=u(xs);uv.forEach(a),wp=i(s),Ia=c(s,"P",{});var Mf=u(Ia);Bc=o(Mf,"These methods do not mutate the original array."),Mf.forEach(a),hp=i(s),Ds=c(s,"P",{});var vk=u(Ds);Uc=o(vk,"Every over 5: "),gn=c(vk,"CODE",{});var Kf=u(gn);Yc=o(Kf,"false"),Kf.forEach(a),vk.forEach(a),bp=i(s),Ts=c(s,"P",{});var yk=u(Ts);qc=o(yk,"Some over 5: "),st=c(yk,"CODE",{});var If=u(st);Wc=o(If,"true"),If.forEach(a),yk.forEach(a),Op=i(s),Ms=c(s,"P",{});var Ek=u(Ms);Gc=o(Ek,"Nums: "),at=c(Ek,"CODE",{});var Lf=u(at);Vc=o(Lf,"[3, 1, 4, 1, 5, 9, 2]"),Lf.forEach(a),Ek.forEach(a),jp=i(s),La=c(s,"H3",{});var Rf=u(La);$c=o(Rf,"Index Of"),Rf.forEach(a),Jp=i(s),Ra=c(s,"P",{});var Hf=u(Ra);zc=o(Hf,"Index of searches an array for an element value and returns its index."),Hf.forEach(a),Pp=i(s),Ha=c(s,"P",{});var Sf=u(Ha);Xc=o(Sf,"JavaScript arrays are zero-indexed, meaning the first item has index 0 and second has position 1."),Sf.forEach(a),Cp=i(s),Ks=c(s,"PRE",{class:!0});var rv=u(Ks);rv.forEach(a),xp=i(s),Is=c(s,"P",{});var _k=u(Is);Qc=o(_k,"Position: "),nt=c(_k,"CODE",{});var Nf=u(nt);Zc=o(Nf,"1"),Nf.forEach(a),_k.forEach(a),Dp=i(s),Ls=c(s,"P",{});var wk=u(Ls);tt=c(wk,"CODE",{});var Ff=u(tt);gc=o(Ff,"indexOf"),Ff.forEach(a),su=o(wk," takes in up to 2 arguments:"),wk.forEach(a),Tp=i(s),G=c(s,"UL",{});var go=u(G);et=c(go,"LI",{});var Af=u(et);au=o(Af,"The item to search for"),Af.forEach(a),nu=i(go),pt=c(go,"LI",{});var Bf=u(pt);tu=o(Bf,"The start index to search. Negative values start counting from the end"),Bf.forEach(a),go.forEach(a),Mp=i(s),F=c(s,"P",{});var fe=u(F);ot=c(fe,"CODE",{});var Uf=u(ot);eu=o(Uf,"indexOf"),Uf.forEach(a),pu=o(fe," returns "),lt=c(fe,"CODE",{});var Yf=u(lt);ou=o(Yf,"-1"),Yf.forEach(a),lu=o(fe," if the item is not found."),fe.forEach(a),Kp=i(s),Rs=c(s,"P",{});var hk=u(Rs);ct=c(hk,"CODE",{});var qf=u(ct);cu=o(qf,"indexOf"),qf.forEach(a),uu=o(hk," returns the first occurrence if multiple of the item is found."),hk.forEach(a),Ip=i(s),Hs=c(s,"P",{});var bk=u(Hs);ut=c(bk,"CODE",{});var Wf=u(ut);ru=o(Wf,"lastIndexOf"),Wf.forEach(a),iu=o(bk," returns the last occurence of the specified element."),bk.forEach(a),Lp=i(s),Sa=c(s,"H3",{});var Gf=u(Sa);ku=o(Gf,"Includes"),Gf.forEach(a),Rp=i(s),Na=c(s,"P",{});var Vf=u(Na);fu=o(Vf,"Includes allows us to check if an array includes a specific item."),Vf.forEach(a),Hp=i(s),I=c(s,"P",{});var fn=u(I);du=o(fn,"This is very similar to running "),rt=c(fn,"CODE",{});var $f=u(rt);mu=o($f,"indexOf"),$f.forEach(a),vu=o(fn," and comparing against "),it=c(fn,"CODE",{});var zf=u(it);yu=o(zf,"-1"),zf.forEach(a),Eu=o(fn,". There are a few key differences:"),fn.forEach(a),Sp=i(s),L=c(s,"UL",{});var dn=u(L);R=c(dn,"LI",{});var la=u(R);kt=c(la,"CODE",{});var Xf=u(kt);_u=o(Xf,"includes"),Xf.forEach(a),wu=o(la," returns a boolean and "),ft=c(la,"CODE",{});var Qf=u(ft);hu=o(Qf,"indexOf"),Qf.forEach(a),bu=o(la," returns a number (the index, else "),dt=c(la,"CODE",{});var Zf=u(dt);Ou=o(Zf,"-1"),Zf.forEach(a),ju=o(la,")"),la.forEach(a),Ju=i(dn),A=c(dn,"LI",{});var mn=u(A);mt=c(mn,"CODE",{});var gf=u(mt);Pu=o(gf,"includes"),gf.forEach(a),Cu=o(mn," can check for "),vt=c(mn,"CODE",{});var sd=u(vt);xu=o(sd,"NaN"),sd.forEach(a),Du=o(mn,", unlike "),yt=c(mn,"CODE",{});var ad=u(yt);Tu=o(ad,"indexOf"),ad.forEach(a),mn.forEach(a),Mu=i(dn),V=c(dn,"LI",{});var de=u(V);Et=c(de,"CODE",{});var nd=u(Et);Ku=o(nd,"includes"),nd.forEach(a),Iu=o(de," is from ES2016, so some old browsers may not support it. Itâs got "),Ss=c(de,"A",{href:!0,rel:!0});var td=u(Ss);
134Lu=o(td,"great support at 97.5%"),td.forEach(a),Ru=o(de," at time of writing"),de.forEach(a),dn.forEach(a),Np=i(s),B=c(s,"P",{});var me=u(B);_t=c(me,"CODE",{});var ed=u(_t);Hu=o(ed,"includes"),ed.forEach(a),Su=o(me," is straightforward to check if an element exists, but "),wt=c(me,"CODE",{});var pd=u(wt);Nu=o(pd,"indexOf"),pd.forEach(a),Fu=o(me," is more versatile."),me.forEach(a),Fp=i(s),Fa=c(s,"P",{});var od=u(Fa);Au=o(od,"Hereâs a quick comparison:"),od.forEach(a),Ap=i(s),Ns=c(s,"PRE",{class:!0});var iv=u(Ns);iv.forEach(a),Bp=i(s),Aa=c(s,"H3",{});var ld=u(Aa);Bu=o(ld,"Find"),ld.forEach(a),Up=i(s),Ba=c(s,"P",{});var cd=u(Ba);Uu=o(cd,"Find returns the value of the first element that meets a condition."),cd.forEach(a),Yp=i(s),Ua=c(s,"P",{});var ud=u(Ua);Yu=o(ud,"Find index returns the index of the first element to meet a condition."),ud.forEach(a),qp=i(s),Fs=c(s,"PRE",{class:!0});var kv=u(Fs);kv.forEach(a),Wp=i(s),U=c(s,"P",{});var ve=u(U);qu=o(ve,"First num greater 5: "),ht=c(ve,"CODE",{});var rd=u(ht);Wu=o(rd,"9"),rd.forEach(a),Gu=o(ve,` 135First num greater 5 index: `),bt=c(ve,"CODE",{});var id=u(bt);Vu=o(id,"5"),id.forEach(a),ve.forEach(a),Gp=i(s),Y=c(s,"P",{});var ye=u(Y);Ot=c(ye,"CODE",{});var kd=u(Ot);$u=o(kd,"find"),kd.forEach(a),zu=o(ye," and "),jt=c(ye,"CODE",{});var fd=u(jt);Xu=o(fd,"findIndex"),fd.forEach(a),Qu=o(ye," take the same 3 arguments as most functions above: value, index, array."),ye.forEach(a),Vp=i(s),H=c(s,"P",{});var vn=u(H);Zu=o(vn,"You can also use "),Jt=c(vn,"CODE",{});var dd=u(Jt);gu=o(dd,"findLast"),dd.forEach(a),sr=o(vn," and "),Pt=c(vn,"CODE",{});var md=u(Pt);ar=o(md,"findLastIndex"),md.forEach(a),nr=o(vn," to find the last element (or index) that meets a condition."),vn.forEach(a),$p=i(s),Ya=c(s,"H3",{});var vd=u(Ya);tr=o(vd,"From"),vd.forEach(a),zp=i(s),qa=c(s,"P",{});var yd=u(qa);er=o(yd,"From returns an array from any iterable object or object with a length."),yd.forEach(a),Xp=i(s),As=c(s,"PRE",{class:!0});var fv=u(As);fv.forEach(a),Qp=i(s),Bs=c(s,"P",{});var Ok=u(Bs);pr=o(Ok,"Result: "),Ct=c(Ok,"CODE",{});var Ed=u(Ct);or=o(Ed,"['A', 'B', 'C', 'D', 'E', 'F', 'G']"),Ed.forEach(a),Ok.forEach(a),Zp=i(s),Wa=c(s,"H3",{});var _d=u(Wa);lr=o(_d,"Keys, Values, and Entries"),_d.forEach(a),gp=i(s),Ga=c(s,"P",{});var wd=u(Ga);cr=o(wd,"Keys returns an array iterator object with the keys of an array."),wd.forEach(a),so=i(s),Va=c(s,"P",{});var hd=u(Va);ur=o(hd,"Values returns an array iterator object with the values of an array."),hd.forEach(a),ao=i(s),$a=c(s,"P",{});var bd=u($a);rr=o(bd,"Entries returns an array iterator object with key/value pairs."),bd.forEach(a),no=i(s),Us=c(s,"PRE",{class:!0});var dv=u(Us);dv.forEach(a),to=i(s),m=c(s,"P",{});var _=u(m);ir=o(_,"In this example, "),xt=c(_,"CODE",{});var Od=u(xt);kr=o(Od,"keys"),Od.forEach(a),fr=o(_," outputs the indices ("),Dt=c(_,"CODE",{});var jd=u(Dt);dr=o(jd,"0, 1, 2..."),jd.forEach(a),mr=o(_,"), "),Tt=c(_,"CODE",{});var Jd=u(Tt);vr=o(Jd,"values"),Jd.forEach(a),yr=o(_," outputs the name values ("),Mt=c(_,"CODE",{});var Pd=u(Mt);Er=o(Pd,"Jack, Jace, Jane..."),Pd.forEach(a),_r=o(_,") and "),Kt=c(_,"CODE",{});var Cd=u(Kt);wr=o(Cd,"entries"),Cd.forEach(a),hr=o(_," outputs the key value pairs (index and name) ("),It=c(_,"CODE",{});var xd=u(It);br=o(xd,"[0, 'Jack'], [1, 'Jace'], [2, 'Jane']..."),xd.forEach(a),Or=o(_,")."),_.forEach(a),eo=i(s),O=c(s,"P",{});var as=u(O);jr=o(as,"This is more logical with an object, but I felt an array example would be nice to have as well. On an object, you could instead use "),Lt=c(as,"CODE",{});var Dd=u(Lt);Jr=o(Dd,"Object.keys()"),Dd.forEach(a),Pr=o(as,", "),Rt=c(as,"CODE",{});var Td=u(Rt);Cr=o(Td,"Object.values()"),Td.forEach(a),xr=o(as,", and "),Ht=c(as,"CODE",{});var Md=u(Ht);Dr=o(Md,"Object.entries()"),Md.forEach(a),Tr=o(as,". The following code would not work:"),as.forEach(a),po=i(s),Ys=c(s,"PRE",{class:!0});var mv=u(Ys);mv.forEach(a),oo=i(s),S=c(s,"P",{});var yn=u(S);St=c(yn,"CODE",{});var Kd=u(St);Mr=o(Kd,"car.keys is not a function"),Kd.forEach(a),Kr=i(yn),Nt=c(yn,"CODE",{});var Id=u(Nt);
135Ir=o(Id,"car.values is not a function"),Id.forEach(a),Lr=i(yn),Ft=c(yn,"CODE",{});var Ld=u(Ft);Rr=o(Ld,"car.entries is not a function"),Ld.forEach(a),yn.forEach(a),lo=i(s),qs=c(s,"PRE",{class:!0});var vv=u(qs);vv.forEach(a),co=i(s),C=c(s,"P",{});var ca=u(C);Hr=o(ca,"Keys: "),At=c(ca,"CODE",{});var Rd=u(At);Sr=o(Rd,"['type', 'year', 'color', 'location']"),Rd.forEach(a),Nr=o(ca,` 136Values: `),Bt=c(ca,"CODE",{});var Hd=u(Bt);Fr=o(Hd,"['BMW', 2010, 'black', {â¦}]"),Hd.forEach(a),Ar=o(ca,` 137Entries: `),Ut=c(ca,"CODE",{});var Sd=u(Ut);Br=o(Sd,"['type', 'BMW'], ['year', 2010], ['color', 'black'], ['location', {â¦}]"),Sd.forEach(a),ca.forEach(a),uo=i(s),j=c(s,"P",{});var ns=u(j);Ur=o(ns,"You can also directly use the array returned by "),Yt=c(ns,"CODE",{});var Nd=u(Yt);Yr=o(Nd,"Object.keys(car)"),Nd.forEach(a),qr=o(ns," (or "),qt=c(ns,"CODE",{});var Fd=u(qt);Wr=o(Fd,"values"),Fd.forEach(a),Gr=o(ns," or "),Wt=c(ns,"CODE",{});var Ad=u(Wt);Vr=o(Ad,"entries"),Ad.forEach(a),$r=o(ns,") without iterating over with a for loop:"),ns.forEach(a),ro=i(s),Ws=c(s,"PRE",{class:!0});var yv=u(Ws);yv.forEach(a),io=i(s),za=c(s,"P",{});var Bd=u(za);zr=o(Bd,"Note that an array of objects would behave just like our array of strings above. Hereâs a code example:"),Bd.forEach(a),ko=i(s),Gs=c(s,"PRE",{class:!0});var Ev=u(Gs);Ev.forEach(a),fo=i(s),Xa=c(s,"P",{});var Ud=u(Xa);Xr=o(Ud,"Iâve gone a little off-topic out of arrays and into objects, but itâs important not to confuse the array methods with the object methods."),Ud.forEach(a),mo=i(s),Qa=c(s,"H3",{});var Yd=u(Qa);Qr=o(Yd,"Spread Operator"),Yd.forEach(a),vo=i(s),$=c(s,"P",{});var sl=u($);Zr=o(sl,"Use three dots ("),Gt=c(sl,"CODE",{});var qd=u(Gt);gr=o(qd,"..."),qd.forEach(a),si=o(sl,") to âspreadâ an array out. This can be useful if you have an array and you want to pass each individual item into a function, for example:"),sl.forEach(a),yo=i(s),Vs=c(s,"PRE",{class:!0});var _v=u(Vs);_v.forEach(a),Eo=i(s),J=c(s,"P",{});var ts=u(J);ai=o(ts,"In the above example, we want to pass in every single item of the array into "),Vt=c(ts,"CODE",{});var Wd=u(Vt);ni=o(Wd,"Math.max"),Wd.forEach(a),ti=o(ts,". "),$t=c(ts,"CODE",{});var Gd=u($t);ei=o(Gd,"Math.max"),Gd.forEach(a),pi=o(ts," canât take in an array object, and instead takes in individual values. We want to do: "),zt=c(ts,"CODE",{});var Vd=u(zt);oi=o(Vd,"Math.max(3, 1, 4, 1, 5, 9, 2)"),Vd.forEach(a),li=o(ts,". Rather than rewrite the entire array, especially if we donât know what the items are or how many there are, this makes it way easier."),ts.forEach(a),_o=i(s),$s=c(s,"PRE",{class:!0});var wv=u($s);wv.forEach(a),wo=i(s),zs=c(s,"P",{});var jk=u(zs);ci=o(jk,"Year: "),Xt=c(jk,"CODE",{});var $d=u(Xt);ui=o($d,"['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'May']"),$d.forEach(a),jk.forEach(a),ho=i(s),Za=c(s,"P",{});var zd=u(Za);ri=o(zd,"In the above example, we have four arrays, and we want one array that combines all of them. Instead of writing them all out, we can just spread them together. If we didnât use the spread operator, weâd have a 2 dimensional array:"),zd.forEach(a),bo=i(s),Xs=c(s,"PRE",{class:!0});var hv=u(Xs);hv.forEach(a),Oo=i(s),Qs=c(s,"P",{});var Jk=u(Qs);ii=o(Jk,"Year: "),Qt=c(Jk,"CODE",{});var Xd=u(Qt);ki=o(Xd,"['Jan', 'Feb', 'Mar'], ['Apr', 'May', 'Jun'], ['Jul', 'Aug', 'Sep'], ['Oct', 'Nov', 'May']"),Xd.forEach(a),Jk.forEach(a),jo=i(s),z=c(s,"P",{});var al=u(z);
137fi=o(al,"Spreading can also be commonly used instead of using "),Zt=c(al,"CODE",{});var Qd=u(Zt);di=o(Qd,"push"),Qd.forEach(a),mi=o(al," then reassigning a variable in a reactive JavaScript framework. For example:"),al.forEach(a),Jo=i(s),Zs=c(s,"PRE",{class:!0});var bv=u(Zs);bv.forEach(a),Po=i(s),X=c(s,"P",{});var nl=u(X);vi=o(nl,"Some frameworks might not âknowâ that "),gt=c(nl,"CODE",{});var Zd=u(gt);yi=o(Zd,"name"),Zd.forEach(a),Ei=o(nl," was updated here, since even though a method was called on it, it was reassigned."),nl.forEach(a),Co=i(s),Q=c(s,"P",{});var tl=u(Q);_i=o(tl,"This would mean that the "),se=c(tl,"CODE",{});var gd=u(se);wi=o(gd,"todos"),gd.forEach(a),hi=o(tl," used in the UI wouldnât update, and the user wouldnât see their todo."),tl.forEach(a),xo=i(s),gs=c(s,"PRE",{class:!0});var Ov=u(gs);Ov.forEach(a),Do=i(s),ga=c(s,"P",{});var sm=u(ga);bi=o(sm,"This would result in the user writing redundant and confusing code like above."),sm.forEach(a),To=i(s),sa=c(s,"PRE",{class:!0});var jv=u(sa);jv.forEach(a),Mo=i(s),sn=c(s,"P",{});var am=u(sn);Oi=o(am,"Maybe a comment would help, but instead we can simply use the spread operator to add the item and reassign in one swoop:"),am.forEach(a),Ko=i(s),aa=c(s,"PRE",{class:!0});var Jv=u(aa);Jv.forEach(a),Io=i(s),Z=c(s,"P",{});var el=u(Z);ji=o(el,"Or we can add it in the front instead of "),ae=c(el,"CODE",{});var nm=u(ae);Ji=o(nm,"shift"),nm.forEach(a),Pi=o(el,":"),el.forEach(a),Lo=i(s),na=c(s,"PRE",{class:!0});var Pv=u(na);Pv.forEach(a),Ro=i(s),an=c(s,"P",{});var tm=u(an);Ci=o(tm,"You might also find yourself wanting to loop a specific number of times (not through an array or object) in an each loop."),tm.forEach(a),Ho=i(s),nn=c(s,"P",{});var em=u(nn);xi=o(em,"Hereâs an example in svelte:"),em.forEach(a),So=i(s),ta=c(s,"PRE",{class:!0});var Cv=u(ta);Cv.forEach(a),No=i(s),tn=c(s,"P",{});var pm=u(tn);Di=o(pm,"Instead of manually writing out all 10 items (or letâs say we have 100 items), we could use the spread operator:"),pm.forEach(a),Fo=i(s),ea=c(s,"PRE",{class:!0});var xv=u(ea);xv.forEach(a),Ao=i(s),E=c(s,"P",{});var N=u(E);Ti=o(N,"If we tried to just use "),ne=c(N,"CODE",{});var om=u(ne);Mi=o(om,"Array(11).keys()"),om.forEach(a),Ki=o(N,", it wouldnât work beause "),te=c(N,"CODE",{});var lm=u(te);Ii=o(lm,"keys"),lm.forEach(a),Li=o(N," returns an iterator, not an array. The spread operator ("),ee=c(N,"CODE",{});var cm=u(ee);Ri=o(cm,"..."),cm.forEach(a),Hi=o(N,") iterates and spreads out the array, and the square brackets ("),pe=c(N,"CODE",{});var um=u(pe);Si=o(um,"[]"),um.forEach(a),Ni=o(N,") contain the spread out array (otherwise itâs just âfloating in spaceâ and not inside an array)."),N.forEac
137h(a),Bo=i(s),g=c(s,"P",{});var pl=u(g);Fi=o(pl,"Last example: lets say we have default themes and user themes, in two arrays, and we want to iterate through both. Instead of making two for loops, we could just iterate on "),oe=c(pl,"CODE",{});var rm=u(oe);Ai=o(rm,"[...defaultThemes, ...userThemes]"),rm.forEach(a),Bi=o(pl,". Easy."),pl.forEach(a),Uo=i(s),Yo=c(s,"HR",{}),qo=i(s),en=c(s,"P",{});var im=u(en);v=c(im,"STRONG",{});var w=u(v);Ui=o(w,"Check out "),pn=c(w,"A",{href:!0});var km=u(pn);Yi=o(km,"Part 3"),km.forEach(a),qi=o(w," where we cover new array methods such as "),le=c(w,"CODE",{});var fm=u(le);Wi=o(fm,"groupBy"),fm.forEach(a),Gi=o(w,", "),ce=c(w,"CODE",{});var dm=u(ce);Vi=o(dm,"with"),dm.forEach(a),$i=o(w,", "),ue=c(w,"CODE",{});var mm=u(ue);zi=o(mm,"at"),mm.forEach(a),Xi=o(w,", "),re=c(w,"CODE",{});var vm=u(re);Qi=o(vm,"fill"),vm.forEach(a),Zi=o(w,", "),ie=c(w,"CODE",{});var ym=u(ie);gi=o(ym,"toSorted"),ym.forEach(a),sk=o(w," and more!"),w.forEach(a),im.forEach(a),Wo=i(s),Go=c(s,"HR",{}),Vo=i(s),on=c(s,"H3",{});var Em=u(on);ak=o(Em,"Further Reading"),Em.forEach(a),$o=i(s),ln=c(s,"UL",{});var _m=u(ln);ke=c(_m,"LI",{});var wm=u(ke);pa=c(wm,"A",{href:!0,rel:!0});var hm=u(pa);nk=o(hm,"W3 schools"),hm.forEach(a),wm.forEach(a),_m.forEach(a),this.h()},h(){k(h,"type","image/avif"),k(h,"srcset","/img/blog/solar_array_2.avif"),k(h,"alt",""),Fv(d.src,x="/img/blog/solar_array_2.jpg")||k(d,"src",x),k(d,"alt",""),k(da,"href","/blog/array-methods-javascript"),k(ls,"class","language-js"),k(cs,"class","language-js"),k(rs,"class","language-js"),k(ks,"class","language-js"),k(fs,"class","language-js"),k(ys,"class","language-js"),k(ws,"class","language-js"),k(Os,"class","language-js"),k(Ps,"class","language-js"),k(xs,"class","language-js"),k(Ks,"class","language-js"),k(Ss,"href","https://caniuse.com/array-includes"),k(Ss,"rel","nofollow"),k(Ns,"class","language-js"),k(Fs,"class","language-js"),k(As,"class","language-js"),k(Us,"class","language-js"),k(Ys,"class","language-js"),k(qs,"class","language-js"),k(Ws,"class","language-js"),k(Gs,"class","language-js"),k(Vs,"class","language-js"),k($s,"class","language-js"),k(Xs,"class","language-js"),k(Zs,"class","language-js"),k(gs,"class","language-js"),k(sa,"class","language-js"),k(aa,"class","language-js"),k(na,"class","language-js"),k(ta,"class","language-svelte"),k(ea,"class","language-svelte"),k(pn,"href","/blog/array-methods-javascript-newer"),k(pa,"href","https://www.w3schools.com/js/js_array_iteration.asp"),k(pa,"rel","nofollow")},m(s,t){e(s,f,t),n(f,y),n(y,h),n(y,es),n(y,d),n(f,ra),n(f,En),n(En,ol),e(s,Ee,t),e(s,ia,t),n(ia,ll),e(s,_e,t),e(s,ka,t),n(ka,cl),e(s,we,t),e(s,he,t),e(s,be,t),e(s,fa,t),n(fa,ps),n(ps,ul),n(ps,da),n(da,rl),n(ps,il),e(s,Oe,t),e(s,je,t),e(s,Je,t),e(s,ma,t),n(ma,kl),e(s,Pe,t),e(s,os,t),n(os,_n),n(_n,fl),n(os,dl),e(s,Ce,t),e(s,D,t),n(D,wn),n(wn,ml),n(D,vl),n(D,hn),n(hn,yl),n(D,El),n(D,bn),n(bn,_l),e(s,xe,t),e(s,ls,t),ls.innerHTML=Jm,e(s,De,t),e(s,va,t),n(va,wl),e(s,Te,t),e(s,ya,t),n(ya,hl),e(s,Me,t),e(s,cs,t),cs.innerHTML=Pm,e(s,Ke,t),e(s,us,t),n(us,On),n(On,bl),n(us,Ol),e(s,Ie,t),e(s,rs,t),rs.innerHTML=Cm,e(s,Le,t),e(s,Ea,t),n(Ea,jl),e(s,Re,t),e(s,_a,t),n(_a,jn),n(jn,Jl),e(s,He,t),e(s,is,t),n(is,Jn),n(Jn,Pl),n(is,Cl),e(s,Se,t),e(s,wa,t),n(wa,xl),e(s,Ne,t),e(s,ks,t),ks.innerHTML=xm,e(s,Fe,t),e(s,ha,t),n(ha,Pn),n(Pn,Dl),e(s,Ae,t),e(s,ba,t),n(ba,Tl),e(s,Be,t),e(s,Oa,t),n(Oa,Ml),e(s,Ue,t),e(s,fs,t),fs.innerHTML=Dm,e(s,Ye,t),e(s,ds,t),n(ds,Kl),n(ds,Cn),n(Cn,Il),e(s,qe,t),e(s,ms,t),n(ms,Ll),n(ms,xn),n(xn,Rl),e(s,We,t),e(s,vs,t),n(vs,Dn),n(Dn,Hl),n(vs,Sl),e(s,Ge,t),e(s,T,t),n(T,Tn),n(Tn,Nl),n(T,Fl),n(T,Mn),n(Mn,Al),n(T,Bl),n(T,Kn),n(Kn,Ul),e(s,Ve,t),e(s,q,t),n(q,Yl),n(q,In),n(In,ql),n(q,Wl),e(s,$e,t),e(s,M,t),n(M,Gl),n(M,Ln),n(Ln,Vl),n(M,$l),n(M,Rn),n(Rn,zl),n(M,Xl),e(s,ze,t),e(s,ja,t),n(ja,Ql),e(s,Xe,t),e(s,Ja,t),n(Ja,Zl),e(s,Qe,t),e(s,ys,t),ys.innerHTML=Tm,e(s,Ze,t),e(s,Es,t),n(Es,gl),n(Es,Hn),n(Hn,sc),e(s,ge,t),e(s,_s,t),n(_s,ac),n(_s,Sn),n(Sn,nc),e(s,sp,t),e(s,P,t),n(P,Nn),n(Nn,tc),n(P,ec),n(P,Fn),n(Fn,pc),n(P,oc),n(P,An),n(An,lc),n(P,cc),e(s,ap,t),e(s,ws,t),ws.innerHTML=Mm,e(s,np,t),e(s,hs,t),n(hs,uc
137),n(hs,Bn),n(Bn,rc),e(s,tp,t),e(s,bs,t),n(bs,ic),n(bs,Un),n(Un,kc),e(s,ep,t),e(s,Pa,t),n(Pa,fc),e(s,pp,t),e(s,Ca,t),n(Ca,dc),e(s,op,t),e(s,Os,t),Os.innerHTML=Km,e(s,lp,t),e(s,js,t),n(js,mc),n(js,Yn),n(Yn,vc),e(s,cp,t),e(s,Js,t),n(Js,yc),n(Js,qn),n(qn,Ec),e(s,up,t),e(s,W,t),n(W,_c),n(W,Wn),n(Wn,wc),n(W,hc),e(s,rp,t),e(s,b,t),n(b,Gn),n(Gn,bc),n(b,Oc),n(b,Vn),n(Vn,jc),n(b,Jc),n(b,$n),n($n,Pc),n(b,Cc),n(b,zn),n(zn,xc),e(s,ip,t),e(s,xa,t),n(xa,Dc),e(s,kp,t),e(s,Da,t),n(Da,Tc),e(s,fp,t),e(s,Ps,t),Ps.innerHTML=Im,e(s,dp,t),e(s,Cs,t),n(Cs,Mc),n(Cs,Xn),n(Xn,Kc),e(s,mp,t),e(s,K,t),n(K,Ic),n(K,Qn),n(Qn,Lc),n(K,Rc),n(K,Zn),n(Zn,Hc),n(K,Sc),e(s,vp,t),e(s,Ta,t),n(Ta,Nc),e(s,yp,t),e(s,Ma,t),n(Ma,Fc),e(s,Ep,t),e(s,Ka,t),n(Ka,Ac),e(s,_p,t),e(s,xs,t),xs.innerHTML=Lm,e(s,wp,t),e(s,Ia,t),n(Ia,Bc),e(s,hp,t),e(s,Ds,t),n(Ds,Uc),n(Ds,gn),n(gn,Yc),e(s,bp,t),e(s,Ts,t),n(Ts,qc),n(Ts,st),n(st,Wc),e(s,Op,t),e(s,Ms,t),n(Ms,Gc),n(Ms,at),n(at,Vc),e(s,jp,t),e(s,La,t),n(La,$c),e(s,Jp,t),e(s,Ra,t),n(Ra,zc),e(s,Pp,t),e(s,Ha,t),n(Ha,Xc),e(s,Cp,t),e(s,Ks,t),Ks.innerHTML=Rm,e(s,xp,t),e(s,Is,t),n(Is,Qc),n(Is,nt),n(nt,Zc),e(s,Dp,t),e(s,Ls,t),n(Ls,tt),n(tt,gc),n(Ls,su),e(s,Tp,t),e(s,G,t),n(G,et),n(et,au),n(G,nu),n(G,pt),n(pt,tu),e(s,Mp,t),e(s,F,t),n(F,ot),n(ot,eu),n(F,pu),n(F,lt),n(lt,ou),n(F,lu),e(s,Kp,t),e(s,Rs,t),n(Rs,ct),n(ct,cu),n(Rs,uu),e(s,Ip,t),e(s,Hs,t),n(Hs,ut),n(ut,ru),n(Hs,iu),e(s,Lp,t),e(s,Sa,t),n(Sa,ku),e(s,Rp,t),e(s,Na,t),n(Na,fu),e(s,Hp,t),e(s,I,t),n(I,du),n(I,rt),n(rt,mu),n(I,vu),n(I,it),n(it,yu),n(I,Eu),e(s,Sp,t),e(s,L,t),n(L,R),n(R,kt),n(kt,_u),n(R,wu),n(R,ft),n(ft,hu),n(R,bu),n(R,dt),n(dt,Ou),n(R,ju),n(L,Ju),n(L,A),n(A,mt),n(mt,Pu),n(A,Cu),n(A,vt),n(vt,xu),n(A,Du),n(A,yt),n(yt,Tu),n(L,Mu),n(L,V),n(V,Et),n(Et,Ku),n(V,Iu),n(V,Ss),n(Ss,Lu),n(V,Ru),e(s,Np,t),e(s,B,t),n(B,_t),n(_t,Hu),n(B,Su),n(B,wt),n(wt,Nu),n(B,Fu),e(s,Fp,t),e(s,Fa,t),n(Fa,Au),e(s,Ap,t),e(s,Ns,t),Ns.innerHTML=Hm,e(s,Bp,t),e(s,Aa,t),n(Aa,Bu),e(s,Up,t),e(s,Ba,t),n(Ba,Uu),e(s,Yp,t),e(s,Ua,t),n(Ua,Yu),e(s,qp,t),e(s,Fs,t),Fs.innerHTML=Sm,e(s,Wp,t),e(s,U,t),n(U,qu),n(U,ht),n(ht,Wu),n(U,Gu),n(U,bt),n(bt,Vu),e(s,Gp,t),e(s,Y,t),n(Y,Ot),n(Ot,$u),n(Y,zu),n(Y,jt),n(jt,Xu),n(Y,Qu),e(s,Vp,t),e(s,H,t),n(H,Zu),n(H,Jt),n(Jt,gu),n(H,sr),n(H,Pt),n(Pt,ar),n(H,nr),e(s,$p,t),e(s,Ya,t),n(Ya,tr),e(s,zp,t),e(s,qa,t),n(qa,er),e(s,Xp,t),e(s,As,t),As.innerHTML=Nm,e(s,Qp,t),e(s,Bs,t),n(Bs,pr),n(Bs,Ct),n(Ct,or),e(s,Zp,t),e(s,Wa,t),n(Wa,lr),e(s,gp,t),e(s,Ga,t),n(Ga,cr),e(s,so,t),e(s,Va,t),n(Va,ur),e(s,ao,t),e(s,$a,t),n($a,rr),e(s,no,t),e(s,Us,t),Us.innerHTML=Fm,e(s,to,t),e(s,m,t),n(m,ir),n(m,xt),n(xt,kr),n(m,fr),n(m,Dt),n(Dt,dr),n(m,mr),n(m,Tt),n(Tt,vr),n(m,yr),n(m,Mt),n(Mt,Er),n(m,_r),n(m,Kt),n(Kt,wr),n(m,hr),n(m,It),n(It,br),n(m,Or),e(s,eo,t),e(s,O,t),n(O,jr),n(O,Lt),n(Lt,Jr),n(O,Pr),n(O,Rt),n(Rt,Cr),n(O,xr),n(O,Ht),n(Ht,Dr),n(O,Tr),e(s,po,t),e(s,Ys,t),Ys.innerHTML=Am,e(s,oo,t),e(s,S,t),n(S,St),n(St,Mr),n(S,Kr),n(S,Nt),n(Nt,Ir),n(S,Lr),n(S,Ft),n(Ft,Rr),e(s,lo,t),e(s,qs,t),qs.innerHTML=Bm,e(s,co,t),e(s,C,t),n(C,Hr),n(C,At),n(At,Sr),n(C,Nr),n(C,Bt),n(Bt,Fr),n(C,Ar),n(C,Ut),n(Ut,Br),e(s,uo,t),e(s,j,t),n(j,Ur),n(j,Yt),n(Yt,Yr),n(j,qr),n(j,qt),n(qt,Wr),n(j,Gr),n(j,Wt),n(Wt,Vr),n(j,$r),e(s,ro,t),e(s,Ws,t),Ws.innerHTML=Um,e(s,io,t),e(s,za,t),n(za,zr),e(s,ko,t),e(s,Gs,t),Gs.innerHTML=Ym,e(s,fo,t),e(s,Xa,t),n(Xa,Xr),e(s,mo,t),e(s,Qa,t),n(Qa,Qr),e(s,vo,t),e(s,$,t),n($,Zr),n($,Gt),n(Gt,gr),n($,si),e(s,yo,t),e(s,Vs,t),Vs.innerHTML=qm,e(s,Eo,t),e(s,J,t),n(J,ai),n(J,Vt),n(Vt,ni),n(J,ti),n(J,$t),n($t,ei),n(J,pi),n(J,zt),n(zt,oi),n(J,li),e(s,_o,t),e(s,$s,t),$s.innerHTML=Wm,e(s,wo,t),e(s,zs,t),n(zs,ci),n(zs,Xt),n(Xt,ui),e(s,ho,t),e(s,Za,t),n(Za,ri),e(s,bo,t),e(s,Xs,t),Xs.innerHTML=Gm,e(s,Oo,t),e(s,Qs,t),n(Qs,ii),n(Qs,Qt),n(Qt,ki),e(s,jo,t),e(s,z,t),n(z,fi),n(z,Zt),n(Zt,di),n(z,mi),e(s,Jo,t),e(s,Zs,t),Zs.innerHTML=Vm,e(s,Po,t),e(s,X,t),n(X,vi),n(X,gt),n(gt,yi),n(X,Ei),e(s,Co,t),e(s,Q,t),n(Q,_i),n(Q,se),n(se,wi),n(Q,hi),e(s,xo,t),e(s,gs,t),gs.innerHTML=$m,e(s,Do,t),e(s,ga,t),n(ga,bi),e(s,To,t),e(s,sa,t),sa.innerHTML=zm,e(s,Mo,t),e(s,sn,t),n(sn,Oi),e(s,Ko,t),e(s,aa,t),aa.innerHTML=Xm,e(s,Io,t),e(s,Z,t),n(Z,ji),n(Z,ae),n(ae,Ji),n(Z,Pi),e(s,Lo,t),e(s,na,t),na.innerHTML=Qm,e(s,Ro,t),e(s,an,t),n(an,Ci),e(s,Ho,t),e(s,nn,t),n(nn,xi),e(s,So,t),e(s,ta,t),ta.innerHTML=Zm,e(s,No,t),e(s,tn,t),n(tn,Di),e(s,Fo,t),e(s,ea,t),ea.innerHTML=gm,e
137(s,Ao,t),e(s,E,t),n(E,Ti),n(E,ne),n(ne,Mi),n(E,Ki),n(E,te),n(te,Ii),n(E,Li),n(E,ee),n(ee,Ri),n(E,Hi),n(E,pe),n(pe,Si),n(E,Ni),e(s,Bo,t),e(s,g,t),n(g,Fi),n(g,oe),n(oe,Ai),n(g,Bi),e(s,Uo,t),e(s,Yo,t),e(s,qo,t),e(s,en,t),n(en,v),n(v,Ui),n(v,pn),n(pn,Yi),n(v,qi),n(v,le),n(le,Wi),n(v,Gi),n(v,ce),n(ce,Vi),n(v,$i),n(v,ue),n(ue,zi),n(v,Xi),n(v,re),n(re,Qi),n(v,Zi),n(v,ie),n(ie,gi),n(v,sk),e(s,Wo,t),e(s,Go,t),e(s,Vo,t),e(s,on,t),n(on,ak),e(s,$o,t),e(s,ln,t),n(ln,ke),n(ke,pa),n(pa,nk)},p:Av,d(s){s&&a(f),s&&a(Ee),s&&a(ia),s&&a(_e),s&&a(ka),s&&a(we),s&&a(he),s&&a(be),s&&a(fa),s&&a(Oe),s&&a(je),s&&a(Je),s&&a(ma),s&&a(Pe),s&&a(os),s&&a(Ce),s&&a(D),s&&a(xe),s&&a(ls),s&&a(De),s&&a(va),s&&a(Te),s&&a(ya),s&&a(Me),s&&a(cs),s&&a(Ke),s&&a(us),s&&a(Ie),s&&a(rs),s&&a(Le),s&&a(Ea),s&&a(Re),s&&a(_a),s&&a(He),s&&a(is),s&&a(Se),s&&a(wa),s&&a(Ne),s&&a(ks),s&&a(Fe),s&&a(ha),s&&a(Ae),s&&a(ba),s&&a(Be),s&&a(Oa),s&&a(Ue),s&&a(fs),s&&a(Ye),s&&a(ds),s&&a(qe),s&&a(ms),s&&a(We),s&&a(vs),s&&a(Ge),s&&a(T),s&&a(Ve),s&&a(q),s&&a($e),s&&a(M),s&&a(ze),s&&a(ja),s&&a(Xe),s&&a(Ja),s&&a(Qe),s&&a(ys),s&&a(Ze),s&&a(Es),s&&a(ge),s&&a(_s),s&&a(sp),s&&a(P),s&&a(ap),s&&a(ws),s&&a(np),s&&a(hs),s&&a(tp),s&&a(bs),s&&a(ep),s&&a(Pa),s&&a(pp),s&&a(Ca),s&&a(op),s&&a(Os),s&&a(lp),s&&a(js),s&&a(cp),s&&a(Js),s&&a(up),s&&a(W),s&&a(rp),s&&a(b),s&&a(ip),s&&a(xa),s&&a(kp),s&&a(Da),s&&a(fp),s&&a(Ps),s&&a(dp),s&&a(Cs),s&&a(mp),s&&a(K),s&&a(vp),s&&a(Ta),s&&a(yp),s&&a(Ma),s&&a(Ep),s&&a(Ka),s&&a(_p),s&&a(xs),s&&a(wp),s&&a(Ia),s&&a(hp),s&&a(Ds),s&&a(bp),s&&a(Ts),s&&a(Op),s&&a(Ms),s&&a(jp),s&&a(La),s&&a(Jp),s&&a(Ra),s&&a(Pp),s&&a(Ha),s&&a(Cp),s&&a(Ks),s&&a(xp),s&&a(Is),s&&a(Dp),s&&a(Ls),s&&a(Tp),s&&a(G),s&&a(Mp),s&&a(F),s&&a(Kp),s&&a(Rs),s&&a(Ip),s&&a(Hs),s&&a(Lp),s&&a(Sa),s&&a(Rp),s&&a(Na),s&&a(Hp),s&&a(I),s&&a(Sp),s&&a(L),s&&a(Np),s&&a(B),s&&a(Fp),s&&a(Fa),s&&a(Ap),s&&a(Ns),s&&a(Bp),s&&a(Aa),s&&a(Up),s&&a(Ba),s&&a(Yp),s&&a(Ua),s&&a(qp),s&&a(Fs),s&&a(Wp),s&&a(U),s&&a(Gp),s&&a(Y),s&&a(Vp),s&&a(H),s&&a($p),s&&a(Ya),s&&a(zp),s&&a(qa),s&&a(Xp),s&&a(As),s&&a(Qp),s&&a(Bs),s&&a(Zp),s&&a(Wa),s&&a(gp),s&&a(Ga),s&&a(so),s&&a(Va),s&&a(ao),s&&a($a),s&&a(no),s&&a(Us),s&&a(to),s&&a(m),s&&a(eo),s&&a(O),s&&a(po),s&&a(Ys),s&&a(oo),s&&a(S),s&&a(lo),s&&a(qs),s&&a(co),s&&a(C),s&&a(uo),s&&a(j),s&&a(ro),s&&a(Ws),s&&a(io),s&&a(za),s&&a(ko),s&&a(Gs),s&&a(fo),s&&a(Xa),s&&a(mo),s&&a(Qa),s&&a(vo),s&&a($),s&&a(yo),s&&a(Vs),s&&a(Eo),s&&a(J),s&&a(_o),s&&a($s),s&&a(wo),s&&a(zs),s&&a(ho),s&&a(Za),s&&a(bo),s&&a(Xs),s&&a(Oo),s&&a(Qs),s&&a(jo),s&&a(z),s&&a(Jo),s&&a(Zs),s&&a(Po),s&&a(X),s&&a(Co),s&&a(Q),s&&a(xo),s&&a(gs),s&&a(Do),s&&a(ga),s&&a(To),s&&a(sa),s&&a(Mo),s&&a(sn),s&&a(Ko),s&&a(aa),s&&a(Io),s&&a(Z),s&&a(Lo),s&&a(na),s&&a(Ro),s&&a(an),s&&a(Ho),s&&a(nn),s&&a(So),s&&a(ta),s&&a(No),s&&a(tn),s&&a(Fo),s&&a(ea),s&&a(Ao),s&&a(E),s&&a(Bo),s&&a(g),s&&a(Uo),s&&a(Yo),s&&a(qo),s&&a(en),s&&a(Wo),s&&a(Go),s&&a(Vo),s&&a(on),s&&a($o),s&&a(ln)}}}function Yv(ua){let f,y;const h=[ua[0],jm];let es={$$slots:{default:[Uv]},$$scope:{ctx:ua}};for(let d=0;d<h.length;d+=1)es=Pk(es,h[d]);return f=new Bv({props:es}),{c(){Kv(f.$$.fragment)},l(d){Iv(f.$$.fragment,d)},m(d,x){Lv(f,d,x),y=!0},p(d,[x]){const ra=x&1?Rv(h,[x&1&&bm(d[0]),x&0&&bm(jm)]):{};x&2&&(ra.$$scope={dirty:x,ctx:d}),f.$set(ra)},i(d){y||(Hv(f.$$.fragment,d),y=!0)},o(d){Sv(f.$$.fragment,d),y=!1},d(d){Nv(f,d)}}}const jm={layout:"blog_layout",title:"Array Methods in JavaScript - Part 2: Iteration",slug:"array-methods-javascript-iteration",date:"2024/01/04",updated_date:"2024/01/04",author:"Justin Golden",preview_text:"Learn about iterating over arrays with forEach, map, filter, reduce, find, and more!",img:"/img/blog/solar_array_2.avif",categories:["web","javascript"],keywords:["learn js arrays","javascript array methods","javascript array iteration","javascript forEach method","javascript map method","javascript filter method","javascript reduce method","javascript find method"]};function qv(ua,f,y){return ua.$$set=h=>{y(0,f=Pk(Pk({},f),Om(h)))},f=Om(f),[f]}class Vv extends Dv{constructor(f){super(),Tv(this,f,qv,Yv,Mv,{})}}export{Vv as default,jm as metadata};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.