Untitled
unknown
javascript
3 years ago
4.6 kB
8
Indexable
// OBIEKTY
// Zmienna -> to opakowanie na jakas wartosc
// Dotychczas poznaliśmy podstawowe rodzaje zmiennych czyli ogólnie -> tekstowe/liczbowe
// Od dzisiaj nauczymy się tworzyc bardziej rozbudowane rodzaje zmiennych
// Obiekty to takie zmienne które posiadaja właściwości
// Jak stworzyc obiekt w JavaScript?
// var przykładowyObiekt = {wlasciwosc: wartosc, wlasciwosc: wartosc, ... }
// Przykałd obiekt pokoj
var mojPokoj = {
czyJestLozko: true,
czyJestBiurko: true,
czyJestOkno: true,
};
// Przyklad obiekt samochod
var mojSamochod = {
marka: "Fiat",
model: "Maluch",
czyMaHamulec: false,
pojemnoscSilnika: 1.2,
czyMaTurbo: false,
};
// Jak uzyskac jakas wlasciwosc/wartosc z obiektu? -> po '.' na koncu nazwy obiektu
// Np. Wypisz samochod w konsoli
console.log(mojSamochod);
// Stworz obiekt osoby z wlasciwosciami jak: imie, nazwisko, rokUrodzenia, czyMaPrawoJazdy, czyLubiPodrozowac, ulubionaPotrawa.
var osoba = {
// klucz: wartosc
imie : "Michal",
nazwisko: "Giza",
rokUrodzenia: 1997,
czyMaPrawoJazdy: true,
ulubionaPotrawa: "Pizza",
czyLubiPodrozowac: true,
// przyklad funkcji w obiekcie
obliczWiek: function(rokUrodzenia){
return 2022 - this.rokUrodzenia;
},
// Napisz funkcje ktora powita osobe -> console.log("WITAJ " + this.imie);
powitanie: function(){
console.log("CZESC! JESTEM " + this.imie + ". Mam " + this.obliczWiek(this.rokUrodzenia) + " lat.");
}
}
console.log(osoba.powitanie());
/*
Pewne osoby chcą porównać swoje BMI. Przedstaw te osoby jako obiekty, każdy
niech zawiera imię, wagę, oraz wzrost,bmi.
Następnie dodaj metodę to każdego obiektu która policzy BMI oraz zwróci ją z
metody.
Na końcu wyświetl która z osób ma większe BMI
*/
// BMI kg*m^2 --> np. wzrost = 170cm / masa = 65kg ----> 65 / (1.7 * 1.7) = BMI
// 1. Stworz obiekty osob np 3 z funkcja bmi i imie,wzrost,waga
var franek = {
imie: "Franek",
wzrost: 1.70,
waga: 65,
obliczBMI: function(){
var bmi = this.waga / (this.wzrost * this.wzrost);
return bmi.toFixed(2); // toFixed(2) --> Zaokrągla liczbe do 2 miejsc po przecinku
},
};
var dzbanek = {
imie: "Dzbanek",
wzrost: 1.95,
waga: 120,
obliczBMI: function(){
var bmi = this.waga / (this.wzrost * this.wzrost);
return bmi.toFixed(2); // toFixed(2) --> Zaokrągla liczbe do 2 miejsc po przecinku
}
}
var janek = {
imie: "Janek",
wzrost: 2.05,
waga: 90,
obliczBMI: function(){
var bmi = this.waga / (this.wzrost * this.wzrost);
return bmi.toFixed(2); // toFixed(2) --> Zaokrągla liczbe do 2 miejsc po przecinku
}
}
// 2. Porownaj bmi i napisz wynik w konsoli
var osoby = [franek,janek,dzbanek]; // Przechowuje osoby w tablicy
// zmienne pomocnicze
var imieMaxBMI = "";
var maxBMI = 0;
for(var i = 0; i < osoby.length; i++){
// 2. zapisac i sprawdzic nowe najwieksze bmi
if(maxBMI > osoby[i].obliczBMI()){
// max BMI jest wieksze od nowego
}else{
maxBMI = osoby[i].obliczBMI();
imieMaxBMI = osoby[i].imie;
}
}
console.log("Najwieksze BMI ma " + imieMaxBMI + " i wynosi ono " + maxBMI);
/*
Rozglądnij się po pokoju/sali gdzie aktualnie jesteś. Wybierz jeden z otaczających
Cię obiektów np: krzesło, tablica, komputer, drukarka, pianino itp. Stwórz obiekt do
którego dodasz 5 właściwości opisujących go. Dodaj do obiektu metodę info(),
której zadaniem będzie wyświetlanie danych o obiekcie.
*/
// 1. Stworzyc obiekt z 5 wlasciwosciami
// 1.1 Stworzyc w obiekcie wlasciwosc: funkcje która wypisze informacje w konsoli
// 2. Wywołaj funkcje info() z nazwaObiektu -> nazwaObiektu.info();
// WSTEP DO "DOM" I OBIEKTOW STRON INTERNETOWYCH
function demoDOM(){
var linki = [link1, link2, link3];
// Wyszukaj div o id = box i dodaj do niego obrazek
for(var i = 0; i < linki.length; i++){
document.getElementById('box').innerHTML = '<img src="' + linki[i]+'"/>';
setTimeout(demoDOM,2000) // ustawia przerwe na 2s = 2000ms
}
}
var link1 = "https://static2-viaggi.corriereobjects.it/wp-content/uploads/2015/06/sardegna-CapoTesta-getty-e1591622358695.jpg?v=133006";
var link2 = "https://www.italiadascoprire.net/sardegna/wp-content/uploads/sites/16/sardegna.jpg";
var link3 = "https://siviaggia.it/wp-content/uploads/sites/2/2022/07/Cala-Biriola.jpg?w=786&strip=all&quality=90";
document.getElementById('box').innerHTML = '<img src="' + link1+'"/>';
document.getElementById('box').innerHTML = '<img src="' + link2+'"/>';
document.getElementById('box').innerHTML = '<img src="' + link3+'"/>';
Editor is loading...