JavaScript, web sayfalar\u0131na etkile\u015fim kazand\u0131ran programlama dilidir. HTML yap\u0131y\u0131, CSS g\u00f6r\u00fcn\u00fcm\u00fc belirler; JavaScript ise sayfan\u0131n davran\u0131\u015f\u0131n\u0131 y\u00f6netir. Bir d\u00fc\u011fmeye bas\u0131nca men\u00fcn\u00fcn a\u00e7\u0131lmas\u0131, formdaki hatalar\u0131n an\u0131nda g\u00f6sterilmesi ya da sayfa yenilenmeden verinin g\u00fcncellenmesi JavaScript ile yap\u0131l\u0131r. Java ile yaln\u0131zca ad benzerli\u011fi vard\u0131r, iki ayr\u0131 dildir.<\/p>\n\n\n\n
Taray\u0131c\u0131lar JavaScript’i do\u011frudan \u00e7al\u0131\u015ft\u0131r\u0131r, yani ayr\u0131ca bir kurulum gerekmez. Node.js ile sunucu taraf\u0131nda da kullan\u0131labilir. Bu yaz\u0131da taray\u0131c\u0131 taraf\u0131na odaklan\u0131yoruz.<\/p>\n\n\n\n
Taray\u0131c\u0131da herhangi bir sayfada F12 tu\u015funa bas\u0131n ve Konsol (Console)<\/strong> sekmesini a\u00e7\u0131n. \u015eunu yaz\u0131p Enter’a bas\u0131n:<\/p>\n\n\n\n Konsolda yaz\u0131y\u0131 g\u00f6r\u00fcrs\u00fcn\u00fcz. Kodun anlam\u0131 \u015f\u00f6yledir: Modern JavaScript’te iki ana tan\u0131m y\u00f6ntemi vard\u0131r:<\/p>\n\n\n\n Eski kodlarda Bu kod S\u0131ras\u0131yla diziler ve nesneler, DOM i\u015flemleri, olaylar, form do\u011frulama, JavaScript’in ne oldu\u011funu, de\u011fi\u015fken ve fonksiyonlar\u0131 ve bir d\u00fc\u011fmeye t\u0131klay\u0131nca sayfay\u0131 de\u011fi\u015ftirmeyi \u00f6\u011frenin.<\/p>","protected":false},"author":1,"featured_media":10019,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_themeisle_gutenberg_block_has_review":false,"footnotes":""},"categories":[228],"tags":[208,235,246,258],"class_list":["post-10020","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-baslangic","tag-dom","tag-javascript","tag-web"],"yoast_head":"\nconsole.log(\"Merhaba D\u00fcnya\");<\/code><\/pre>\n\n\n\nconsole.log()<\/code> hata ay\u0131klamada en \u00e7ok kullan\u0131lan komuttur.<\/p>\n\n\n\nSayfaya JavaScript Eklemek<\/h2>\n\n\n\n
<!DOCTYPE html>\n<html lang=\"tr\">\n<head>\n <meta charset=\"UTF-8\">\n <title>JS Deneme<\/title>\n<\/head>\n<body>\n <button id=\"dugme\">T\u0131kla<\/button>\n <p id=\"mesaj\"><\/p>\n\n <script>\n document.getElementById(\"dugme\").addEventListener(\"click\", function () {\n document.getElementById(\"mesaj\").textContent = \"D\u00fc\u011fmeye t\u0131klad\u0131n\u0131z!\";\n });\n <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\ngetElementById<\/code> ile id<\/code> de\u011feri belirli \u00f6\u011fe se\u00e7ilir. addEventListener<\/code> ile o \u00f6\u011feye bir olay dinleyicisi eklenir. D\u00fc\u011fmeye t\u0131klan\u0131nca (click<\/code>) fonksiyon \u00e7al\u0131\u015f\u0131r ve paragraf\u0131n metni de\u011fi\u015fir. HTML sayfas\u0131ndaki \u00f6\u011felere bu \u015fekilde eri\u015fmeye DOM<\/strong> (Document Object Model) \u00fczerinden eri\u015fim denir.<\/p>\n\n\n\nDe\u011fi\u015fkenler<\/h2>\n\n\n\n
let sayac = 0;\nconst site = \"yunuskaytan.com\";<\/code><\/pre>\n\n\n\n\n
let<\/code> sonradan de\u011feri de\u011fi\u015febilen de\u011fi\u015fkenler i\u00e7indir.<\/li>\n\nconst<\/code> de\u011feri de\u011fi\u015fmeyecek sabitler i\u00e7indir.<\/li>\n<\/ul>\n\n\n\nvar<\/code> g\u00f6rebilirsiniz ancak yeni yaz\u0131lan kodlarda genellikle tercih edilmez.<\/p>\n\n\n\nVeri T\u00fcrleri<\/h2>\n\n\n\n
let metin = \"Merhaba\";\nlet sayi = 42;\nlet dogruMu = true;\nlet liste = [\"elma\", \"armut\", \"kiraz\"];\nlet kisi = { ad: \"Yunus\", yas: 30 };<\/code><\/pre>\n\n\n\nFonksiyonlar<\/h2>\n\n\n\n
function topla(a, b) {\n return a + b;\n}\n\nconsole.log(topla(3, 4));<\/code><\/pre>\n\n\n\n7<\/code> yazar. Ayn\u0131 i\u015fi k\u0131saca ok fonksiyonu<\/strong> ile de yazabilirsiniz:<\/p>\n\n\n\nconst topla = (a, b) => a + b;<\/code><\/pre>\n\n\n\nKo\u015ful ve D\u00f6ng\u00fc<\/h2>\n\n\n\n
let puan = 72;\n\nif (puan >= 50) {\n console.log(\"Ge\u00e7tiniz\");\n} else {\n console.log(\"Kald\u0131n\u0131z\");\n}\n\nfor (let i = 1; i <= 5; i++) {\n console.log(i);\n}<\/code><\/pre>\n\n\n\nS\u0131k Yap\u0131lan Hatalar<\/h2>\n\n\n\n
\n
==<\/code> ile ===<\/code> kar\u0131\u015ft\u0131rmak. ===<\/code> hem de\u011feri hem t\u00fcr\u00fc kar\u015f\u0131la\u015ft\u0131r\u0131r ve genellikle tercih edilmelidir.<\/li>\n\n<script><\/code> etiketini body<\/code> sonuna koymak bunu \u00e7\u00f6zer.<\/li>\n\nSonraki Ad\u0131mlar<\/h2>\n\n\n\n
fetch<\/code> ile veri \u00e7ekme ve sonra Node.js konular\u0131na ge\u00e7ebilirsiniz.<\/p>\n","protected":false},"excerpt":{"rendered":"