TypeScript Academy · Ders

Ziyaretçilerle AST'de Dolaşma

Kodu analiz etmek için sözdizimi ağacı düğümlerinde dolaşın

2. ders / 413 adım

Ziyaretçilerle AST'de Dolaşma, CoddyKit'te ücretsiz bir TypeScript Academy dersidir. Bu, 4 dersinin 2. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, TypeScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. TypeScript Academy kursu toplamda 4 dersten oluşur.

AST Nedir

TypeScript, kaynak kodunu; değişkenler, işlevler ve ifadeler gibi dil yapılarını temsil eden düğümlerden oluşan bir Soyut Sözdizimi Ağacı'na (AST) ayrıştırır.

import ts from "typescript";
const sf = ts.createSourceFile(
  "example.ts",
  "const x = 1;",
  ts.ScriptTarget.Latest
);

Düğüm Türleri

Her AST düğümünde, neyi temsil ettiğini belirten bir kind özelliği (ts.SyntaxKind numaralandırma değeri) bulunur.

import ts from "typescript";
// Common kinds:
// ts.SyntaxKind.VariableDeclaration
// ts.SyntaxKind.FunctionDeclaration
// ts.SyntaxKind.Identifier

forEachChild ile Ziyaret Etme

ts.forEachChild(node, visitor), bir düğümün her doğrudan alt düğümü için ziyaretçinizi çağırır. Ağacın tamamında gezinmek için özyineleme kullanın.

function visit(node: ts.Node) {
  if (ts.isFunctionDeclaration(node)) {
    console.log("Function:", node.name?.text);
  }
  ts.forEachChild(node, visit);
}
visit(sourceFile);

Tür Koruma İşlevleri

TypeScript, düğümleri güvenli bir şekilde daraltmak için ts.isVariableDeclaration ve ts.isFunctionDeclaration gibi tür koruma işlevleri sağlar.

ts.forEachChild(sf, node => {
  if (ts.isClassDeclaration(node)) {
    console.log("Class:", node.name?.getText());
  }
  if (ts.isInterfaceDeclaration(node)) {
    console.log("Interface:", node.name.getText());
  }
});

Düğüm Metnini Alma

Bir düğümün tam kaynak metnini almak için node.getText(sourceFile), sözdizimsel ayrıntılar da dâhil olmak üzere almak içinse node.getFullText() kullanın.

ts.forEachChild(sf, node => {
  if (ts.isIdentifier(node)) {
    console.log("Id:", node.text);
  }
});

Düğüm Konumları

Her düğümde, kaynak içindeki düğümlerin yerini belirlemek için kullanabileceğiniz pos ve end konumları (karakter uzaklıkları) bulunur.

ts.forEachChild(sf, node => {
  console.log(node.kind, "at", node.pos, "-", node.end);
});

Özyinelemeli Yardımcıyla Gezinme

Yaygın bir yardımcı işlev, ağaçtaki her düğüme özyinelemeli olarak bir ziyaretçi uygulayan walk işlevdir.

function walk(node: ts.Node, visitor: (n: ts.Node) => void) {
  visitor(node);
  ts.forEachChild(node, child => walk(child, visitor));
}

Tüm İşlev Çağrılarını Bulma

Bir kaynak dosyadaki tüm çağrı ifadelerini bulmak için özyinelemeli bir dolaşım kullanın — bu, API kullanımını algılamak için yararlıdır.

walk(sf, node => {
  if (ts.isCallExpression(node)) {
    const expr = node.expression.getText(sf);
    console.log("Call:", expr);
  }
});

Üst Düğümlere Erişme

AST düğümlerinde varsayılan olarak bir üst düğüm işaretçisi bulunmaz. ts.setParent(sourceFile) işlevini çağırın veya programlar için üst düğümleri otomatik olarak ayarlayan program.getSourceFile işlevini kullanın.

// For manually created source files:
// (ts as any).setParents(sf);

Düğümlerle TypeChecker Kullanımı

Herhangi bir ifade düğümünün TypeScript türünü çözümlemek için AST dolaşımını tür denetleyicisiyle birleştirin.

const checker = program.getTypeChecker();
walk(sf, node => {
  if (ts.isExpression(node)) {
    const type = checker.getTypeAtLocation(node);
    console.log(checker.typeToString(type));
  }
});

Özet: AST Dolaşımı

TypeScript AST'sini forEachChild ve tür koruma işlevleriyle dolaşın. Güçlü statik çözümleme ve kod üretimi araçları oluşturmak için bunu tür denetleyicisiyle birleştirin.

Hızlı Denetim

TypeScript AST'sinde alt düğümleri özyinelemeli olarak ziyaret eden işlev hangisidir?

İnteraktif derste cevapla

Öğrendikleriniz

AST dolaşımı, bir TypeScript dosyasındaki her düğümü dolaşmak ve incelemek için ts.forEachChild ile tür koruma işlevlerini kullanır. Tür denetleyicisiyle birleştirildiğinde lintleyicileri, kod çözümleyicilerini ve yeniden düzenleme araçlarını mümkün kılar.

Başlamak ücretsiz

Yapay zeka eğitmeniyle TypeScript öğren — ücretsiz

Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.

Kurslar: 101
Dersler: 352

Ücretsiz öğrenmeye başla Tüm kursu görüntüle

Sıkça Sorulan Sorular

“Ziyaretçilerle AST'de Dolaşma” dersi ücretsiz mi?

Evet — “Ziyaretçilerle AST'de Dolaşma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve TypeScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. TypeScript Academy kursu toplamda 4 dersten oluşur.

“Ziyaretçilerle AST'de Dolaşma” dersinde ne öğreneceğim?

Kodu analiz etmek için sözdizimi ağacı düğümlerinde dolaşın TypeScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

TypeScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te TypeScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 2. dersidir.

“Ziyaretçilerle AST'de Dolaşma” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu TypeScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her TypeScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← TypeScript Academy Sayfasına Dön