Vibe-koodaus · Oppitunti

Virheiden ja huonojen käytäntöjen tunnistaminen

Tekoälyn yleiset virheet ja niiden havaitseminen.

Oppitunti 3/413 vaihetta

Virheiden ja huonojen käytäntöjen tunnistaminen on ilmainen Vibe-koodaus-oppitunti CoddyKitissä. Tämä on oppitunti 3/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Vibe-koodaus-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Vibe-koodaus-kurssilla on yhteensä 4 oppituntia.

Opetelkaa tunnistamaan tekoälyn virhemallit

Tekoäly tekee jatkuvasti samantyyppisiä virheitä. Kun tunnette nämä mallit, huomaatte ne sekunneissa — aivan kuin etsivä, joka on nähnyt saman tempun sata kertaa.

Tämä oppitunti on kenttäopas tekoälyn tuottaman koodin yleisimpiin virheisiin ja huonoihin rakenteisiin sekä niiden havaitsemiseen. Syvällistä tietojenkäsittelytieteen taustaa ei tarvita.

Teidän ei tarvitse opetella korjauksia ulkoa — opitte, mitä kannattaa tarkkailla.

Malli 1: reunatapaukset puuttuvat

Tekoäly keskittyy mielellään onnistuneeseen suorituspolkuun ja unohtaa usein todellisuuden hankalat tilanteet: tyhjät listat, puuttuvat tiedot, nollan tai null-arvon.

Suorittakaa tämä keskiarvofunktio normaalilla listalla — se toimii. Kuvitelkaa kuitenkin, mitä tapahtuu, jos lista on tyhjä.

function average(numbers) {
  let sum = 0;
  for (const n of numbers) sum += n;
  return sum / numbers.length;
}

console.log(average([10, 20, 30])); // 20, fine
console.log(average([]));            // NaN — divide by zero!

Reunatapausten havaitseminen

Tyhjä lista palautti arvon NaN (ei luku), koska koodi jakoi nollalla. Oikeassa sovelluksessa käyttäjä voisi nähdä tekstin ”NaN” tai sovellus voisi kaatua myöhemmin.

Oleellista on tämä: aina kun näette koodia, joka käy silmukkaa läpi, jakaa lukuja tai lukee ominaisuutta, kysykää: ”entä jos se on tyhjä tai puuttuu?”

Korjauskehotteen voitte kopioida sellaisenaan: ”Käsittele tämän funktion tyhjä lista ja kaikki null-syötteet. Palauta järkevä oletusarvo ja selitä valintasi.”

Malli 2: puuttuvien tietojen lukeminen

Tekoäly olettaa usein, että tiedot ovat aina täydellisessä muodossa. Jos käsittelette oliota, josta ei ehkä löydy odottamaanne tietoa, seurauksena on tuttu kaatuminen.

Tämä aiheuttaa oikean virheen. Suorittakaa koodi ja lukekaa viesti.

function getCity(user) {
  return user.address.city; // assumes address always exists
}

const u = { name: 'Sam' }; // no address!
console.log(getCity(u));    // TypeError: Cannot read properties of undefined

Puuttuvien tietojen virheiden havaitseminen

Virhe Cannot read properties of undefined on yksi koko web-kehityksen yleisimmistä virheistä. Tekoäly tuottaa sen jatkuvasti, koska se olettaa tietojen olevan ihanteellisessa muodossa.

Tarkkailkaa ketjuja, kuten a.b.c, joissa mikä tahansa keskimmäinen osa voi puuttua. Turvallinen rakenne käyttää optional chaining -operaattoria: user.address?.city palauttaa arvon undefined kaatumisen sijaan.

Kun näette syvää ominaisuuksien käsittelyä käyttäjän syötteissä tai API-datassa, merkitkää se tarkistettavaksi.

Malli 3: kovakoodatut salaisuudet

Vaarallinen suosikki: tekoäly liittää API-avaimen tai salasanan suoraan koodiin, jotta esimerkki ”vain toimisi”.

Jos koodi päätyy GitHubiin tai selaimeen, kuka tahansa voi varastaa avaimenne ja kasvattaa laskuanne. Älkää koskaan päästäkö kirjaimellista salaisuutta läpi tarkistuksesta.

// DANGER: secret key hardcoded in the source
const STRIPE_KEY = 'sk_live_51HxAbC9secretrealkey';

fetch('https://api.stripe.com/charge', {
  headers: { Authorization: 'Bearer ' + STRIPE_KEY }
});
// Keys belong in environment variables, never in code

Malli 4: hiljaiset virheet

Joskus tekoäly ”käsittelee” virheen nielemällä sen — sovellus jatkaa kuin mitään ei olisi tapahtunut ja piilottaa todellisen ongelman.

Alla oleva tyhjä catch-lohko tarkoittaa, että haun epäonnistuessa ette saa varoitusta tai lokimerkintää, vaan ainoastaan salaperäisesti puuttuvia tietoja.

async function loadData(url) {
  try {
    const res = await fetch(url);
    return await res.json();
  } catch (e) {
    // swallows the error silently — bad!
    return null;
  }
}
// You'll never know WHY it returned null

Malli 5: liian monimutkainen koodi

Tekoäly kirjoittaa joskus 30 riviä kolmen rivin tehtävään tai lisää nokkelia abstraktioita, joita ette pyytäneet. Monimutkaisuus on paikka, johon virheet piiloutuvat ja jossa tulevaisuuden minänne eksyy.

Jos yksinkertainen tehtävä tuotti sekavan lopputuloksen, pyytäkää muutosta. Kokeilkaa: ”Tämä vaikuttaa tehtävään nähden liian monimutkaiselta. Kirjoita se uudelleen mahdollisimman yksinkertaisesti ja selitä, miksi kukin osa on tarpeen.”

Yksinkertainen koodi, jonka ymmärrätte, voittaa nokkelan koodin, jota ette ymmärrä.

Malli 6: koodi ei vastaa tavoitetta

Salakavalin virhe ei ole rikkinäinen koodi — se on toimiva koodi, joka ratkaisee väärän ongelman.

Pyysitte järjestämään uusimmat ensin; tekoäly järjestikin vanhimmat ensin. Pyysitte lähettämään sähköpostia aktiivisille käyttäjille; se lähetti viestin kaikille. Virhettä ei ole, mutta lopputulos on väärä.

Lukekaa aina alkuperäinen pyyntönne uudelleen ja verratkaa tulosta tarkoitukseenne, älkää siihen, ”toimiiko se”. Tätä virhettä tekoäly ei voi havaita puolestanne.

Antakaa tekoälyn etsiä omat virheensä

Teidän ei tarvitse löytää kaikkea yksin. Kohdistakaa koodiin tarkka ja epäilevä kehotus, niin tekoäly nostaa esiin monia näistä malleista.

Pidättehän tämän kehotteen käden ulottuvilla — se kohdistuu juuri tämän oppitunnin malleihin.

Audit this code for bugs and bad patterns. Check specifically for:

- Missing edge cases (empty, null, zero)
- Crashes from missing data (deep property access)
- Hardcoded secrets or API keys
- Silently swallowed errors
- Overcomplicated logic
- Anything that doesn't match this goal: [describe your goal]

List each issue, the line, and a fix.

Kehittäkää havaintovaistoanne

Yhteenveto virhetutkastanne:

  • Silmukoita ja jakolaskua? Tarkistakaa tyhjät arvot ja nolla.
  • Syvää ominaisuuksien käsittelyä? Tarkistakaa puuttuvat tiedot.
  • Avaimia tai salasanoja? Älkää koskaan kovakoodatko niitä.
  • Tyhjiä catch-lohkoja? Kyseessä on hiljainen virhe.
  • Liikaa koodia? Pyytäkää yksinkertaisempaa ratkaisua.
  • Aina: vastaako koodi sitä, mitä todella pyysin?

Kun teette tämän tarkistuksen jokaiselle koodiosalle, huomaatte valtaosan tekoälyn virheistä.

Pikatarkistus

Tekoäly kirjoittaa return user.address.city;, mutta osalla käyttäjistänne ei ole osoitetta. Millaisesta virheestä on kyse, ja miten havaitsette sen tarkistuksessa?

Kertaus: yleisten virheiden havaitseminen

Tekoälyn virhemallit, jotka osaatte nyt havaita:

  • Puuttuvat reunatapaukset — tyhjät listat, null, nollalla jakaminen.
  • Puuttuvien tietojen aiheuttamat kaatumiset — syvä ominaisuuksien käsittely epätäydellisillä tiedoilla.
  • Kovakoodatut salaisuudet — avainten on oltava ympäristömuuttujissa.
  • Hiljaiset virheet — tyhjät catch-lohkot piilottavat virheet.
  • Liiallinen monimutkaisuus — pyytäkää yksinkertaisinta mahdollista versiota.
  • Väärä tavoite — toimiva koodi ratkaisee väärän ongelman.

Etsikää näitä joka kerta ja antakaa tekoälyn tarkistaa myös oma työnsä. Seuraavaksi opitte päättämään, mitä säilyttää, korjata tai hylätä.

Aloita maksutta

Opi JavaScript tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit
25
Oppitunnit
100

Usein kysytyt kysymykset

Onko oppitunti ”Virheiden ja huonojen käytäntöjen tunnistaminen” ilmainen?

Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Vibe-koodaus-oppimispolun 3 oppituntia, myös oppitunnin “Virheiden ja huonojen käytäntöjen tunnistaminen”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Vibe-koodaus-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Virheiden ja huonojen käytäntöjen tunnistaminen”?

Tekoälyn yleiset virheet ja niiden havaitseminen. Harjoittelet Vibe-koodaus-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Vibe-koodaus-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Vibe-koodaus-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 3/4.

Kuinka kauan ”Virheiden ja huonojen käytäntöjen tunnistaminen”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Vibe-koodaus-oppitunnilla?

Kyllä. Jokainen Vibe-koodaus-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

  1. Miksi tekoälyn koodi on aina tarkistettava
  2. Koodin lukeminen ilman omaa kirjoittamista
  3. Virheiden ja huonojen käytäntöjen tunnistaminen
  4. Säilyttäkää, korjatkaa tai hylätkää
← Takaisin: Vibe-koodaus