Markdown-06-代码

Markdown 提供了多种方式来展示代码，从简单的行内代码到复杂的代码块，满足不同场景下的代码展示需求。

行内代码

如果是段落上的一个函数或片段的代码可以用 ` 把它包起来，例如：

`printf()` 函数

效果：

printf() 函数

常见用法：

• 函数名：使用 console.log() 输出信息
• 变量名：将值赋给 userName 变量
• 命令行：运行 npm install 安装依赖
• 键盘按键：按 Ctrl+C 复制内容
• 文件名：编辑 index.html 文件

特殊字符转义

当需要在行内代码中显示反引号或其他特殊字符时，需要进行转义处理。

• 显示单反引号：

包含`` ` ``的代码

效果：

包含`的代码

• 显示双反引号：

包含``` `` ```的代码

效果：

包含``的代码

其他特殊字符处理：

• HTML 标签：<div> 元素
• 数学符号：计算 x + y = z
• 特殊符号：使用   表示空格

代码区块

缩进式代码块

代码区块使用 2 个空格缩进：

正常文本段落

	public class HelloWorld {
			public static void main(String[] args) {
					System.out.println("Hello World");
			}
	}

继续正常文本

效果：

正常文本段落

public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello World");
}
}

继续正常文本

三反引号代码块

缩进式代码块有个明显的缺点，就是无法指定编程语言，也就无法高亮显示代码。

也可以用``` 包裹一段代码，并指定一种语言（也可以不指定）：

java public class HelloWorld { public static void main(String[] args) { System.out.println("Hello World"); } }

效果：

public class HelloWorld {
		public static void main(String[] args) {
				System.out.println("Hello World");
		}
}

语言标识和语法高亮

在三反引号后添加语言标识符可以启用语法高亮功能。

常用语言标识符列表：

• javascript / js：JavaScript
• python / py：Python
• html：HTML
• css：CSS
• sql：SQL
• json：JSON
• xml：XML
• yaml / yml：YAML
• bash / shell：Shell脚本
• java：Java
• cpp / c++：C++
• csharp / c#：C#
• php：PHP
• ruby / rb：Ruby
• go：Go语言
• rust：Rust
• typescript / ts：TypeScript
• diff：代码差异对比，常用于展示版本控制中的变更

代码块的高级特性

行号显示

某些 Markdown 渲染器支持显示行号，通过特定的语法或配置实现：

```javascript {.line-numbers}
function fibonacci(n) {
if (n <= 1) return n;
return fibonacci(n - 1) + fibonacci(n - 2);
}

console.log(fibonacci(10));
```

或者使用：

javascript showLineNumbers const numbers = [1, 2, 3, 4, 5]; const doubled = numbers.map(x => x * 2); const sum = doubled.reduce((a, b) => a + b, 0); console.log(`总和: ${sum}`);

代码差异对比

用于显示代码的添加、删除或修改，常用于展示版本控制中的变更：

```diff
function calculateTotal(items) {
- let total = 0;
+ let total = 0.0;

for (let item of items) {
- total += item.price;
+ total += parseFloat(item.price);
}

+ // 保留两位小数
+ total = Math.round(total * 100) / 100;
return total;
}
```

效果：

function calculateTotal(items) {
-   let total = 0;
+   let total = 0.0;
    
    for (let item of items) {
-       total += item.price;
+       total += parseFloat(item.price);
    }
    
+   // 保留两位小数
+   total = Math.round(total * 100) / 100;
    return total;
}