Console Utilities API referansı

let images = $$('img');
for (let each of images) {
  console.log(each.src);
}
 kullanılmıştır
<img> öğeler
mevcut dokümanda seçilen Düğümden sonra görünen
let images = $$('img', document.querySelector('.devsite-header-background'));
for (let each of images) {
  console.log(each.src);
}





$x(yol [, startNode])

$x(path), belirtilen XPath ifadesiyle eşleşen bir DOM öğeleri dizisi döndürür.

Örneğin, aşağıdaki kod, sayfadaki tüm <p> öğelerini döndürür:
$x("//p")



Aşağıdaki örnek, <a> öğelerini içeren tüm <p> öğelerini döndürür:
$x("//p[a]")



Diğer seçici işlevlerine benzer şekilde, $x(path) isteğe bağlı ikinci bir parametreye sahiptir: startNode
öğelerin aranacağı bir öğeyi veya Düğümü belirten bir kod içerir.



clear()

clear(), konsolun geçmişini temizler.
clear();

kopyala(nesne)

copy(object), belirtilen nesnenin dize gösterimini panoya kopyalar.
copy($0);

hata ayıklama(işlev)

Belirtilen işlev çağrıldığında, hata ayıklayıcı çağrılır ve
Kaynaklar paneli, kodda gezinmeye ve hata ayıklamaya olanak tanır.
debug(getData);



İşlevin bozulmasını durdurmak için undebug(fn) öğesini kullanın veya tüm ayrılma noktalarını devre dışı bırakmak için kullanıcı arayüzünü kullanın.

Kesme noktaları hakkında daha fazla bilgi için Kırma Noktaları ile Kodunuzu Duraklatma bölümüne bakın.

dir(object)

dir(object), belirtilen tüm nesnenin özelliklerinin nesne stili listesini görüntüler. Bu yöntem
Console API'nin console.dir() yönteminin bir kısayoludur.

Aşağıdaki örnekte, document.body değerinin doğrudan
komut satırını kullanma ve aynı öğeyi görüntülemek için dir() kullanma:
document.body;
dir(document.body);



Daha fazla bilgi için Console API'deki console.dir() girişine bakın.

dirxml(nesne)

dirxml(object), Elements panelinde görüldüğü gibi, belirtilen nesnenin XML gösterimini yazdırır.
Bu yöntem, console.dirxml() yöntemine eşdeğerdir.

inspect(object/function)

inspect(object/function), belirtilen öğeyi veya nesneyi uygun
paneli: DOM öğeleri için Elements paneli veya JavaScript yığın nesneleri için Profiller paneli.

Aşağıdaki örnek, Elements panelinde document.body öğesini açar:
inspect(document.body);



İncelemek üzere bir işlevi iletirken işlev, dokümanı sizin için Kaynaklar panelinde açar
tıklayın.

getEventListeners(object)

getEventListeners(object), belirtilen nesnede kayıtlı etkinlik işleyicileri döndürür. İlgili içeriği oluşturmak için kullanılan
dönüş değeri, her kayıtlı etkinlik türü (click veya
keydown). Her bir dizinin üyeleri, kaydedilen işleyiciyi tanımlayan nesnelerdir
seçmeniz gerekir. Örneğin, aşağıda bu dokümana kayıtlı tüm etkinlik işleyiciler listelenmektedir
nesne:
getEventListeners(document);



Belirtilen nesnede birden fazla işleyici kayıtlıysa dizi bir üye içerir
her dinleyiciye özeldir. Aşağıdaki örnekte,
click etkinliği için doküman öğesi:



Bu nesnelerin her birini daha fazla genişleterek özelliklerini keşfedebilirsiniz:



Daha fazla bilgi için Nesne özelliklerini inceleme konusuna bakın.

Keys(nesne)

keys(object), belirtilen öğeye ait özelliklerin adlarını içeren bir dizi döndürür
nesnesini tanımlayın. Aynı özelliklerin ilişkili değerlerini almak için values() işlevini kullanın.

Örneğin, uygulamanızın aşağıdaki nesneyi tanımladığını varsayalım:
let player = {
    "name": "Parzival",
    "number": 1,
    "state": "ready",
    "easterEggs": 3
};

player öğesinin genel ad alanında tanımlandığı varsayılarak (basitlik için) keys(player) ve
Konsol'da values(player) durumu şu şekilde sonuçlanır:



monitör(işlev)

Belirtilen işlev çağrıldığında, konsolda
işlev adını ve çağrıldığında işleve iletilen bağımsız değişkenleri içerir.
function sum(x, y) {
  return x + y;
}
monitor(sum);



İzlemeyi durdurmak için unmonitor(function) öğesini kullanın.

monitorEvents(object [, events])

Belirtilen nesnede belirtilen etkinliklerden biri meydana geldiğinde Etkinlik nesnesi
konsolu. İzlenecek tek bir etkinlik, bir etkinlik dizisi veya genel etkinliklerden birini belirtebilirsiniz.
"türler" önceden tanımlanmış bir etkinlik koleksiyonuyla eşlenir. Aşağıdaki örneklere bakın.

Aşağıda, pencere nesnesindeki tüm yeniden boyutlandırma etkinlikleri izlenir.
monitorEvents(window, "resize");



Aşağıda, hem "yeniden boyutlandırma" hem de ve "scroll" pencere nesnesindeki etkinlikler:
monitorEvents(window, ["resize", "scroll"])

Kullanılabilir etkinlik "türlerinden" birini de belirtebilirsiniz. Bunlar, önceden tanımlanmış
etkinlikler. Aşağıdaki tabloda, kullanılabilir etkinlik türleri ve ilişkili etkinlik eşlemeleri listelenmiştir:

Etkinlik türü ve İlgili eşlenen etkinlikler
fare
"mousedown", "mouseup", "click", "dblclick", "mousemove", "mouseover", "mouseout", "mousewheel"
anahtar
"keydown", "keyup", "keypress", "textInput"
dokun
"Touchstart", "touchmove", "touchend", "touchcancel"
kontrol
"yeniden boyutlandır", "kaydır", "yakınlaştır", "odak", "bulanık", "seç", "değiştir", "gönder", "sıfır"

Örneğin, aşağıdakiler "key" değerini kullanır etkinlik türü bir giriş metninde ilgili tüm önemli etkinlikler
alanı şu anda Elements panelinde seçilidir.
monitorEvents($0, "key");

Metin alanına bir karakter yazdıktan sonra gösterilen örnek çıktıyı aşağıda görebilirsiniz:



İzlemeyi durdurmak için unmonitorEvents(object[, events]) öğesini kullanın.

profile([ad]) ve profileEnd([ad])

profile(), isteğe bağlı bir adla JavaScript CPU profil oluşturma oturumu başlatır. profileEnd().
Profili tamamlar ve sonuçları Performans > Ana kanal.



Profil oluşturmaya başlamak için:
profile("Profile 1")

Profil oluşturmayı durdurmak ve sonuçları Performans > Ana kanal:
profileEnd("Profile 1")

Performans sayfasındaki sonuç > Ana kanal:



Profiller iç içe de yerleştirilebilir. Örneğin, aşağıdaki komut herhangi bir sırada kullanılabilir:
profile('A');
profile('B');
profileEnd('A');
profileEnd('B');



queryObjects(Constructor)

Oluşturulan bir nesne dizisini döndürmek için konsoldan queryObjects(Constructor) komutunu çağırın
değeri belirtilen oluşturucuyla değiştirin. Örneğin:


queryObjects(Promise) Tüm Promise örneklerini döndürür.
queryObjects(HTMLElement) Tüm HTML öğelerini döndürür.
queryObjects(foo); burada foo bir sınıf adıdır. Örneklenen tüm nesneleri döndürür
new foo() üzerinden.


queryObjects() kapsamı, konsolda seçili olan yürütme bağlamıdır.

tablo(veri [, sütunlar])

İsteğe bağlı sütun başlıklarıyla bir veri nesnesini iletip tablo biçimlendirmesiyle nesne verilerini günlüğe kaydedin.
Bu, console.table() için bir kısayoldur.

Örneğin, konsolda bir tablo kullanarak adların listesini görüntülemek için şunları yaparsınız:
let names = [
  { firstName: "John", lastName: "Smith" },
  { firstName: "Jane", lastName: "Doe" },
];
table(names);



hata ayıklama(işlev)

undebug(function), belirtilen işlevin hata ayıklamasını durdurur. Böylece fonksiyon
hata ayıklayıcı artık çağrılmaz. Bu, debug(fn) ile uyum olarak kullanılır.
undebug(getData);

unmonitor(işlev)

unmonitor(function), belirtilen işlevin izlenmesini durdurur. Bu,
monitor(fn)
unmonitor(getData);

unmonitorEvents(object [, events])

unmonitorEvents(object[, events]), belirtilen nesne ve etkinlikler için etkinlikleri izlemeyi durdurur. Örneğin,
aşağıdaki örnek, pencere nesnesindeki tüm etkinlik izlemeyi durdurur:
unmonitorEvents(window);

Bir nesnedeki belirli etkinlikleri izlemeyi seçerek de durdurabilirsiniz. Örneğin,
kodu, seçili durumdaki öğedeki tüm fare etkinliklerini izlemeye başlar ve daha sonra izlemeyi durdurur.
"mousemove" etkinlikler (ör. konsol çıktısındaki gürültüyü azaltmak için):
monitorEvents($0, "mouse");
unmonitorEvents($0, "mousemove");

değerler(nesne)

values(object), belirtilen özelliğe ait tüm özelliklerin değerlerini içeren bir dizi döndürür
nesnesini tanımlayın.
let player = {
    "name": "Parzival",
    "number": 1,
    "state": "ready",
    "easterEggs": 3
};

values(player);