Tečaj E − Funkcije 2 − Funkcije za digitalnog ljubimca

U ovoj ćeš se lekciji upoznati s pojmom funkcija.

Starosna dob 9+
65+ minute
JavaScript Blocks

Uvod

Ako si zaboravio što su funkcije i trebaš podsjetnik, molimo ponovno pogledaj uvod u lekciji 'A SIMPLE FUNCTION FOR A SUPERHERO' ('Jednostavna funkcija za superjunaka'). Ovo je bila prva lekcija u ovim serijama o funkcijama.

Ova je lekcija nadograđena na 'A SIMPLE FUNCTION FOR A SUPERHERO' na dva načina.

Prvo, ponavlja se važnost upotrebe funkcija za organiziranje kôda. Funkcije nam omogućuju da organiziramo kôd na logične načine. Možemo urediti kôd tako da lakše "vidimo" objekte u stvarnom svijetu koje želimo simulirati. Ovdje se to ponovno demonstrira putem radnji za izradu ljubimca.

Drugo, nadograđujemo na prethodno predstavljene koristi ponovne upotrebe kôda. Funkcije nam omogućuju jednostavnu ponovnu upotrebu kôda. U ovoj su lekciji učenici malo više izloženi izazovu vezanom za ovaj pojam. Od njih se traži da prepoznaju koji bi dio kôda najbolje odgovarao funkciji. To je opisano u Izazovu 3.

Naše micro:bit lekcije prilagođene su za primjenu znanja dobivenih iz Code.org osnova računalne znanosti (Code.org CS Fundamentals). Prije nego što učenici počnu s ovom lekcijom, potičemo ih da, kao preduvjet, prvo završe sve gradivo iz Osnova računalne znanosti. Učenici bi trebali biti upoznati s funkcijama iz Code.org osnova računalne znanosti.

Osnova

Prerequisite Experience Starting Point
Course E. CS Fundamentals. Tečaj počinje kratkim pregledom pojmova koji su prethodno podučavanii u tečajevima C i D. Učenici će vježbati kodiranje pomoću algoritama, petlji, kondicionala, stanja i funkcija.
Tečaj E − A Simple Function for a Superhero (Jednostavna funkcija za superjunaka)

Nastavniku se izrazito preporučuje da pročita donji tekst i završi sljedeće:

Vodič za brzi start namijenjen nastavniku

Vodič za nastavnike

Learning Objectives

Set up body actions using functions and looping
Connect those functions to button pressed event handlers
Create loops to make a blinking display effect
Apply the above knowledge and skills to present a program that uses functions to make blinking display effects

Agenda

Background
Activity (20 mins)
Function Challenges (20 mins)
Independent Practice - Making Student Projects (15 mins)
Present Independent Practice - Students Present Projects (5 mins per group)
Quiz (10 mins)

Function Challenge Assessment

Functions Challenges

4 = All 3 challenges were accomplished successfully
3 = 2 challenges were accomplished successfully and the other was tried but unsuccessful
2 = 1 challenge was accomplished successfully
1 = Challenge(s) were tried but unsuccessful

Independant Practice Assessment

Create Your Own micro:bit Pet

4 = Uses all three functions, code works, and tells a connected story
3 = Uses 2 functions, code works, and possibly a story
2 = Uses 1 function, code works, and possibly a story
1 = Code does not work but there was an attempt

Tips on Making Student Presentations Great

It is easiest to use a document camera to demo the student micro:bit programs so that students simply bring their micro:bits to the document camera when presenting. If a document camera is not available, you can have students share their program. Load programs on devices for display by publishing and sharing the URL for the script.

Aktivnost

Ono što će vam trebati

1 − micro:bit
1 − USB kabel
1 − pakiranje AAA baterija (nije obvezatno)
2 − AAA baterije (nije obvezatno)

Dokumentacija


function doSomething()  {
    basic.showString("Hello!")
}

doSomething()

function

Funkcija ti omogućuje da kreiraš dio kôda koji možeš ponovno upotrijebiti u programu.


for(let i = 0; i < 5; ++i) {
  basic.showNumber(i)
}

for

Pokreni dio programa onoliko puta koliko narediš.


basic.showLeds(`
    . . . . .
    . . . . .
    . . # . .
    . . . . .
    . . . . .
    `)

showLeds

Prikaži sliku na LED zaslonu.


input.onButtonPressed(Button.A, () => {

})

onButtonPressed

Pokreni 'event handler' (tj. 'upravljač događajima', odnosno dio programa koji će se pokrenuti kada se nešto dogodi, npr. kada je pritisnuta tipka)

basic.showIcon(IconNames.Heart)

showIcon

Prikaži odabranu ikonu na LED zaslonu

basic.pause(100)

pause

Pauziraj program za onoliko milisekundi koliko narediš.


input.onGesture(Gesture.Shake, () => {

})

onGesture

Pokreni upravljača 'handler' (dio programa koji će se pokrenuti kada se nešto dogodi). Ovaj upravljač (handler) radi kada napraviš neku gestu (na primjer, kada protreseš micro:bit).

5 koraka

Projektiranje našeg ljubimca

Nacrtaj tri rešetke veličine 5 puta 5 u boji u kutijama (koje predstavljaju LED diode) da pokažeš kako će tvoj ljubimac izgledati kada je budan, kada spava i kada pije.

Ovdje smo odabrali sljedeće, ali ti možeš napraviti što god ti se sviđa.

Smješko = budan
Slovo Z se prikazuje 4 puta = usnuo (Kada se pritisne tipka A)
Mlaz vode se prikaže 4 puta = pije (Kada se pritisne tipka B)

Naš ljubimac, Herbert, bit će sretan mali lik kada je budan, stoga prikazujemo smješka.

Ponekad moramo spavati pa bi i Herbert također trebao. Uspavat ćemo ga mazeći ga. Pritisak na tipku A uspavljuje Herberta i ZZZZ (slovo Z zatreperi 4 puta) će se pojaviti da pokaže da on spava.

Zatim se on utiša (LED diode se ugase) dok sanja. Da ga probudimo, dajemo mu malo vode. Herbert voli vodu pa mu je možemo dati kada god želimo. To će ga probuditi i istodobno ponovno vratiti u sretno stanje. Dat ćemo mu vode pritiskom na tipku B. Mlaz vode će se pojaviti da pokaže kako on pije, a potom se on ponovno budi i opet pokazuje nasmiješeno lice!

Vodič za vježbu

Za micro:bit ćemo napraviti online upute ili kôd. Potom, idi na: makecode.microbit.org

input.onButtonPressed(Button.B, () => {
    DRINKING()
})
function ASLEEP()  {
    for (let i = 0; i < 4; i++) {
        basic.showLeds(`
            # # # # #
            . . . # .
            . . # . .
            . # . . .
            # # # # #
            `)
        basic.pause(500)
        basic.clearScreen()
        basic.pause(500)
    }
}
function DRINKING()  {
    for (let index = 0; index <= 4; index++) {
        basic.showLeds(`
            . . # . .
            . # . # .
            # . . . #
            # . . . #
            . # # # .
            `)
        basic.pause(500)
        basic.clearScreen()
        basic.pause(500)
    }
    AWAKE()
}
input.onButtonPressed(Button.A, () => {
    ASLEEP()
})
function AWAKE()  {
    basic.showIcon(IconNames.Happy)
}
input.onGesture(Gesture.Shake, () => {

})
function EXERCISE()  {

}
input.onButtonPressed(Button.AB, () => {

})
AWAKE()

Herbert ima tri funkcije koje obavlja. On je ili budan, ili spava ili pije. Imamo funkciju za svaku pojedinu radnju.

Na početku pozivamo funkciju koja prikazuje sretno lice. Herbert je sretan i budan.

Pritisak na tipku A poziva funkciju koja prikazuje treperavo slovo Z. To znači da Herbert spava.

Pritisak na tipku B poziva funkciju koja prikazuje treperavi mlaz vode. To znači da Herbert pije.

Jedina je prava razlika između funkcija ASLEEP and DRINKING na kraju. Na kraju funkcije DRINKING ponovno pozivamo funkciju AWAKE i Herbert pokazuje svoje sretno lice. Herbert voli vodu.

Pauze i čišćenje sadržaja zaslona pomažu nam da stvorimo efekt treperenja. Petlje 'for' i 'repeat' također doprinose stvaranju tog efekta.

Detalji o tome kako dvije funkcije (ASLEEP, DRINKING) rade zapravo i nisu važni za ovu lekciju. Usredotočit ćemo se na postavljanje poziva za te funkcije te razumijevanje kako izraditi našu vlastitu funkciju.

Gotov osnovni kôd bez dovršenih izazova dostupan je ovdje.

NAPOMENA: Neiskorišteni blokovi na dnu kôda namijenjeni su za upotrebu u izazovima.

Izazovi s funkcijama

Izazov 1

Možeš li programirati Herberta da vježba kada su pritisnute obje tipke?

Trik: Posluži se funkcijom 'exercise', ikonom 'roller skate' i A+B stanjem 'handlera'.

Pogledaj kôd

function AWAKE()  {
    basic.showIcon(IconNames.Happy)
}
function ASLEEP()  {
    for (let i = 0; i < 4; i++) {
        basic.showLeds(`
            # # # # #
            . . . # .
            . . # . .
            . # . . .
            # # # # #
            `)
        basic.pause(500)
        basic.clearScreen()
        basic.pause(500)
    }
}
function DRINKING()  {
    for (let index = 0; index <= 4; index++) {
        basic.showLeds(`
            . . # . .
            . # . # .
            # . . . #
            # . . . #
            . # # # .
            `)
        basic.pause(500)
        basic.clearScreen()
        basic.pause(500)
    }
    AWAKE()
}
input.onButtonPressed(Button.A, () => {
    ASLEEP()
})
input.onButtonPressed(Button.B, () => {
    DRINKING()
})
input.onButtonPressed(Button.AB, () => {
    EXERCISE()
})
function EXERCISE()  {
    basic.showIcon(IconNames.Rollerskate)
}
input.onGesture(Gesture.Shake, () => {

})
AWAKE()

Gotov kôd je dostupan ovdje

Izazov 2

Možeš li programirati Herberta da napravi novu radnju kada se micro: bit protrese ('on shake')?

Pogledaj kôd

input.onButtonPressed(Button.B, () => {
    DRINKING()
})
function Silly()  {
    basic.showIcon(IconNames.Rollerskate)
}
function ASLEEP()  {
    for (let i = 0; i < 4; i++) {
        basic.showLeds(`
            # # # # #
            . . . # .
            . . # . .
            . # . . .
            # # # # #
            `)
        basic.pause(500)
        basic.clearScreen()
        basic.pause(500)
    }
}
function DRINKING()  {
    for (let index = 0; index <= 4; index++) {
        basic.showLeds(`
            . . # . .
            . # . # .
            # . . . #
            # . . . #
            . # # # .
            `)
        basic.pause(500)
        basic.clearScreen()
        basic.pause(500)
    }
    AWAKE()
}
input.onButtonPressed(Button.A, () => {
    ASLEEP()
})
function AWAKE()  {
    basic.showIcon(IconNames.Happy)
}
input.onButtonPressed(Button.AB, () => {
    EXERCISE()
})
input.onGesture(Gesture.Shake, () => {
    Silly()
})
function EXERCISE()  {
    basic.showIcon(IconNames.Rollerskate)
}
AWAKE()

Gotov kôd je dostupan ovdje

Izazov 3

Ako se sjećaš, jedna od koristi funkcija je pisanje kôda, a potom ga moći ponovno jednostavno upotrijebiti. Pogledaj funkcije ASLEEP i DRINKING. Koji kôd je isti? Možeš li napraviti novu funkciju za ovaj ponavljajući kôd? Nazovi svoju funkciju BLINKING.

Pogledaj kôd

input.onButtonPressed(Button.B, () => {
    DRINKING()
})
function BLINKING()  {
    basic.pause(500)
    basic.clearScreen()
    basic.pause(500)
}
function ASLEEP()  {
    for (let i = 0; i < 4; i++) {
        basic.showLeds(`
            # # # # #
            . . . # .
            . . # . .
            . # . . .
            # # # # #
            `)
        BLINKING()
    }
}
function DRINKING()  {
    for (let index = 0; index <= 4; index++) {
        basic.showLeds(`
            . . # . .
            . # . # .
            # . . . #
            # . . . #
            . # # # .
            `)
        basic.pause(500)
        basic.clearScreen()
        basic.pause(500)
    }
    AWAKE()
}
input.onButtonPressed(Button.A, () => {
    ASLEEP()
})
function AWAKE()  {
    basic.showIcon(IconNames.Happy)
}
input.onButtonPressed(Button.AB, () => {
    EXERCISE()
})
input.onGesture(Gesture.Shake, () => {
    Silly()
})
function EXERCISE()  {
    basic.showIcon(IconNames.Rollerskate)
}
function Silly()  {
    basic.showIcon(IconNames.Rollerskate)
}
AWAKE()

Gotov kôd je dostupan ovdje

Samostalna vježba

Kreiraj svog vlastitog micro:bit ljubimca s 3 funkcije poziva. Umetanje ikona ili mijenjanje LED dioda može stvoriti novog ljubimca. Budi spreman ispričati priču o novom ljubimcu i zašto radi radnje koje si odabrao.

Početni kôd može se naći ovdje.

Kviz

Posluži se ovim pitanjima kako bi se osvrnuo na aktivnost ili izazove.

Pitanje 1

Što je jedna od prednosti upotrebe funkcija?

Prikaži odgovor

Bilo koji od ovih odgovora je prihvatljiv

Funkcije nam omogućuju ponavljanje kôda bez ponovnog unosa pa je kôd manji.
Trebamo li napraviti izmjene, moramo samo promijeniti naš kôd na jednom mjestu.
Funkcije nam omogućuju bolju organizaciju našeg kôda.

Pitanje 2

Kako mogu napraviti kôd u funkciji "go" ili "start"?

Prikaži odgovor

Pozovi funkciju i kôd koji je unutra bit će "go"

Pitanje 3

Smislite nešto za što se mogu koristiti funkcije i navedite što biste mogli staviti u funkcije. Jedan od primjera može biti automobil.

Prikaži odgovor

Funkcije automobila

Kretanje
Zaustavljanje
Skretanje

Nauči više

Ova je lekcija razvijena u suradnji s K12 Maker Integration

Tečaj E − Funkcije 2 − Funkcije za digitalnog ljubimca

Teachers resources

Uvod

Osnova

Vodič za nastavnike

Learning Objectives

Agenda

Function Challenge Assessment

Independant Practice Assessment

Tips on Making Student Presentations Great

Aktivnost

Dokumentacija

function

for

showLeds

onButtonPressed

showIcon

pause

onGesture

Projektiranje našeg ljubimca

Vodič za vježbu

Izazovi s funkcijama

Izazov 1

Izazov 2

Izazov 3

Samostalna vježba

Kviz

Pitanje 1

Pitanje 2

Pitanje 3

Nauči više