/* MD / 富文本中的 .toc（含博客园搬家等嵌套结构）；.toc-box 在侧栏，不受影响 */
#content_views .toc,
/* 编辑器常在目录前后插入空 p（:empty 仍占 20px），一并去掉避免顶空隙 */
#content_views.markdown_views > p:empty:has(+ .toc),
#content_views.markdown_views > .toc + p:empty,
/* 富文本旧版目录标记 */
#content_views.htmledit_views #main-toc,
#content_views.htmledit_views #hr-toc,
#content_views.htmledit_views p[id*=\”-toc\”] {
display: none !important;
}
/* 目录去掉后，紧跟的首个标题不再多出一块上边距 */
#content_views.markdown_views > .toc + h1,
#content_views.markdown_views > .toc + h2,
#content_views.markdown_views > .toc + h3,
#content_views.markdown_views > .toc + h4,
#content_views.markdown_views > .toc + p:empty + h1,
#content_views.markdown_views > .toc + p:empty + h2,
#content_views.markdown_views > .toc + p:empty + h3,
#content_views.markdown_views > .toc + p:empty + h4 {
margin-top: 0 !important;
}
在摇滚乐排练室里，没有任何声音比一台 Marshall 全电子管箱头在过载边缘咆哮更令人血脉喷张。当吉他或低音贝斯的信号电平超过真空管（Vacuum Tube）线性放大区时，正弦波的波峰与波谷会被自然地压缩压平，产生极其丰富温暖的偶次与奇次谐波——这就是乐手们痴迷的经典“管箱过载”（Tube Overdrive）。
但在数字音频领域，单纯将信号数值限制在 $[-1.0, 1.0]$（数字硬剪切 Hard Clipping）只会产生刺耳干瘪的高频杂音。在 Web 端利用 Web Audio API 打造专业级的模拟失真效果器，核心技术在于通过 WaveShaperNode 自定义精细的非线性传输函数（Transfer Curve），配合前置增益塑造、超采样去混叠以及后置箱体模拟滤波器链，才能在浏览器内逼真还原纯正的模拟过载质感。
非线性传输曲线与谐波物理
数字失真的本质是将输入样本值 $x \\in [-1.0, 1.0]$，通过一个非线性映射函数 $f(x)$ 转换为输出样本值 $y \\in [-1.0, 1.0]$。
1. 硬剪切（Hard Clipping） vs 软剪切（Soft Clipping）
-
硬剪切：$$f(x) = \\begin{cases} -1.0, & x < -1.0 \\ x, & -1.0 \\le x \\le 1.0 \\ 1.0, & x > 1.0 \\end{cases}$$波形在边缘出现尖锐的不可导直角拐点。在频域上，这会激发大量不和谐的高次奇次谐波，听觉感受非常毛刺、割裂，类似数字电路损坏的爆音。
-
软剪切（模拟管箱饱和仿真）：真空管的饱和过程是渐进的。一种经典的类管箱软剪切函数是基于双曲正切（$\\tanh$）或带有非对称多项式的 Sigmoid 变体：$$f(x) = \\frac{x}{\\sqrt{1 + x^2}} \\quad \\text{或} \\quad f(x) = \\tanh(k \\cdot x)$$当输入幅度较小时，$f(x) \\approx x$，保持纯净的线性放大；当幅度逐渐升高进入弯曲区域，波峰圆润地向饱和区过渡，引入温润的二倍频、三倍频谐波。若在正半周与负半周施加微弱的不对称偏置（DC Offset Bias），就能激发更多具有音乐美感的偶次谐波（Even Harmonics）。
致命陷阱：数字混叠与 4x 超采样（Oversampling）
当非线性传递函数将波形强行压扁时，频域上会产生高于奈奎斯特频率（Nyquist Frequency，即采样率的一半，如 44.1kHz 采样率下的 22.05kHz）的高阶谐波。
由于数字系统无法表示高于奈奎斯特极限的频率，这些高频成分不会凭空消失，而是像光线在镜面上反射一样，“镜像折返”到人耳可听的音频频段内，形成极其难听的不谐和金属回声。这就是数字混叠（Aliasing）。
Web Audio API 的 WaveShaperNode 提供了关键的硬件级防混叠机制：oversample 属性。将其设置为 '4x'，浏览器会在底层将输入信号升采样到 176.4kHz 或 192kHz 进行非线性变换，经由陡峭的抗混叠低通滤波后再降采样回原速率，彻底消除数字镜像毛刺。
完整电路链架构实现
一个合格的模拟过载效果器不仅有波形塑形器，还必须包含音色塑造的三段架构：
下面是基于 TypeScript 封装的完整管箱过载效果器类：
export type DistortionType = 'tube_warm' | 'heavy_overdrive' | 'fuzz_bite';
export class AnalogOverdriveEngine {
private ctx: AudioContext;
private preGainNode: GainNode;
private tightFilter: BiquadFilterNode;
private waveShaper: WaveShaperNode;
private cabFilter: BiquadFilterNode;
private postGainNode: GainNode;
public input: AudioNode;
public output: AudioNode;
constructor(context: AudioContext) {
this.ctx = context;
// 1. 前置增益（控制过载深度）
this.preGainNode = this.ctx.createGain();
this.preGainNode.gain.value = 1.0;
// 2. 前置切频（Tight Filter），切除 90Hz 以下浑浊低频
this.tightFilter = this.ctx.createBiquadFilter();
this.tightFilter.type = 'highpass';
this.tightFilter.frequency.value = 90;
this.tightFilter.Q.value = 0.707;
// 3. 核心非线性波形塑造器，开启 4x 超采样去混叠
this.waveShaper = this.ctx.createWaveShaper();
this.waveShaper.oversample = '4x';
this.setDriveCurve('tube_warm', 3.0);
// 4. 后置箱体频响仿真（Cabinet Low-pass），切除 5.5kHz 以上毛刺
this.cabFilter = this.ctx.createBiquadFilter();
this.cabFilter.type = 'lowpass';
this.cabFilter.frequency.value = 5500;
this.cabFilter.Q.value = 1.2;
// 5. 主输出主音量增益
this.postGainNode = this.ctx.createGain();
this.postGainNode.gain.value = 0.8;
// 构建声学信号链路
this.preGainNode
.connect(this.tightFilter)
.connect(this.waveShaper)
.connect(this.cabFilter)
.connect(this.postGainNode);
this.input = this.preGainNode;
this.output = this.postGainNode;
}
/**
* 生成不同声学特性的非线性传输曲线 Float32Array
*/
public generateCurve(type: DistortionType, drive: number, sampleCount: number = 4096): Float32Array {
const curve = new Float32Array(sampleCount);
const k = Math.max(0.1, drive);
for (let i = 0; i < sampleCount; i++) {
// 归一化自变量 x 到 [-1.0, 1.0]
const x = (i * 2) / sampleCount – 1;
switch (type) {
case 'tube_warm': {
// 仿电子管非对称软剪切：正半周微偏置激发偶次谐波，负半周较软
const bias = 0.1;
const biasedX = x + bias;
if (biasedX < -1) {
curve[i] = -0.98;
} else if (biasedX > 1) {
curve[i] = 0.98;
} else {
// 使用三次多项式软饱和曲线
curve[i] = Math.tanh(biasedX * k) – Math.tanh(bias * k);
}
break;
}
case 'heavy_overdrive': {
// 对称双曲正切重过载
curve[i] = Math.tanh(x * k * 2.5);
break;
}
case 'fuzz_bite': {
// 激进的阶梯硬过载（Fuzz 效果）
const sign = Math.sign(x);
curve[i] = sign * (1 – Math.exp(-Math.abs(x * k * 4)));
break;
}
}
}
return curve;
}
/**
* 动态更新过载音色与增益参数
*/
public setDriveCurve(type: DistortionType, drive: number): void {
const curve = this.generateCurve(type, drive);
this.waveShaper.curve = curve;
}
/**
* 设置过载推子前级增益
*/
public setDrive(amount: number): void {
const safeAmount = Math.max(0.1, Math.min(amount, 10.0));
// 使用平滑时间常数避免调节参数时产生爆音（Click/Pop）
this.preGainNode.gain.setTargetAtTime(safeAmount, this.ctx.currentTime, 0.02);
}
/**
* 设置箱体切频亮度
*/
public setToneBrightness(freqHz: number): void {
const safeFreq = Math.max(2000, Math.min(freqHz, 12000));
this.cabFilter.frequency.setTargetAtTime(safeFreq, this.ctx.currentTime, 0.02);
}
}
模拟过载调优避坑要诀
在将失真引擎接入浏览器实时音频交互时，务必坚守两条工程铁律：
用严谨的数学函数去拟合模拟电路的物理非线性，在数字的冷峻之中注入电子管的温热。只要滤波、去混叠和曲线曲率调校得当，纯浏览器的 Web Audio 同样能发出充满野性与生命力的经典摇滚失真。
