コードハイライトテスト

この記事は新しいコードハイライト機能をテストするために使用されます。シンタックスハイライト、コピーボタン、言語表示などが含まれます。

JavaScript

JAVASCRIPT

function fibonacci(n) {
  if (n <= 1) return n;
  return fibonacci(n - 1) + fibonacci(n - 2);
}


const result = fibonacci(10);
console.log(`10番目のフィボナッチ数は:${result}`);

// 非同期/待機
const asyncFunction = async () => {
  try {
    const response = await fetch('/api/data');
    const data = await response.json();
    return data;
  } catch (error) {
    console.error('データ取得エラー:', error);
  }
};
クリックして展開し、詳細を表示

行番号付きコードブロック

PYTHON
 1# 行番号付きPythonコード
 2import asyncio
 3from typing import List, Optional
 4
 5class DataProcessor:
 6    def __init__(self, data: List[dict]):
 7        self.data = data
 8
 9    def process(self) -> Optional[dict]:
10        """データを処理して結果を返す"""
11        if not self.data:
12            return None
13
14        result = {
15            'total': len(self.data),
16            'processed': []
17        }
18
19        for item in self.data:
20            if self.validate_item(item):
21                result['processed'].append(item)
22
23        return result
クリックして展開し、詳細を表示

特定行のハイライト

GO
 1package main
 2
 3import "fmt"  // この行がハイライトされます
 4
 5func main() {
 6    message := "こんにちは、世界!"  // この行もハイライトされます
 7
 8    fmt.Println(message)  // この行もハイライトされます
 9
10    for i := 0; i < 3; i++ {
11        fmt.Printf("カウント:%d\n", i)
12    }
13}
クリックして展開し、詳細を表示

ファイル名付きコードブロック

api.ts
// TypeScript API
interface ApiResponse<T> {
  data: T;
  status: number;
  message: string;
}

interface User {
  id: number;
  name: string;
  email: string;
  avatar?: string;
}

class ApiClient {
  private baseURL: string;
  private headers: Record<string, string>;

  constructor(baseURL: string, apiKey?: string) {
    this.baseURL = baseURL;
    this.headers = {
      'Content-Type': 'application/json',
      ...(apiKey && { 'Authorization': `Bearer ${apiKey}` })
    };
  }

  async get<T>(endpoint: string): Promise<ApiResponse<T>> {
    const response = await fetch(`${this.baseURL}${endpoint}`, {
      method: 'GET',
      headers: this.headers,
    });

    if (!response.ok) {
      throw new Error(`HTTPエラー!ステータス:${response.status}`);
    }

    return response.json();
  }

  async post<T>(endpoint: string, data: any): Promise<ApiResponse<T>> {
    const response = await fetch(`${this.baseURL}${endpoint}`, {
      method: 'POST',
      headers: this.headers,
      body: JSON.stringify(data),
    });

    return response.json();
  }
}

const client = new ApiClient('https://api.example.com', 'your-api-key');

async function getUsers(): Promise<User[]> {
  try {
    const response = await client.get<User[]>('/users');
    return response.data;
  } catch (error) {
    console.error('ユーザー取得エラー:', error);
    return [];
  }
}
クリックして展開し、詳細を表示

プレーンテキストコードブロック

PLAINTEXT
これはプレーンテキストコードブロックです。
シンタックスハイライトはありません。
ここでコピー機能をテストできます。

function test() {
    console.log("これはテストです。");
}
クリックして展開し、詳細を表示

インラインコード

これはインラインコードの例です:const x = 42;npm installgit commit -m "更新"


著作権表示

著者: 名字还没想好

リンク: http://localhost:1313/ja/posts/code-highlighting-test/

ライセンス: CC BY-NC-SA 4.0

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License. Please attribute the source, use non-commercially, and maintain the same license.

コメント

検索を開始

キーワードを入力して記事を検索

↑↓
ESC
⌘K ショートカット