Mitgard
Java Script
Czyli, czy da się programować na telefonie?

Parę słów wstępu, koniecznych by wytłumaczyć czym jest ta strona. W 2020r. poraz pierwszy liznołem na poważnie programowanie, w efekcie czego powstała ta strona.

Po miesiącu prac i przerobieniu całego html-a i części css, odpuściłem sobie na jakiś czas programowanie, by po kolejnymmiesiącu tu wrucić, tym razem miałem spalony laptop i dlatego zacząłem programować na telefonie, brzmi kuriozalnie, ale taka jest właśnie geneza powstania tej strony, z racji, że miałem poważne problemy z czasem ładowania tej strony na tel należy ją czytać od dołu do gury nowe funkcje umieszczałem na samej górze by nie musieć przewijać przy każdej poprawce na sam dół.

Wszystkich funkcji zawartych na tej stronie uczyłem się z stronny w3school, która raczej ma tylko nakierowywać na sam sens funkcji a nie służyć przykładami, jakichś ciekawych projektów programistycznych, dlatego nauki z jaką mamy tu doczynienia ostatecznie nie polecam.

Ale z racji, że blog na tej stronie stał się śmietnikiem do którego wrzucam wszystkie swoje testowe strony, to oczywiście tej również nie mogło tutaj zabraknąć.






Pierwszym projektem będzie przelicznik walut, w poniższym polu wpisz kwotę jaką chciałbyś przeliczyć na z eur na złotówki po kursie z dnia 26.01 poczym kliknij przelicz, a poniżej pojawi się wynik tego równania.

Kurs 4,54zł/eur


No dobra ja jakiś głupi jestem, nawet tak prostej funkcji nie jestem wstanie zaprogramować, poklikałem ile potrałiłem coś tam nawet wyskakiwało najpierw błędny wynik a potem Nan ale potem już nawet to przestało działać dziwne.



Chyba jakiś tydzień przerwy od JS sobie zrobiłem, ale spokojnie już wruciłem, teraz będę się starał poświęcać czas 1:1 etutor i programowanie, zobaczymi jak mi pójdzie, no i raczej teraz będę programował jakieś praktyczne elementy a nie tylko się uczył elementów, dzięki czemu nauka nie będzie taka nudna i monotonna.


Funkcja toExponential(), w JS słóży do zaokrąglania liczb niewymiernych, w nawias wpisujemy ilość miejsc po przecinku które nas interesują.


Prymitywne liczby takie jak (3.4 lub 2020) nie mogą mieć właściwości i metod, ponieważ nie są objektami

Jednak w przypadku języka JavaScript metody i właściwości są również dostępne dla wartości pierwotnych, ponieważ JavaScript traktuje wartości pierwotne jako obiekty podczas wykonywania metod i właściwości

toString() zwraca liczbę jako string:


var x = 123;

x.toString();// returns 123 from variable x

(123).toString();// returns 123 from literal 123

(100 + 23).toString(); // returns 123 from expression 100 + 23

Wyniki:


Metody liczbowe JS


Liczby w JS normalnie na początku są prymitywnymi wartościami tworzonymi z liter, ale za pomocą funkcji new mogą stać się obiektami

var a141 =123;

var a142 = new Number(123);

Tworzenie liczb jako objektów, spowalnia wykonywanie działania, przez program. Oraz może powodować, niespodziewane rezultaty, działania programu don't do it.

Przy użyciu funkcji == program podaje że liczba object i liczba liczba są równe sobie, (czytaj takie same.)

123 == new Number(123) ?


Liczy Szesnastkowe 0x

Metoda toString() może zwracać, liczby od 2 do 36, cokolwiek miało by to znaczyć.


JavaScript zapisuje wszystkie liczby w systemie 16-stkowym za pomocą funkcji 0x

var = 0xFF; Wynikiem takiej funkcji jest ten numer:

Truchę tego nie rozumiem więc poprostu przekleję tłumaczenie angielskiej strony, do późniejszej analizy

Nigdy nie pisz liczby z zerem wiodącym (np. 07).Niektóre wersje JavaScript interpretują liczby jako ósemkowe, jeśli są zapisane z zerem wiodącym.Domyślnie JavaScript wyświetla liczby jako dziesiętne dziesiętne przy podstawie podstawy .Ale możesz użyć tej toString()metody, aby wyprowadzić liczby od podstawy 2 do podstawy 36 .Szesnastkowy to podstawa 16 . Liczba dziesiętna to podstawa 10 . Ósemkowy ma podstawę 8 . Binarny to podstawa 2 .


funkcja infinity pojawia się jako informacja zwrotna, gdy nasza liczba, wykracza poza skale możliwie wielkich liczb w JS. W przykładzie poniżej uruchomiłem funkcję potęgującą w nieskączoność 2*2 i wynik razy 2, oto rezultat.

Przy okazji dzielenie przez zero też daje wynik Infinity.

var = 2 / 0;

var = -2 / 0;

Czy kiedykolwiek zadawałeś sobie pytanie, czy nieskończoność, jest liczbą? Sprawdźmy to.

var = typeof Infinity;

Zgadza się, powyższy wynik informuje o tym, że wedłóg funkcji typeof Infinity to numer, hurra.


Możesz użyć globalnej funkcji isNaN() by sprawdzić czy dana wartość var jest NaN-em czy nim nie jest


Wartość NaN dosłownie się tłumaczy jako "not a number" pojawia się gdy w wyniku działania otrzymuje liczbę którą podzieliliśmy przez słowo, lub tym podobnych sytuacjach.


Ciekawa sztuczka

var x = "100";

var y = "10";

var z = x / y;

w efekcie da prawdziwy wynik, mimo, że wartości x i y są zapisane jako tekst a nie liczy. Poniżej umieściłem prawdziwy wynik takiego działania:

Tak samo zachowa się wynik działania, jeśli na ten przykład zamiast / podstawimy znak dodawania, odejmowania mnożenie. Poprostu taki zapis gwaratuje nam potraktowanie liczb o właściwościach tekstu jako liczb.


Zaczęło mnie poważnie denerwować, że display rozwija, ale nie zwija swojej funkcji, dlatego zqmiast przerabiać kolejne elementy związane z JS, w tym przykładzie zamoerzam stworzyć okienko do rozwijania i zwijania tekstu.

Teraz małe ogłoszenie parafialne, jeśli chciałbym powielić tą funkcję. to nie muszę przepisywać caałego kodu wystarczy się podpiąć pod już istniejącą funkcję. Tak ona wygląda:

I zamiast a108 wprowadzić swoją własną nazwę funkcji.


Jak widać, jest problem z poprawnym dodaniem, licz po przecinku, zastanówmy się, jak można rozwiązać ten problem

Zwykłe dodanie liczb po przecinku nie działa, ale pomnożenie ich i podzielenie, naprawia ten problem.


wynikiem działania var x = 0.2 - 0.1; będzie błędny poniżej wynik:


JS zapisuje liczby w systemie 64-bitowym, w przeciwieństwie do innych programów z tego powodu dokładność lizb jest do 15 numeru liczby przykłady:

Bardzo duże liczby mogą być zapisywane z wykładnikiem potęgowym, przykłady:

var x = 123e5 // wynik: 12300000

var x = 123e-5 // wynik: 0,00123

var x = 999999999999999; będzie 999999999999999

var x = 9999999999999999; będzie 10000000000000000


Java ma tylko dwa typy licz:

całkowite

var x = 3

nie całkowite

var x = 3.14


Java Script Numbers


Chciałbym naprawdę w tym miejscu powiedzieć, że to już jest apsolutny koniec tematu string-sów w javascrip, ale to była by naiwność, owszem właśnie skończyłem przerabiać całą stronę poświęconej tym funkcjom na w3school ale pod tym linkiem wciąż na mnie czeka sporo dodatkowej treści. Arturze z przyszłości, gdybyś był wciąż zainteresowany, tym tematem proszę zerknij do powyższego linka.


I na sam koniec kursu dowalili mi jedyne działanie jakiego nie przeprowadziłem więc przerobię je teraz.

Okej cała magia polega na tym, że indexOf normaliedziała w ten sposób że wycina z ciągu element w przedziale, ale nie przerobiłem wycinania pojedyńczego symbolu. więc zróbmy to teraz. Mamy sohie słowo Samochud i by dowiedzieć się która to litera z rządu, to znaczy litera "u" należy użyć funkcji indexOf("h") poniżej widać efekt:


Istnieją 3 metody ekstrahowania elementów ciągu:

  1. charAt()
  2. charCodeAt()
  3. Property access[]

Funkcja chartAt() zwraca określony numer znaku funkcji. Przykłd:(0) pierwsza litera (7) ósma litera (20) dwudziesta pierwsza litera

Natomiast funkcja charCodeAt() zwraca numer unicodu w standardzie utf-16, czyli bez polskich znaków.

I na sam koniec trzecia funkcja access. Ta funkcja posiada te same właściwości, co charAt, jednak może być trochę nieobliczalna w kodzie.

By korzystać z ciągu jak z array trzeba przekonwertować ciąg na array. Let's do it

Jeśli jako separator w powyższej funkcji zostanie użyty "" ten symbol wtedy wynikiem będzie podzielenie całego zdania na pojedyńcze litery, sprawdźmy jak wygląda ten śmieszny efekt.

Prawda, że wyszło piękniexD

Akurat w tym przykładzie kod jest dość mocno zagmatwany więc radzę dokładnie się zapoznać z wyglądem kodu, przed przystąpieniem do implementacji jego w innym miejscu.


Coś ostatnio, często ten program przestaje działać wedłóg mojego planu muszę przeklejać funkcje i zmieniać id pomimo tego że sprawdzam je po 10 razy i są bezbłędne to i tak nie działają, nie ogarniam.


Funkcje padStart i padEnd, bodajze mają za zadanie dodawanie ciągu np. licz do wartości var np. słowa. Spraqdźmy to w praktyce za pomocą poniższego przykładu:



Funkcja trim() usuwa spacje z lewej i z prawrj strony tekstu (Boże kto wymyśla takie porąbane funkcje)


funkcja trim() nie jest obsułgiwania przez internet explorer 8 i niższe, żeby użyć w tej przeklądarce tą funkcje należy użyć wyrażeń regularnych, ale o tym nie będę się rozpisywał, bo nie zamierzem swoich stron tworzyć pod IE.


Funkcja concat służy do łączenie wielu słów w jedno zdanie.

Przykład poniżej:

Funkcja concat może być zapisana w ten sposób var text = "słowo" + "słowo" lub w ten sposób var text = text1.concat(text2,text3…). Obie metody dają taki sam efekt


Funkcja toLowerCase zmniejsza wielkość liter.

MAŁY PENIS


Funkcja toUpperCase zmienia małe litery na duże

duży penis


Aby globalnie, zmienić wszystkie użyte takie same słowa, należy użyć funkcji/g

Jacek poszedł po przedszkola, a wprzedszkolu mówi Jola - Jacek chuj ci w dupe.


By zamienić słowo bez rozróżniania wielkości liter należy użyć funkcji /i.

Kasztanowy strach na wróble


replace

Zapomocą funkcji replace, można wyciąć z zdania jakieś słowo i zamiast niego wkleić jakieś inne słowo.

Poznałem twoją matkę.


Zarówno przy pojedynczym koordynacie (7) jak i przy ujemnym koordynacie (-7) wynik działania będzie w slice i substring taki sam.

W poniższym przykładzie z zdania "ile słów trzeba powiedzieć by było wszystko jasne" wyciąłem pogrubiony tekst i wkleiłem poniżej za pomocą koordynatów (27,34)


Substring to podobna funkcja do slice, z jedną różnicą, w postaci, nie możności użycia ujemnego literału.

W poniższym przykładzie wyciągłem słowo "Ruchałem" z zdania "Ruchałem ci matkę". za pomocą przedziału w funkcji substring(0, 8).


w tym przykładzie funkcja slice. wybiera z zdania "Moja racja jest mojsza niż twojsza." ciąg (-18, -8) w efekcie otrzymujemy poniższy ciąg:


Poraz pierwszy udało mi się opublikować swoją stronę w internecie w końcu fizycznie mogą na nią wbić, generalnie całość nie powola ale działa link. Myślałem też nad publikacją mitgardu ale całość pewnie by mi się nawet nie zmieściła na tej darmowej stronie hostingowej, tak czy siak jestem zadowolony, bo poprzednią nie udało mi się upublicznić swojego projektu, poza githubem.


Funkcja slice wycina element ciągu i w kleja go w inny ciąg.

W tym przykładzie z zdania "twoja stara zapierdala" za pomocą funkcji slice wyciąłem słowo "zapierdala" i wyświetliłem poniżej.

A jeśli wstawisz tylko jedną liczbę do slice() to funkcja skopiuje wszystko znajdujące się za liczbą np.6 przykład poniżej

Lub w drugą stronę dodajemy "-" w przykładzie poniżej użyłem -6. W takim przypadku jako wynik jest wstawiane 6 ostatnich symboli ciągu.

Przy okazji też odkryłem, że id coś tam musi być nad scryptem a nie pod bo inaczej to id nie zostanie znalezione przez scrypt.


Są trzy metody ekstraktowania elementów z ciągu


slice(start, end)
substring(start, end)
substr(start, length)

głównie polegają na opisaniu od którego do którego znaku ma wyciągnąć słowo.


Na tej stronie link jest to lepiej opisanie, ja jedynie staram się streścić cały temat, funkcji wyszukujących argumenty w ciągu.


Istnieje także funkcja search() za jej pomocą można dokładniej określiś jakiego obiektu szukamy

Metoda search () nie może przyjąć drugiego argumentu pozycji początkowej.
Metoda indexOf () nie może przyjmować zaawansowanych wartości wyszukiwania (wyrażeń regularnych).

W zdaniu "koktajle mleczne świecą słonecznym blaskiem". Szuka słowa "świecą" za pomocą funkcji search.

Wynik

Ciekawostka, jeśli jesteś zainteresowany tym czy wynik się nie myli, skopiuj zdanie od pierwszej litery do pierwszej litery słowa "świecą" i przeklej do zaprogramowanego wcześniej programu liczącego ilość znaków w zdaniu, i nie zapomnij odjąć -1 funkcja zaczyna liczyć od 0 a nie od 1


Istnieje też, bliźniacza funkcja lastIndexOf() która w przeciwieństwie do indexOf, szuka słowa od tyłu do przodu(po arabsku). W sumie aż tak dobrze to nie wygląda najwyraźniej jednak liczy od początku są dwa słowa klucze jedno na początku zdania drugie na końcu nawet jeśli każę nie liczyć większej pierwszej połowy to nadal odpowiedź pada na pierwsze słowo dopiero gdy zakres


w funkcji indexOf("something", 15) wartość 15 infermuje program od której posycji mq zacząć liczenie, ale i tak wynik działania wyniesie ilość łącznych symboli pomiędzy początkiem ciągu aż do szukanej frazy (w tym 15 symboli które miała ta funkcja pominąć.) jedyną różnicą jest to że jeżeli funkcja ma pominąć 15 znaków i w nich jest schowane szukane słowa funkcja nas poinformuje, że nie znalazła szukanego słowa/klucza.


Okej postarajmy się nieco roższeżyć przykładowe użycie poprzedniej funkcji w tym przykładzie. Poniżej masz słowa które tworzą ciąg array. Wpisz w pustym oknie jedno z poniższych słów, by zażądać wyświetlenia jego numer w ciągu.

kuropatwy spacerują goha po polu

Generalnie eksperymęt trochę się nie udał, poświęciłem na niego godzinię i niestety nie znalazłem metody na przeklenie do nawiasów w funkcji indexOf() żądanego słowa więc jedyną możliwością na obecną chwilę jest ręczne wypełnienie tego polo w kodzie źrudłowym.


"indexOf()" to funkcja wyszukująca numer symbolu w kodzie w której się znajduje, słowo które umieściliśmy w nawiasie, funkcja liczy pierwszy symbol kodu jako 0 a nie jako 1, więc 22-gi symbol kodu zostanie zapisany jako 21 symbol kodu. Natomiast jeśli podane słowo nie zostanie odnalezione zostanie wyświetlony symbol -1. ta funkcja ma dobre zastosowanie w wyszukiwaniu nuemerów w funkcj arryay czyli funkcji: tabeli lub ciągu, tłumacząc na polski.


Podobnie jak w poprzednimi przykładzie z datami kliknij na sprawdź by dowiedzieć się jaki mamy dzień.


Wpisz w poniższe pole słowo, a potem przycisk sprawdź, by program obliczył za ciebie ilość znaków w tym zdaniu.

Samemu mi się nie chce wierzyć, ale tak, właśnie poraz pierwszy, samodzielnie stworzyłem funkcje js która reaguje na użytkownika, a nie jedynie biernie informuje, za pomocą tekstu, co się dzieje w jej bebechach.


Funkcja sln, sprawdza ile symboli zawiera się w wartości argumentu.


zadanie : Przybieżeli do Betlejem pasterze ma Znaków.


poniżej mamy doczynienia z mało spektakularnym jednak nowym użyciem funkcji object, by zrozumieć jak wyświetliłem ten tekst, zerknij do kodu.


Zmienne zadeklarowane funkcji JavaScript stają się LOKALNE dla funkcji. Dostęp do zmiennych lokalnych można uzyskać tylko z poziomu funkcji. Ponieważ identyfikator poza funkcją nie jest rozpoznawany, można go użyć w kilku innych funkcjach naraz.


Funkcja "function" ma zastosowanie przy wielokrotnym powtarzaniu tego samego równia, dzięki niej wystarczy, że podstawimy pod równie jedną liczbę a w efekvie dostaniemy wynik całego równia, oto przykłady:


Arrays, czyli tabele, lub ciągi, pomagają grupować wartości i przypisywać im numery, zerknij do kodu, by sprawdzić jak to działa.


Generalnie praca z JS jest specyficzna większość pracy jest widoczna w kodzie strony na tomiast na stronie widać pojedyńczy numer który jest efektem kilkunastu linijek kodu w JS, dlatego zachęcam do zaglądania do kodu


Tak samo w tym przypadku, mnożenia zq pomocą funkcji, wytłumaczenie tego słowami bez kodu jest ciężkie więc, zerknij do kodu by dowiedzieć się dlaczego jest widoczny ponniższy wynik


Komenda typeof wyświetla informacja na temat tego z jakiego typu daną mamy do czynienia do wyboru mamy poniższe:


Program czytając pierwszy znak zapisyny jako text a nie działanie matematyczne, przypisuje pozostałym literom funkcje textu. Sprawdźmy co się stanie jeśli odwrucimy kolejność zapisując var xx = 6 + 7 + "5"


Ciekawy efekt powstaje po napisaniu var x = "5" + 6+ 7;


do var można dodawać nie tylko liczby ale też słowa


W tym przykładzie zaprezentuje jak wstawić br pomiędzy dwie funkcje html-a





W JS nie ma komęd dotyczących urządzeń zewnętrzych, jedynym wyjątkiem jest zrzut ekranu. (tłumaczone by my self from w3school), niesty do funkcja nie działa w tej aplikacji


Kliknij na małą ikonkę śrubokręta i zebatki by otworzyć konsolę


Zmiana zdania w html za pomocą JS

Co jest sensem życia?

JS może ukryć elementy Html

JS może pokazać ukryty elementy Html






A jeszcze poniżej mam mały test w którym słowu test, jest przypisywana funkacja 5+6. W efekcie po napisaniu test widzimy wynik równania.





Z poniższego efektu chyba jestem najbardziej zadowolony, po kliknięciu inputa zwiększ liczba powyżej się zwiększa, co już powoli zbliża mnie do stworzenia klikadła



Many


Tura: