» »

[Javascript] Začetniško učenje

[Javascript] Začetniško učenje

zgublen376 ::

Zdravo. Učim se programirati po Udemy coursu (Colt Steele). Zataknilo se mi je pri osnovah funkcij JS. S tem se ubadam že celo popoldne. Ostalo sem dojel, teh dveh nalog pa ne morem rešiti. Sicer mi je znan princip, a ne vem, kako bi uredil sintakso, da bi delovala. Bi mi lahko kdo pomagal? Ponavljam, da sem pri osnovah, torej razni .pop in .slice itd.

1. Please write a function called lastElement which accepts a single array argument. The function should return the last element of the array (without removing the element). If the array is empty, the function should return null.

Output:
lastElement([3,5,7]); //7
lastElement([1]); //1
lastElement([]); //null


function lastElement([x]) {
    
}

console.log([3,5,7]);
console.log([1]);
console.log([]);



2. Define a function called capitalize that accepts a string argument and returns a new string with the first letter capitalized (but the rest of the string unchanged). For example:
capitalize("eggplant"); ///"Eggplant"
capitalize("pamplemousse"); ///"Pamplemousse"
capitalize("squid"); ///"Squid"

Hints:
Remember that strings are immutable, meaning that you cannot simply change the first letter in the original string. You will need to make a new string that you return.
Single out the first letter and capitalize it. (use a string method to help)
Add that first letter to the rest of the original string, sliced to omit to the original first letter (use a string method to help).
For example: "eggplant" becomes "E" + "ggplant".

Trenutno:

function capitalize(input) {
    input.slice(1, 5);
    console.log(input);
}

console.log("eggplant");
console.log("pamplemousse");
console.log("squid");


_________

Kode nimam rešene praktično nič. Jasen mi je princip, ne vem pa, kako bi to vpeljal v sintakso. Tile nalogi sta mala malica za nekoga, ki saj približno zna. Potem, ko vidim, kako se to sestavi, mi je precej bolj jasno. Trenutno pa je razloženo nekaj malega in potem v nalogi vse vrženo skupaj.

Kakorkoli, pomoč mi bo prav prišla...

HotBurek ::

<!DOCTYPE html>

<html lang="sl">
	<head>
		<meta charset="utf-8">
	</head>
	
	<body>

<script type="text/javascript">

var array_1 = [3, 5, 7];
var array_2 = [1];
var array_3 = [];

function lastElement(array) {
	if (array.length > 0) {
		return array[array.length - 1];
	}
	else {
		return null;
	};	
};

console.log(lastElement(array_1));
console.log(lastElement(array_2));
console.log(lastElement(array_3));

var string_1 = "eggplant";
var string_2 = "pamplemousse";
var string_3 = "squid";

function capitalize(input) {
    if (input.length > 0) {
    	return input.charAt(0).toUpperCase() + input.slice(1, input.length); 
    };
};

console.log(capitalize(string_1));
console.log(capitalize(string_2));
console.log(capitalize(string_3));

</script>

	</body>
</html>
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Yakamashi ::

Glede na opisano je mozno, da ti pri ucenju probleme dela razumevanje return statementov.

Poleg Udemya si vzporedno lahko pomagas z drugimi materiali, eno najboljsih gradiv za popolne zacetnike je tale zastonj knjiga:

https://eloquentjavascript.net/

@HotBurek, ne rabas type="" argumenta v script tagu :)

zgublen376 ::

Ja, seveda, osnove mi manjkajo. Tole predelujem šele par dni in ko je zadeva malo drugačna od predstavljene, se mi ustavi.

Recimo tale mi dela težave, ker ne vem, kako obrniti array. Gre za to, da v funkcijo spravim array z dnevi v tednu, ki jih potem kličem po številki.
Druga varianta je z objektom in ključi. Tega še nisem poskusil.

function returnDay(number) {                                        -----> funkcija
    const days = ["Monday", "Tuesday", "Wednesday", "Thursday"];    -----> to je ta array
    for (let i = 0; i < days.length; i++) {                         -----> Zakaj "let"? Loop, ki gre po arrayu od 0 do 3.
        return days[i];                                             -----> return za days[0] bo Monday itd.
    }
}

console.log(returnDay[0]);


Ne vem pa kako bi povezal "number" z ostalim?
Tudi tu mi bo nasvet v pomoč.

Hvala.

HotBurek ::

Kaj misliš s "kako obrniti array"? Ter tisto Zakaj "let"?

length se uporabi za to, da prebereš dolžino arraya, -1 pa zato, ker je prvi element na poziciji 0, drugi na poziciji 1 itn.

Se pravij array z 10 elementi ima dolžino 10, zadnji element pa se nahaja na poziciji (ok na indexu) 9. Zato -1.

function returnDay(number) {
	const days = ["Monday", "Tuesday", "Wednesday", "Thursday"];
	if (number > -1 && number < days.length) {
		return days[number];
	}
	else {
		return "Index " + String(number) + " is outside of the boundaries [0 to " + String(days.length) + "].";
	};
};

console.log(returnDay([-1]));
console.log(returnDay([0]));
console.log(returnDay([1]));
console.log(returnDay([2]));
console.log(returnDay([3]));
console.log(returnDay([4]));
console.log(returnDay([5]));
console.log(returnDay([6]));
console.log(returnDay([7]));
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

Yakamashi ::

"return za days[0] bo Monday"

Ehe, bo, ja. Nakar je konec zgodbe, nic "itd." - ker klices return v for zanki.

"let" vs. "var" je ES6 sintaksa vs. ES5 sintaksa, pa ce uporabljas let, je pametno, da ves, kaj to je.

Kaj zaboga mas to zaen Udemy course? Resno?

Zgodovina sprememb…

zgublen376 ::

Delam po coursu od Colt Steele The Web Developer Bootcamp 2020. Zelo ga hvalijo. Prej sem sledil, s temi funkcijami pa je zakompliciral. V coursu pokaže nekaj na izi, potem pa 7,8 nalog. Prvih par sem zmogel, sedaj pa me matra, kako povežem te sintakse med seboj. Tole, ko potem gledam mi je sicer jasno in logično. Moram pa bolje predelati osnove. Verjetno je tisti link kar pravi.

Probal sem tudi z "if" namesto "for", pa sem dajal "return days[i]". Saj, če sedaj pogledam zgleda logično.

Course pravi, da var ni več aktualen. Omeji na const, ki je konstanten in se ga ne da spremeniti in let, ki se ga pa da.

Hvala za pomoč. Sem pa kar odločen, da se naučim vsaj osnove.

Spxy ::

const days = ["Monday", "Tuesday", "Wednesday", "Thursday"]; // Primer komentarja.
function returnDay(days) { 
  let reversedDays = [];
  for (let i = days.length-1; i >= 0; i--) {
    reversedDays.push(days[i])
  }
  return reversedDays;
}
console.log(returnDay(days));


Takole, malo preurejena tvoja koda. Za komentarje v kodi naslednjič uporabi //, ki označuje enovrstični komentar, primer imaš zgoraj.
Po vrsticah:
1. Array dnevov definiramo zunaj funkcije, potem pa ta array uporabimo, kot argument (vrednost, ki jo funkcija sprejme) v console.log vrstici.
2. Tukaj se začne funkcija, ki sprejme en argument, v tem primeru se imenuje days. Z njegovo pomočjo v funkcijo "vstavimo" array. S tem imenom potem znotraj funkcije tudi dostopaš do arraya.
3. Definiramo prazen array, v katerega zapišemo vrednosti iz days arraya, v obratnem vrstnem redu.
4. For zanka, ki se sprehodi od zadnjega indexa v arrayu do prvega.
5. V reversedDays array zapišemo vrednost iz days arraya, na trenutnem indexu. Zapiše ga na naslednjo prosto mesto v arrayu. Torej v prvem krogu vrednost iz days arraya na zadnjem indexu (Thursday), zapiše na prvi index reversedDays. V drugem zapiše predzadnjo vrednost iz days array na drugi index v reversedDays in tako naprej.
7. Ko se izvedejo vsi koraki For zanke in imamo celoten array v obratnem vrstnem redu v reversedDays arrayu, ga tukaj funckija vrne.
9. Tukaj pokličemo funkcijo returnDay, ki ji kot argument daš svoj array, in ti ga vrne v obratnem vrstnem redu.

Yakamashi ::

@zgublen376: tole sicer dajem kot repliko na odgovor zgoraj od @Spxy, ampak je slucajno mozno, da je blo nekje tekom coursea omenjeno, da si pomagaj z dokumentacijo? Torej, tole? Ker, recimo, omenjas, kako "obrniti" array - vsi tule si to predstavljamo kot reverse array - in zgoraj mas eno pot do tega, ampak, v JS dejansko obstaja metoda array.reverse(), recimo.

Nekej resnega ti ocitno fali, v svoji kodi zgoraj klices console.log(returnDay[0]);, kar sploh tvoja funkcija ni, temvec en neobstojec array.

Lej, kadar ti zagusti z razumevanjem tematike, nikoli z glavo v zid pa naprej, vedno se moras vrnit nazaj par korakov in ponovit teorijo.

Zgodovina sprememb…

zgublen376 ::

Spet imam problem pri eni od nalog. Do končne rešitve sicer pridem, vendar pot ni prava.


Write a function called validUserNames that accepts an array of usernames (strings). It should return a new array, containing only usernames that are less than 10 characters. For example:
validUserNames(["mark", "staceysmom1978", "q29832128238983", "carrie98", "MoanaFan"])
// => ["mark", "carrie98", "MoanaFan"];



Sam sem to rešil na spodnji način, ki pa ni pravi, saj validUserNames ni funkcija. Če prav razumem, bi moral biti array na začetku prazen, potem pa bi s funckijo notri dodajal vrednosti in jih med tem tudi filtriral. Nato bi ustravil nov array s temi filtriranimi rezultati.

const userNames = ["mark", "staceysmom1978", "q29832128238983", "carrie98", "MoanaFan"];

const validUserNames = userNames.filter(names => {
    return names.length < 10;
})

console.log(validUserNames)


Hvala za pomoč že v naprej.

HotBurek ::

userNames = ["mark", "staceysmom1978", "q29832128238983", "carrie98", "MoanaFan"];

function validUserNames(users) {
	valid = [];
	for (i = 0; i < users.length; i++) {
		if (users[i].length < 10) {
			valid.push(users[i]);
		};
	};
	return valid;
};

console.log(validUserNames(userNames));
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Randomness ::

function validUserNames(userNames) {
    return userNames.filter(name => {
        return name.length < 10;
    })
}

zgublen376 ::

Zdravo,

spet bi potreboval nekaj pomoči, saj mi naloga ne in ne uspe.

Imam tale HTML, kjer bi bilo potrebno vsako črko spana prebarvati z barvo iz arraya colors. Sedaj so vse črne, potem pa bo "R" rdeč, "A" oranžen, "I" rumen itd.

<!DOCTYPE html>
<html>
<head>
    <title>Rainbow</title>
    <!--LEAVE THESE LINES ALONE, PLEASE! THEY MAKE THE LIVE PREVIEW WORK!-->
    <script src="node_modules/babel-polyfill/dist/polyfill.js" type="text/javascript"> </script>
    <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>

</head>

<body>
    <!--DON'T TOUCH THIS FILE PLEASE!-->
    <h1>
        <span>R</span>
        <span>A</span>
        <span>I</span>
        <span>N</span>
        <span>B</span>
        <span>O</span>
        <span>W</span>
    </h1>
</body>

</html>


Tole je pa JS koda:

const colors = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];


Najprej sem selectal vse spane:

const allSpans = document.querySelectorAll("span");


Nato sem loopal čez barve. Ne znam pa v to vrstico s komentarjem vstaviti ustrezen zapis. A bi moral uvesti še eno funkcijo in imam potem loop po i in j?
for (let i = 0; i < colors.length; i++) {
	allSpans.style.color = colors[i]);  // Tole me daje.
} 


Kakorkoli že, prosim za pomoč.

Hvala.

**Postopek pa naj bi šel na način, da izberem vse spane, iterateam čez njih in jim pripišem vrednosti iz arraya.

Zgodovina sprememb…

HotBurek ::

allSpans[i]

var colors = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];

var allSpans = document.querySelectorAll("span");

for (i = 0; i < colors.length; i++) {
	allSpans[i].style.color = colors[i];
};
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

zgublen376 ::

Hvala.

Se pa trudim že kar nekaj časa s podobno nalogo, kjer bi imel več "spanov", kot pa elementov v colors arrayu. Npr.:

<body>
    <!--DON'T TOUCH THIS FILE PLEASE!-->
    <h1>
        <span>R</span>
        <span>A</span>
        <span>I</span>
        <span>N</span>
        <span>B</span>
        <span>O</span>
        <span>W</span>
        <span>B</span>
        <span>O</span>
        <span>W</span>
    </h1>
</body>

</html>


Najprej sem poskusil z dodajanjem while, vendar gre tole samo do colors.length. Potrebujem nek loop, ki bo šel skozi dokler ne bo prišel do zadnjega allSpans elementa. Problem je, da iteratam preko colors in ne znam obrniti na allSpans. Verjetno bi se s kakšnim push tudi dalo?
V kateri smeri naj grem, da to rešim?

BBB ::

Sposodil sem si kodo od že ohlajenega bureka in jo prilagodil.

var colors = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];

var allSpans = document.querySelectorAll("span");

for (i = 0; i < allSpans.length; i++) {
	allSpans[i].style.color = colors[i % colors.length];
}

Iteriraš po elementih span, indeks barve pa izračunaš po modulu velikosti arraya barv. S tem dosežeš periodično ponavljanje barv.

HotBurek ::

Men % ni všeč, k mi ni takoj jasno... ;)

Pa uporaba podpičja... je lepa, če je. Če ni, je kot stavek, ki se konča brez pike

var colors = ['red', 'green', 'blue', 'yellow'];

var allSpans = document.querySelectorAll("span");

for (i=0; i < allSpans.length; i++) {
	j = i;
	while (j >= colors.length) {
		j = j - colors.length;
	};
	console.log(String(i) + " " + String(j));
	allSpans[i].style.color = colors[j];
};
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

BBB ::

HotBurek je izjavil:

Men % ni všeč, k mi ni takoj jasno... ;) ...

Morda se ne zavedaš, da pri zapisovanju zaporednih celoštevilskih števil zapisuješ števke (po domače cifre) na istem mestu (enice, desetice, stotice, tisočice) po mudulu 10. Ko je števka enaka 9, ji pri zaporednem štetju sledi števka 0 (v desetiškem sistemu nikoli ne preseže vrednosti 9). Števka se tako z naraščajočim številom periodično ponavlja.

V programskem jeziku je prednost uporabe modula v krajši kodi in hitrosti izvajanja. Ko boš modul večkrat uporabil, ti bo iz zapisa hitro jasen pomen.

HotBurek je izjavil:

...
j = i;
while (j >= colors.length) {
j = j - colors.length;
};
...
Zgornje je tvoja implementacija operacije modula (ostanek celoštevilskega deljenja i s colors.length, rezultat hrani j), tj.
j = i % colors.length
Zakaj ne bi namesto lastne implementacije preprosto uporabil operator "%"? Menda ne boš tudi za druge standardno podprte matematične operacije implementiral lastne rešitve (za vajo že, to razumem). Uporabljaj kar želiš. Drugim, ki se uvajajo, pa raje svetuj uporabo bolj učinkovite rešitve, da ne bodo pisali neučinkovite kode. Morda bom njihovo kodo laufal v svojem browserju, ki bo sicer komaj sopihal pod težo strani.

HotBurek ::

Ok, prvo da napišem. Ko sem prebral vprašanje uporabnika zgublen376, in potem videl spodaj odgovor, nisem bil pozoren, in sem mislil, da si je on sam odgovoril. Jst pa sem potem dgovor njemu. Šele potem sem videl, da si ti (BBB) podal odgovor.

Pol pa nisem brisal tistega o %-tu in podpičju...


Enivej. Pisat neko operacijo na roke mislim, da je gut, ker:
- tako "pokažeš" samemu sebi, da razumeš kaj procent del/naredi
- oz. da ga znaš sam na roke na pisat, če ge ni (dober, lahko da ma to vsak programski jezik, sam vseen...)

Sem en mal občutlijv na razna easy-click-and-point programiranja, ko je pa kakšen preprost problem za rešit, pa ne gre.


Zdej, da je moja primer "neučinkovit", se ne strinjam. Mislim, da je povsem pravilen in natančen.


Bi me pa zanimalo, če je rešitev z "while..." res počasnejša od tiste z "%"?
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

BBB ::

HotBurek je izjavil:

Bi me pa zanimalo, če je rešitev z "while..." res počasnejša od tiste z "%"?

Test pri meni pokaže precej enakovredno učinkovitost za vrednosti spremenljivk i in len, če prva ni velikokrat večja od druge - izvede se zelo malo iteracij zanke while. Ko je razmerje i/len veliko, je operator % veliko bolj učinkovit - preveri.

Vendar v danem primeru i ni veliko večji od len, torej tvoja implementacija modula za ta konkretni problem ni problematična.

HotBurek ::

Mal popravljeno, dela hitreje in se, ali približna ali pa tudi prehiti procent funkcijo. Odvisno od cifer... Recimo i=1000000, len=1000 jo prehiti. Ugibam, ker nima shranjenega stanja "k" in si ne more pomagat, kje je for loop.

Kolikor sem testiral, test ni vedno enak in so lahko odstopanja.

https://jsben.ch/JTNod

var colors = ['red', 'green', 'blue', 'yellow'];

var allSpans = document.querySelectorAll("span");

var k = 0;

for (i=0; i < allSpans.length; i++) {
	j = i;
	if (j > colors.length) {
		j = j - (colors.length * k);
	};
	if (j == colors.length) {
		j = 0;
		k = k + 1;
	};
	allSpans[i].style.color = colors[j];
};
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

showsover ::

Ja, uporaba % (ostanek) je ok pri takšnih ciklih; če res hočeš primerjati, kaj je hitreje, štopaj porabo časa v direktni zanki, kjer so meritve pomenljive (navadno gre za milijone ali milijarde iteracij, torej...). Ne pozabit, da rezultat 'n%x' cikla od 0 do (x-1) za pozitivne x... :-)

Arey ::

HotBurek je izjavil:


Enivej. Pisat neko operacijo na roke mislim, da je gut, ker:
- tako "pokažeš" samemu sebi, da razumeš kaj procent del/naredi
- oz. da ga znaš sam na roke na pisat, če ge ni (dober, lahko da ma to vsak programski jezik, sam vseen...)

Glede na to kakšne klobase od kode limaš po forumu tukaj bi se na tvojem mestu raje zamislil kaj znaš in česae se v resnici nočeš naučit. Modulo ni nek ezoteričen koncept v programiranju ampak je en izmed osnovnih matematičnih operacij ki jih imaš na voljo. Če misliš da je bolje namesto enega preprostega modula pisat svojo rešitev ki
a) objektivno ni enako hitra ker potrebuje več operacij
b) vnaša dodatno možnost napak v tvoji kodi
c) daje vtis kot da ne znaš uporabljat osnovnih konceptov v programiranju
pol ti res ni pomoči. Upam da tudi namesto množenja delaš loope in da vsako deljenje implementiraš sam.
Tudi da ne razumeš kateri del tvoje kode potrebuje več ciklov za izvajanje kot enostaven primer ki ga je podal uporabnik pred tabo nakazuje da ti stvari niso najbolj jasne. Pa ne bodi užaljen ker te nočem žalit, samo smešno se mi zdi da ti je uporaba "easy point and click" modula pod častjo, čeprav dosti bolj osnovno takega problema rešit ne gre.

HotBurek ::

Moj računalnik pravi, da koda ki sem jo spisal zgoraj (ta druga varianta), dela hitreje od ezoterične procent funckije.

Potestiraj in poročaj, kaj pravijo rezultati?

var colors = 1000000000;

var elements = 2000000000;

var k = 0;

//////////////////////////////////////////////////////////////////////////////////

var start = Date.now();

for (i=0; i < elements; i++) {
	j = i;
	if (j > colors) {
		j = j - (colors * k);
	};
	if (j == colors) {
		j = 0;
		k = k + 1;
	};
	//console.log("i=" + String(i) + " j=" + String(j) + " k=" + String(k));
};

var end = Date.now();

var diff = end - start;

console.log(start);
console.log(end);
console.log(diff);

//////////////////////////////////////////////////////////////////////////////////

var start = Date.now();

for (i=0; i < elements; i++) {
	j = i % colors;
	//console.log("i=" + String(i) + " j=" + String(j));
};

var end = Date.now();

var diff = end - start;

console.log(start);
console.log(end);
console.log(diff);

//////////////////////////////////////////////////////////////////////////////////

diff = ((diff1 / diff2) * 100).toFixed(2);

console.log(diff);


1607786001400
1607786009300
7900
1607786009300
1607786018600
9300
84.95
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

showsover ::

% sicer sploh ni ezoterična funkcija ampak je standarden c-like (c, c#, js, java, c++...) modulo operator, star blizu 50 let ali koliko (v samem c, jasno). Vsekakor uporabljaj svoj inkrementalno/multiplikativni pristop, , če je 'profit' 10-15% pri množicah ranga 1000000000 in 2000000000 elementov pomemben v tvojih kalkulacijah, navadno bodo sicer glavni problemi pri trajanju I/O operacij. V bistvu je tvoja analiza čisto na mestu, sploh, ker si verjetno v fazi učenja tehnologije same po sebi.

Klik

Zgodovina sprememb…

  • spremenilo: showsover ()

HotBurek ::

Zdejle sem med opravljanjem korakov razmišljal...

Ta funkcija, modulo operator. Ne vem, kako je dejansko narejena. Da bi videl sempl.


Enivej, "problem" te funkcije je, da si ne more pomagati s predhodnim stanjem (vrednost "k" v zgornjem primeru).

Eno, kar bi se dalo je, da:

korak 1 - funkicaj prebere desetiško vrednost, in jo shrani v binarni zapis (kar je verjetno že tako ali tako narejeno),
korak 2 - gre od leve proti desni po binarnem zapisu in najde prvo 1-ko.

Npr. če je binarni zapis številke vedno dolžine 8 bitov (oz. 1 bajt, opa opa) in se iz leve bere proti desni:
00001???

Se da iz tega določit, da je:
- najnižja cifra 8 (1000)
- najvišja cifra 15 (1111)

Se pravi, input cifra je v rangu:

00001000 =< ??? < 00010000
8 =< ??? < 16


In do 00010000 oz. 16 (lahko) prideš tako, da prvi bit, ki se prebere (pri branju iz leve proti desni), prestaviš za eno v levo, potem pa dodaš same 0.

(Zdej vidim, da bi lahko do zgornje cifre prišel tudi z množenjem spodnje cifre x2, se pravi 8x2=16.)


No, mogoče bi si potem iz tega, da gre npr. za ranga x-a (1000-1111), lahko pomagal pri implementacije hitrejše funkcijo.

Npr. x % y oz. 11 % 3, bi se lahko prvo pomikal po korakih dolžine 3 (0, 3, 6, ...) dokler ne prideš do ali črez 8, ter potem naprej da prideš do ali čez 15. Koraki bi potem bili (6, 9, 12, 15).


Če pa ni hitrejše, je pa lahko lepa domača naloga iz digitalnih sistemov in programiranja.
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

smacker ::

Štopaj x%n pri n=100 in n=128 in se čudi.

zgublen376 ::

Hvala za vse razlage. Tele na koncu so zame še malo prehude. :) Saj zadeva je logična potem, ko vidiš zapisano kodo. Verjetno se te to "prime" in pogosto uporabljaš take primere. Kot pa sem spraševal na začetku, pa mi ni jasna ta povezava for-while (sama koda mi je). Namreč v literaturi se vsepovsod omenja do-while. Se pravi, zanima me sama sintaksa, da se ne bom ubadal s tem, kam postaviti kakšen del kode.

showsover ::

Ja, HotBurek bi moral svoje optimizacije aritmetičnih operacij prenest v drugo temo.

for(;;) ima v osnovi tri dele (glede na podpičja), inicializacijo, pogojevanje in inkrementacijo, while() pa preverja samo pogoj (kakršenkoli že, lahko tudi v smislu for), for(;pogoj;) {} pa lahko uporabiš v smislu while(pogoj) {}...

To so res osnove od osnov, ki jih je potrebno osvojiti; pot je dolga ampak se začne s prvim korakom
Klik

Zgodovina sprememb…

  • spremenilo: showsover ()

HotBurek ::

Ok, nazaj na vprašanje.

Če je več "span" kot "color" elementov, potem je potrebno loop-at po "color" (ta daljšem).

Spodaj primer, kjer si lahko odkomentiraš/zakomentiraš spans; enkrat je krajši, drugič dalši od colors.

Program v if preveri, kater je dalši (če je enaka dolžina, gre v while).

Ter različna primera; prvi z for zanko, drugi z while.

var colors = ["a", "b", "c", "d", "e", "f"];

// foor loop
var spans = ["1", "2", "3", "4"];

// while loop
//var spans = ["1", "2", "3", "4", "5", "6", "7", "8"];
//var spans = ["1", "2", "3", "4", "5", "6"];


if (colors.length > spans.length) {
	console.log("for loop");
	for (i = 0; i < colors.length; i++) {
		color = colors[i];
		span = spans[i % spans.length];
		console.log(String(color) + " " + String(span));
	};		
}
else {
	console.log("while loop");
	i = 0;
	while (i < spans.length) {
		color = colors[i % colors.length];
		span = spans[i];
		console.log(String(color) + " " + String(span));
		i = i + 1;
	};
};
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

zgublen376 ::

Hm....zadnje dni me matra tale querySelector oz. querySelectorAll. Težava je s izbiro več classov. To sicer lahko naredim, vendar mi potem ne deluje classList in javlja error za Add.

<ul>
        <li>Hello</li>
        <li class="highlight">Hello</li>
        <li>Hello</li>
        <li>Hello</li>
        <li class="highlight">Hello</li>
        <li>Hello</li>
    </ul>


Recimo s temle deluje samo za 1. li.

const h1  = document.querySelector("li");
//console.log("h1");

h1.classList.add("novo");


css zamenja barvo ozadja in nič ekstra. Če spremenim na All, potem dobim error.

Naloga je sicer taka, da bi moral li-je brez classa spremeniti v barvo ostalih dveh in obratno. To je toggle funkcija, zanima pa me tole zgornje.

Tole je sicer del kode, vendar ker nič ne dela, nič ne morem testirati.
const allHighlighted = document.querySelectorAll(".highlight")
console.log(allHighlighted);


for (let i = 0; i < allHighlighted.length; i++){
	allHighlighted.classList.add("novo")
}

mr_chai ::

V najbolj gayevskem glasu možnem: "Oh maj gad! A lahk bruhnem...ta žavaskript je bedn"

Tko se tole rešuje, v pravih modernih jezikih:

(def colors ["red" "orange" "blue" "indigo" "cyan"])

(defn span [char color]
  [:span {:style {:color color}} char])

(defn html []
  [:body
   (doall
    (mapv span "RAINBOW" (cycle colors)))])

HotBurek ::

var list = document.getElementsByTagName("li");

for (i = 0; i < list.length; i++) {
	classes = list[i].classList;
	if (classes.length > 0) {
		for (j = 0; j < classes.length; j++) {
			list[i].classList.remove(classes[j]);
		};
	}
	else {
		list[i].classList.add("highlight");
	};
};
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

zgublen376 ::

Hm...ok. pa sem bral, da je getElementsBy zastarela varianta in da je querySelection boljša.

Drugače so pa tole ene in iste fore. Ali je kasneje tudi tako?

Moral bi pa s toggle, čeprav tole tudi reši.

Zgodovina sprememb…

HotBurek ::

Oboje dela.

V allHighlighted se shrani array. In potem moraš it po elementih (to si imel prav z for loop-om), ter jih pravilno naslavljat z allHighlighted[index] (tega pa ti nisi imel).

Not good:
allHighlighted.classList.add("novo")

Good:
allHighlighted[index].classList.add("novo")


//var list = document.getElementsByTagName("li");
var list = document.querySelectorAll("li");
root@debian:/# iptraf-ng
fatal: This program requires a screen size of at least 80 columns by 24 lines
Please resize your window

Zgodovina sprememb…

  • spremenilo: HotBurek ()

BBB ::

let list = document.querySelectorAll("li");

for (let i = 0; i < list.length; i++) {
    list[i].classList.toggle("highlight");
}


Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
»

[JavaScript] Objects

Oddelek: Programiranje
172536 (1998) noraguta
»

[js] json kompresija

Oddelek: Programiranje
223489 (2838) infiniteLoop
»

[jquery] .append

Oddelek: Programiranje
21867 (694) korenje3
»

while in for odštevanje - kot rezultat upošteva tudi izhodiščno vrednost

Oddelek: Programiranje
181976 (1699) slitkx
»

[Javascript] Reindex Array

Oddelek: Programiranje
9705 (576) kogledom

Več podobnih tem