Lekcja marzec 2018
W trakcie tej lekcji nauczysz się: Stosować zmienne i operatory: =, +, -, *, /. Odczytywać atrybuty elementu canvas. Publikować efekty swojej pracy.- URL:
- https://canvas-2d.blogspot.com/2018/03/wyrazenia.html
- Autor:
- Radosław Kowaluk
Copyright © 2018 Obowiązują zasady odpowiedzialności karnej, znaków towarowych i zasad W3C.
Wykład
Wyrażenia języka programowania składa się z operatorów, nazw zmiennych (identyfikatorów) i wartości różnego typu. Na poprzedniej lekcji poznaliśmy już operator podstawiania (=
).Operator jest funkcją, która najczęściej posiada symbol (są wyjątki). Zwraca wartość na podstawie argumentów.
Operator plus +
Operator +
oznacza w języku JavaScript dodawanie jeśli argumentami są liczby.Zanalizujmy aktywnie przykłady.
W przykładzie zastosowano operator plus
Przetestuj przykład zmieniając kod w lewym prostokącie.
Jeśli jednym z argumentów jest łańcuch operator +
w sumie.Przetestuj przykład zmieniając kod w lewym prostokącie.
+
będzie łączył ciągi znaków. Wcześniej nastąpi konwersja liczby na łańcuch.
W przykładzie zastosowano operator plus
Zmień wartość zmiennej
+
w konatenacji.Zmień wartość zmiennej
k
. Usuń znaki ""
w kodzie "204"
.
Podsumowując, możemy przyjąć następujące definicje.
+
- Operator ECMAScript, dodawanie lub konkatenacja.
Operatory -, *, /
Do operatorów arytmetycznych zaliczamy funkcje sumy, różnicy, iloczynu i ilorazu.-
- Operator ECMAScript, odejmowanie lub liczba przeciwna.
*
- Operator ECMAScript, mnożenie.
/
- Operator ECMAScript, dzielenie.
W przykładzie zastosowano operator
Zmień wartość zmiennej
*
.Zmień wartość zmiennej
s
.
W przykładzie zastosowano operator
Zmień wartość zmiennych a, b
-
.Zmień wartość zmiennych a, b
W przykładzie zastosowano operator
Zmień wartość zmiennej
/
.Zmień wartość zmiennej
s
.
Szerokość i wysokość obrazu
width
- Atrybut HTML, szerokość elementu canvas.
height
- Atrybut HTML, wysokość elementu canvas.
nazwa_zmiennej.width
(analogicznie nazwa_zmiennej.height
), gdzie nazwa zmiennej
jest identyfikatorem elementu canvas
.
Przykład zastosowania zmiennych i operatorów.
Zmień wielkość grafiki i wartości zmiennych: s.
Innym sposobem odczytu jest odwołanie w postaci Zmień wielkość grafiki i wartości zmiennych: s.
nazwa_zmiennej.canvas.width
(analogicznie nazwa_zmiennej.canvas.height
), gdzie nazwa zmiennej
jest identyfikatorem kontekstu canvas
.
Przykład zastosowania zmiennych i operatorów.
Zmień wielkość grafiki i wartości zmiennych: a, x, y, s.
Zmień wielkość grafiki i wartości zmiennych: a, x, y, s.
Ćwiczenia
- Wykonaj lekcje 6-10 z kursu Kodujący Stwór (Operatory i przypisanie, Więcej operatorów, Zastosowanie operatorów, Nietypowe dodawanie, Quiz: Zmienne, operatory i kolory)
Zadania
- Utwórz stronę internetową zawierającą element canvas o dowolnym rozmiarze, zawierający tło i kompozycję kolorowych prostokątów. Użyj wyrażeń tak, aby grafika była skalowalna.