DartASTとその活用

Transcript

1. Dart ASTとその活用 そた
2. そた • 23卒高専出身 • FlutterとKMPを書いてます • FlutterKaigi2024登壇 • おすすめのウイスキー教えて ください 自己紹介 X: @_sotaatos
3. dart format flutter analyze dart pub run build_runner build
4. どのようにコードを”理解”する？
5. AST: Abstract Syntax Tree 抽象構文木
6. ASTとは 構文構造を木構造で表現したもの • Abstract = 抽象的な（詳細を省略） • Syntax = 構文 • Tree = 木構造 ポイント: ASTはコードの構造を表現するが、フォーマット情報は保持しない コードの持つ抽象的な意味だけを構造化 ASTに対し、改行や空白、かっこなどコードの詳細を持つ木構造を CST: 具象構文技(Concrete Syntax Tree)と呼ぶ
7. ASTとは https://commons.wikimedia.org/wiki/File:Abstract_syntax_tree_for_Euclidean_algorithm.svg while b != 0: if a > b: a := a - b else: b := b - a return a
8. なぜASTが必要なの？
9. ASTはプログラムが理解しやすいから
10. ソースコードを文字列として扱ってみる 例えばソースコードの中から print()の関数を呼び出している箇所を探したい // Dartでprinterを制御してprintする void main() async { final printText = 'print'; final printer = Printer(); await printer.print(printText); print('print(Done!)'); }
11. ソースコードを文字列として扱ってみる 例えばソースコードの中から print()の関数を呼び出している箇所を探したい // Dartでprinterを制御してprintする void main() async { final printText = 'print'; final printer = Printer(); await printer.print(printText); print('print(Done!)'); } 変数名、コメント、文字列、メソッドなど区別がつかない！！！
12. 構造を解析できるASTが役立つ！
13. ASTはどのように実装されているのか？
14. 実はDartのASTは二種類ある
15. 二種類のAST analyzer AST Kernel AST
16. 二種類のAST analyzer AST Kernel AST 今回話すのはこちら！
17. これらには共通する実装がある
18. これらには共通する実装がある _fe_analyzer_shared
19. _fe_analyzer_sharedとは front_endとanalyzerパッケージ間で共有されるコード • fe = front_endパッケージ • analyzer = analyzerパッケージ • shared = 共有 パブリックAPIはなく、内部使用のみを想定
20. _fe_analyzer_sharedパッケージと analyzerパッケージについての解説
21. Dartコードはどの様にASTに変換？
22. DartコードがASTに変換される流れ Dart　ソースコード Scanner Parser AstBuilder AST
23. DartコードがASTに変換される流れ Dart　ソースコード Scanner Parser AstBuilder AST _fe_analyzer_shared analyzer
24. Scannerとは 字句解析エンジン ソースコードをトークンと呼ばれる「意味を持つ最小単位」に分割する Scannerの動作 • ソースコードの文字列を一文字ずつ読み取り • 文字の並びをトークンに変換 • 双方向連結リストと呼ばれるデータ構造に変換 Scanner自体は構文の意味を理解しない
25. Parserとは 構文解析エンジン トークンの並びから構文構造を認識し、リスナーに対してイベントとして通知 Parserの動作 • トークンの双方向連結リストを受け取り • 構文を認識し • イベントを送信します ParserはASTの構築はしない
26. Parserのイベントについて パーサー: 「変数宣言が始まった！」 : listener.beginVariablesDeclaration(...) パーサー: 「型 'int' を見つけた！」 : listener.handleIdentifier('int', ...) パーサー: 「識別子 'x' を見つけた！」 : listener.handleIdentifier('x', ...) パーサー: 「変数初期化が始まった！」 : listener.beginVariableInitializer(...) パーサー: 「整数型の値２が見つかった！」: listener.handleLiteralInt(2) パーサー: 「変数初期化が終了した！」 : listener.endVariableInitializer(...) パーサー: 「変数宣言が終わった！」 : listener.endVariablesDeclaration(...) int x = 2;
27. AstBuilder Parserに対応するリスナー Parserからのイベントを受け取り、ASTノードを構築 AstBuilderの動作 • Parserのイベントを受け取る • イベントを元にASTノードを構築 AstBuilderは構文を解析しない
28. DartコードがASTに変換される流れ Dart　ソース コード Scanner Parser AstBuilder analyzer AST _fe_analyzer_shared analyzer OutlineBuilder/ DietListner KernelAST front_end
29. ASTはどのような構造？
30. ASTの実装を見てみる https://github.com/dart-lang/sdk/tree/main/pkg/analyzer/lib/dart/ast
31. ASTの実装を見てみる https://github.com/dart-lang/sdk/tree/main/pkg/analyzer/lib/dart/ast
32. SyntacticEntity /// 構文エンティティ（トークンまたは ASTノード）を表すインターフェース。 /// ソースファイル内の位置と範囲を持つ。 abstract class SyntacticEntity { /// 構文エンティティの最後の文字の次の文字までの、 /// ファイルの先頭からのオフセットを返す。 int get end; /// 構文エンティティのソース範囲内の文字数を返す。 int get length; /// 構文エンティティの最初の文字までの、ファイルの先頭からのオフセットを返す。 int get offset; }
33. Token abstract class Token implements SyntacticEntity { TokenType get type; // トークンの種類 String get lexeme; // ソースコード内の実際の文字列 Token? get previous; // 前のトークン Token? get next; // 次のトークン bool get isEof; // EOFトークンかどうか bool get isIdentifier; // 識別子かどうか bool get isKeyword; // キーワードかどうか bool get isOperator; // 演算子かどうか bool get isSynthetic; // 合成トークンかどうか … // 他にもis~というプロパティが複数 }
34. AstNode abstract final class AstNode implements SyntacticEntity { Token get beginToken; Token get endToken; Iterable<SyntacticEntity> get childEntities; AstNode? get parent; AstNode get root; }
35. beginToken/endToken トークン情報を保持 ノードがソースコード内のどの位置、範囲のものかを正確に特定 Token get beginToken; // 最初のトークン Token get endToken; // 最後のトークン // 例 a + b BinaryExpression ← 二項式を表すAstNode ├─ beginToken: Token('a') ← 開始トークン └─ endToken: Token('b') ← 終了トークン
36. childEntities 子要素へのアクセスが可能 そのノードの内容を構成する全てのエンティティ Iterable<SyntacticEntity> get childEntities; // 例 a + b を表すBinaryExpression childEntities = [ SimpleIdentifier('a'), // ASTノード Token('+'), // トークン SimpleIdentifier('b') // ASTノード ]
37. parent/root それぞれ親ノード、ルートノードを取得します // 親要素を取得する(親がない場合null) AstNode? get parent; // ルートノードを取得する(自身がルートの場合自身を参照) AstNode get root;
38. AstNodeの構造 1. beginToken : 開始トークン 2. endToken : 終了トークン 3. childEntities : 子要素 4. parent : 親ノード 5. root : ルートノード の5つの主要なプロパティでコードの特定と木構造を実現 実装するクラスによりその構文の意味を表現
39. AstNodeの種類 主要なAstNodeタイプ Elementタイプ 説明 例 MethodInvocation 関数の実行 print(‘hoge’) SimpleIdentifier 識別子 print(‘hoge’) ClassDeclaration クラス定義 class MyClass {...} ArgumentList 引数のリスト print(text) NamedType 型 Future<void> main {... CompilationUnit コンパイル単位 ファイル全体
40. ASTって元のコードの情報消えるのでは...?
41. analyzerのASTはCSTに近い！
42. ASTはどのように活用するの？
43. AstVisitorとして実装される Visitorパターン
44. Visitorパターンとは ASTの各ノードを訪問(visit)し、その種類に応じた処理を行うデザインパターン 仕組み 1. ASTの木構造をAstNodeのメソッドによりたどり 2. 訪れたノードに応じて適切な処理を実行 これにより拡張が容易かつ型安全な方法でノードの処理が可能
45. AstVisitor<R> analyzerパッケージで提供される基底クラス 全てのAstノードの型に対応するvisitメソッドを定義 abstract class AstVisitor<R> { R? visitFunctionDeclaration(FunctionDeclaration node); R? visitVariableDeclaration(VariableDeclaration node); R? visitSimpleIdentifier(SimpleIdentifier node); // ... 100以上のvisitメソッド }
46. acceptメソッド 全てのAstNodeはaccept()メソッドを持ちます 動作 accept(visitor)を呼ぶことにより、そのASTノードがvisitメソッドを呼ぶ E? accept<E>(AstVisitor<E> visitor); // ノードがVisitorを受け入れる node.accept(visitor) → visitor.visitXXX(node) // 対応するvisitメソッドが呼ばれる
47. visitChildrenメソッド 全てのAstNodeはvisitChildrenメソッドを持ちます 動作 • そのAstNodeの全ての子ノードのacceptを実行 visitorが子ノードを容易に走査ができる ように！ void visitChildren(AstVisitor visitor);
48. 主要なVisitorクラス AstVisitorを継承するクラスは複数あり、それぞれ動作が違う • RecursiveAstVisitor - 再帰的にすべてのノードを訪問 • SimpleAstVisitor - 何もしないデフォルト実装 • GeneralizingAstVisitor - 汎用的なノードタイプで処理 • BreadthFirstVisitor - 幅優先で走査
49. 主要なVisitorクラス AstVisitorを継承するクラスは複数あり、それぞれ動作が違う • RecursiveAstVisitor - 再帰的にすべてのノードを訪問 ◦ →visitChildrenを自動で呼び出してくれる • SimpleAstVisitor - 何もしないデフォルト実装 • GeneralizingAstVisitor - 汎用的なノードタイプで処理 • BreadthFirstVisitor - 幅優先で走査
50. 実際にVisitorを動かしてみる
51. Visitorを動かしてみる print関数の呼び出し箇所を探索するRecursiveAstVisitor class PrintCallVisitor extends RecursiveAstVisitor<void> { final List<MethodInvocation> methodCalls = []; @override void visitMethodInvocation(MethodInvocation node) { // 'print'関数の呼び出しかチェック if (node.methodName.name == 'print' && node.target == null) { methodCalls.add(node); } super.visitMethodInvocation(node); } }
52. 動かしてみましょう！
53. デモ
54. ASTを用いてprintを呼んでいる 箇所が特定できました🎉
55. renameも試してみましょう！
56. Visitorの集めた情報をもとにrenameする compilationUnit.accept(visitor); final methodCalls = visitor.methodCalls ..sort((a, b) => a.methodName.offset.compareTo(b.methodName.offset)); // 直前にbufferに追加したコードのオフセットを保持する変数 int lastOffset = 0; final buffer = StringBuffer(); for (var call in methodCalls) { //元のソースコードのprint以外のソースコードを bufferに追加 buffer.write(sourceCode.substring(lastOffset, call.methodName.offset)); // 'print'の代わりに'log.info'をbufferに追加 buffer.write('log.info'); // 次のループでprintの次からをbufferに追加できるようにoffsetをずらす lastOffset = call.methodName.length + call.methodName.offset; } // 最後のprintより後のコードをbufferに追加 buffer.write(sourceCode.substring(lastOffset));
57. デモ
58. ASTを用いてrenameができました🎉
59. このような場合は？ void main() async { final printText = 'print'; final inkJetPrinter = InkJetPrinter(); final laserPrinter = LaserPrinter(); await inkJetPrinter.print(printText); await laserPrinter.print(printText); }
60. このような場合は？ class Printer { Future<void> print(String message) async { await Future.delayed(Duration(seconds: 1)); log('Generic printing: $message'); } Future<void> printMultiple(List<String> messages) async { for (final message in messages) { await print(message); } } }
61. スコープや型を考慮する必要がある
62. ASTは”構造”は持ちますが ”意味”は持たない
63. Resolved AST
64. Resolved ASTとは これまで見てきたASTに加えて、以下の情報を持つAST 1. 型情報 2. 識別子の意味 3. Element Unresolved AST AstResolver Resolved AST
65. Resolved ASTの持つ型情報とは 全ての式AstNode(Expression)に型情報が付与されていること Unresolved ASTでの状態 Resolved ASTでの状態 // Resolved AST BinaryExpression('a + b') ├─ leftOperand: SimpleIdentifier('a') │ └─ staticType: int ├─ operator: Token('+') ├─ rightOperand: SimpleIdentifier('b') │ └─ staticType: int └─ staticType: int // intの足し算なのでint // ソースコード int a = 10; int b = 20; int c = a + b; // 'a + b'の型は？ // Unresolved AST BinaryExpression('a + b') └─ staticType: null // 型情報なし
66. Resolved ASTの持つ識別子の意味とは 識別子が何を参照しているかが解決していること Unresolved ASTでの状態 Resolved ASTでの状態 // Resolved AST SimpleIdentifier('x') └─ element: VariableElement // 変数xを参照 └─ staticType: int // 型はint // ソースコード: int y = x; SimpleIdentifier('x') // 文字列"x"としてのみ認識
67. Resolved ASTの持つElementとは コード内で宣言された要素（クラス、関数、変数など）の詳細情報 前提: AST（構文構造）と Element（意味構造）は別モデル 例: • 構文構造: コードの書き方、構造（「int x = 42;」という書き方） • 意味構造: コードの意味、内容（「xという名前のint型の変数」という意味） int x = 42; AST: 構文的な構造（書き方） └─ VariableDeclaration('int x = 42;') Element: 意味的な構造（意味） └─ VariableElement(name: 'x', type: int)
68. Elementの種類 主要なElementタイプ Elementタイプ 説明 例 VariableElement 変数 int x = 42; MethodElement メソッド void print() {...} ClassElement クラス class MyClass {...} ConstructorElement コンストラクタ const MyClass() PropertyAccessorElement ゲッター/セッター int get value => … LibraryElement ライブラリ ファイル全体
69. Elementの構造 ElementもASTのような階層構造を持つ LibraryElement └─ CompilationUnitElement ├─ ClassElement('Printer') │ ├─ MethodElement('print') │ │ └─ ParameterElement('msg') │ └─ FieldElement('count') └─ FunctionElement('main') └─ LocalVariableElement('args')
70. Elementが持つ情報 MethodElementの例 // ソースコード class Printer { void print(String msg) { ... } } // MethodElementが持つ情報 MethodElement { name: 'print', // メソッド名 returnType: void, // 戻り値の型 parameters: [ // パラメータリスト ParameterElement('msg', type: String) ], enclosingElement: ClassElement('Printer'), // 定義クラス // ... その他多くの情報 }
71. Elementが持つ情報 MethodElementの例 // ソースコード class Printer { void print(String msg) { ... } } // MethodElementが持つ情報 MethodElement { name: 'print', // メソッド名 returnType: void, // 戻り値の型 parameters: [ // パラメータリスト ParameterElement('msg', type: String) ], enclosingElement: ClassElement('Printer'), // 定義クラス // ... その他多くの情報 } どのクラスに定義されているかの情報！
72. 特定のクラスのメソッドのみを収集したい final List<SyntacticEntity> methodNames = []; @override void visitMethodInvocation(MethodInvocation node) { final element = node.methodName.element; if (element is MethodElement && node.methodName.name == 'print') { final enclosingElement = element.enclosingElement; // 指定されたクラスのメソッドかチェック if (enclosingElement is ClassElement && enclosingElement.name == 'InkJetPrinter') { methodNames.add(node.methodName); } } super.visitMethodInvocation(node); }
73. Resolved ASTはどう作るの？ Unresolved ASTと比べると結構複雑 final targetPath = File('lib/target_source.dart').absolute.path; final collection = AnalysisContextCollection( includedPaths: [Directory(targetPath).parent.path], ); final context = collection.contextFor(targetPath); final result = await context.currentSession.getResolvedUnit(targetPath) as ResolvedUnitResult; final unit = result.unit;
74. デモ
75. ResolvedASTを用いて 型を考慮したrenameができました🎉
76. まとめ • ASTはコードの構造を解析し、木構造にしたもの • コードをASTに変換することによりプログラムが理解しやすく • DartのASTはanalyzerのASTとKernelASTの2種類 • ScannerとParserによりコードが解析され、AstBuilderによって構築 • ASTはVisitorというものを用いて解析 • RecursiveAstVisitorがよく利用される • 型やスコープなど高度な情報を扱いたいときはResolvedASTが必要
77. ご清聴ありがとうございました