arr = [1,2,3];arr.every(a => {return a >1;}); // Her biri 1'ten büyük mü? falsearr.some(a => {return a >1;}); // Herhangi biri 1'ten büyük mü? true
Harici fonksiyon ile:
arr = [1,2,3];functioncheckIndex(index) {return index >1;}arr.every(checkIndex); // Her biri 1'ten büyük mü? falsearr.some(checkIndex); // Herhangi biri 1'ten büyük mü? true
/** * Bugüne kıyasla yeni bir gün verisi döndürür * @param{number} offset Sonrası ya da öncesi (`-1` 1 gün önce) */functiongetDateTR(offset =0) {// Günlerin türkçe karşılığı day = ["Pazar","Pazartesi","Salı","Çarşamba","Perşembe","Cuma","Cumartesi" ];// Değişken tarih oluşturma date =newDate();date.setDate(date.getDate() + offset); dateString =date.toLocaleDateString("tr"); dayName = day[date.getDay()];return dateString +" "+ dayName;}
HTML Elemanları
HTML Elemanlarını Alma
document.getElementById("id"); // HTML elemanı döndürür (object)document.getElementsByTagName("tag_name"); // HTML elemanları dizisi döndürür (HTMLCollection)document.getElementsByClassName("class_name"); // HTML elemanları dizisi döndürür (HTMLCollection)document.getElementsByName("name"); // HTML elemanları dizisi döndürür (HTMLCollection)// id'ler için '#' classlar için '.' kullanılırdocument.querySelector("#content"); // İlk elemanı almadocument.querySelectorAll("span.style-scope.ytd-playlist-video-renderer"); // Hepsini alma
IdKimlik verisi
Taga, div, i, p, input, article ...
ClassCss dosyasındaki classları ifade eden alanlar
NameInputlarda sıklıkla kullanınlan alanlar
Query Selector ile HTML Elemanı Alma
Tek bir eleman alınmak isteniyorsa querySelector(<işlem>), hepsi alınmak isteniyorsa querySelectorAll(<işlem>) komutu kullanılır
ID ile HTML Elemanı Alma
ID'ler eşsiz olduğundan 1 tane html elamanı bulunacaktır.
document.getElementById("<id>"); // HTML elemanı döndürür (object)
Class, tag ve name özellikleri birden fazla html elemanında olabileceğinden, HTMLCollection objesi döndürür.
document.getElementsByTagName("tag_name"); // HTML elemanları dizisi döndürür (HTMLCollection)document.getElementsByClassName("class_name"); // HTML elemanları dizisi döndürür (HTMLCollection)document.getElementsByName("name"); // HTML elemanları dizisi döndürür (HTMLCollection)
HTML elemanının alt elemanlarını alma
document.getElementById("id").childNodes;
IdKimlik verisi
document.getElementById('id')HTMLElemanı
HTMLCollection'u array'e dönüştürmek
constarray= [...htmlCollection]; // array: Array objesidirarray.forEach(element => {// Arraydeki her bir elemanı işleme// element.method()});
HTML Attribute Alma
Tag özellikleri olarak geçer. Örn; src, href, data-thumb-url, ...
Beklemeli işlemlerde await, promise yapısı kullanılır.
await barındıran fonksiyonların async özelliğini taşımaları lazımdır
async özelliği olan fonksiyonlar await func() şeklinde kullanılır
await işlemi bitene kadar bekle anlamı taşımaktadır
await deyimi kullanıldığı için bu deyimi içeren fonksiyon da async özelliği taşımalıdır
Bir fonksiyonda await beklemesi varsa onu kullanan fonksyionlar da o fonksiyonu await ile beklemelidir
Aksi halde asenkron olarak çalışır bekleme gerçekleşmez
Bu konuda hakkında yazılmış bir medium yazısına buradan erişebilirsin.
Promise Yapısı ile Bekletme
functionwait(ms) {returnnewPromise((r, j) =>setTimeout(r, ms));}functionmethod() {console.log("done");}// Promise Yapısı ile çalışmaconstprom=wait(2000);prom.then(metod);// Await yapısı ile çalışmaawaitwait(2000);method();
window.scrollBy(x, y); // Verilen değer kadar kaymawindow.scrollTo(x, y); // Verilen değere gitmewindow.scrollBy(5,100); // Örnek kaydırmawindow.scrollTo(5,100); // Örnek atlama
x Yatay konum
y Dikey konum
functionpageScroll() {window.scrollBy(0,1); scrolldelay =setTimeout(pageScroll,10); // 10ms de bir kaydırma}
Tuşa basıldığında ses çalma ```htmlJS Drum Kit A clap S hihat D kick F openhat G boom H ride J snare K tom L tink
function removeTransitionEventListener(e) {
if (e.propertyName !== "transform") return;
this.classList.remove("playing");
}
function keyDownEventListener(e) {
const audioElement = document.querySelector(
`audio[data-key="${e.keyCode}"]`
);
const div = document.querySelector(`div[data-key="${e.keyCode}"]`);
if (!audioElement || !div) return;
// Oynama efekti ekleme
div.classList.add("playing");
// Playing always from start
audioElement.currentTime = 0;
audioElement.play();
}
// Tuşalara basıldığında listenerı aktif etme
window.addEventListener("keydown", keyDownEventListener);
// Efektleri kaldırma
const keys = document.querySelectorAll(".key");
keys.forEach(key =>
key.addEventListener("transitionend", removeTransitionEventListener)
);
```
var e =document.createEvent("MouseEvents");e.initMouseEvent("click",true,true, window,0,0,0,0,0,false,false,false,false,0,null);$button[0].dispatchEvent(e);
functioncopy(text) {var input =document.createElement('input');input.setAttribute('value', text);document.body.appendChild(input);input.select();var result =document.execCommand('copy');document.body.removeChild(input);return result; }copy("YEmreAk")// CTRL V ile yapıştırın