JSON-js核心实现：json2.js源码深度剖析

本文深入解析了Douglas Crockford的json2.js库的核心实现机制，涵盖了JSON.stringify方法的完整实现原理、安全机制、数据类型处理、正则表达式防御体系、toJSON方法的扩展机制以及replacer和reviver函数的巧妙运用。文章详细分析了该库如何通过复杂的递归遍历、安全字符转义、循环引用检测等多重防护措施，确保在各种边缘情况下都能安全可靠地工作。

JSON.stringify方法实现原理与安全机制

JSON.stringify作为JSON序列化的核心方法，其实现原理涉及复杂的数据类型处理、递归遍历和安全防护机制。在Douglas Crockford的json2.js实现中，该方法不仅提供了标准的序列化功能，还内置了多重安全防护措施，确保在各种边缘情况下都能安全可靠地工作。

核心实现架构

JSON.stringify方法的实现采用了模块化的函数设计，主要包含以下几个核心组件：

// 主要函数结构
JSON.stringify = function (value, replacer, space) {
    // 参数验证和处理
    // 初始化格式化配置
    // 调用核心字符串化函数
    return str("", {"": value});
};

function str(key, holder) {
    // 递归处理各种数据类型
    // 应用replacer函数
    // 处理toJSON方法
    // 安全字符转义
}

function quote(string) {
    // 字符串安全转义处理
    // 控制字符和特殊字符转义
}

数据类型处理机制

JSON.stringify需要处理JavaScript中的所有基本数据类型和复杂数据结构，其类型处理逻辑如下表所示：

数据类型 处理方式 特殊处理
String 引号包裹 + 字符转义 处理控制字符和Unicode字符
Number 直接转换为字符串 非有限数转换为null
Boolean 转换为"true"或"false" -
Null 转换为"null" -
Undefined 在数组中转换为null，在对象中忽略 -
Object 递归处理所有属性 处理toJSON方法和循环引用
Array 递归处理所有元素 保持顺序和结构

安全转义机制

字符串转义是JSON序列化中最关键的安全环节，json2.js使用了精心设计的正则表达式来识别需要转义的特殊字符：

var rx_escapable = /[\\"\u0000-\u001f\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g;

function quote(string) {
    rx_escapable.lastIndex = 0;
    return rx_escapable.test(string)
        ? "\"" + string.replace(rx_escapable, function (a) {
            var c = meta[a];
            return typeof c === "string"
                ? c
                : "\\u" + ("0000" + a.charCodeAt(0).toString(16)).slice(-4);
        }) + "\""
        : "\"" + string + "\"";
}

这个转义机制确保所有可能引起解析问题的字符都被正确处理，包括：

  • 控制字符（\u0000-\u001f）
  • 删除字符和特殊Unicode字符
  • 各种方向的隔离字符
  • 零宽字符和格式控制字符

replacer参数处理机制

replacer参数提供了强大的数据过滤和转换能力，支持两种模式：

数组模式 - 白名单过滤：

// 只序列化指定的属性
JSON.stringify({a: 1, b: 2, c: 3}, ['a', 'c'])
// 结果: '{"a":1,"c":3}'

函数模式 - 自定义转换：

// 自定义值转换
JSON.stringify({date: new Date()}, function(key, value) {
    return value instanceof Date ? value.toISOString() : value;
})

循环引用检测与处理

虽然原生JSON.stringify不能处理循环引用，但json2.js的实现通过递归调用栈深度控制来防止无限递归：

mermaid

toJSON方法集成

JSON.stringify支持对象的toJSON方法，这为自定义序列化提供了强大的扩展能力：

Date.prototype.toJSON = function () {
    return isFinite(this.valueOf())
        ? this.getUTCFullYear() + "-" + 
          f(this.getUTCMonth() + 1) + "-" + 
          f(this.getUTCDate()) + "T" + 
          f(this.getUTCHours()) + ":" + 
          f(this.getUTCMinutes()) + ":" + 
          f(this.getUTCSeconds()) + "Z"
        : null;
};

格式化输出控制

space参数支持灵活的格式化输出，包括数字空格和自定义字符串缩进：

// 使用4个空格缩进
JSON.stringify({a: 1, b: {c: 2}}, null, 4)

// 使用制表符缩进  
JSON.stringify({a: 1, b: {c: 2}}, null, "\t")

格式化算法通过维护缩进栈来实现层次化的输出结构，确保嵌套对象的正确缩进。

错误处理与边界情况

JSON.stringify实现了完善的错误处理机制，包括：

  1. 参数验证：检查replacer参数类型是否正确
  2. 递归深度控制：防止过深嵌套导致的栈溢出
  3. 非法值处理：正确处理undefined、function等非法JSON值
  4. 数字安全：确保Infinity和NaN被转换为null

性能优化策略

实现中采用了多项性能优化措施：

  • 正则表达式预编译和重用
  • 类型判断优先处理简单类型
  • 避免不必要的字符串操作
  • 使用局部变量缓存频繁访问的属性

这种实现确保了JSON.stringify方法在各种场景下都能提供安全、可靠且高效的JSON序列化服务，为Web应用程序的数据交换提供了坚实的基础设施支持。

正则表达式防御体系解析

在JSON-js库中，正则表达式防御体系是保障JSON解析安全性的核心机制。这个体系通过多层正则表达式验证，有效防止了恶意代码注入和意外代码执行风险，为使用eval()进行JSON解析提供了坚实的安全保障。

防御体系架构概览

JSON-js的正则表达式防御体系采用分层设计，包含五个核心正则表达式，每个都承担着特定的安全检测职责：

var rx_one = /^[\],:{}\s]*$/;
var rx_two = /\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g;
var rx_three = /"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g;
var rx_four = /(?:^|:|,)(?:\s*\[)+/g;
var rx_dangerous = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g;

各层防御机制详解

第一层：危险字符检测与转义（rx_dangerous）

rx_dangerous正则表达式负责识别和处理JavaScript可能错误处理的Unicode字符，这些字符在某些浏览器中可能被静默删除或错误解释为行结束符。

mermaid

危险字符范围包括：

  • 控制字符（\u0000-\u001f）
  • 删除字符（\u007f-\u009f）
  • 特定Unicode范围的字符（\u0600-\u0604等）
  • 零宽字符和格式控制字符

处理机制将危险字符转换为安全的Unicode转义序列：

text = text.replace(rx_dangerous, function (a) {
    return "\\u" + ("0000" + a.charCodeAt(0).toString(16)).slice(-4);
});
第二层：四阶段正则验证体系

JSON解析的第二阶段采用四步正则表达式验证流程，专门设计来绕过IE和Safari浏览器中正则表达式引擎的性能限制。

mermaid

步骤1：转义序列标准化（rx_two）
/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g

此正则匹配合法的JSON转义序列，包括：

  • 特殊字符转义：\", \\, \/, \b, \f, \n, \r, \t
  • Unicode转义：\uXXXX（4位十六进制）

处理方式：将所有合法转义序列替换为"@"字符，消除转义序列的复杂性。

步骤2：值令牌识别（rx_three）
/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g

此正则识别所有JSON基本值类型：

  • 字符串：双引号包围的任意字符（除未转义的双引号、反斜杠、换行符）
  • 布尔值：true 或 false
  • 空值：null
  • 数字：整数、浮点数、科学计数法表示

处理方式：将所有值令牌替换为"]"字符，简化结构分析。

步骤3：结构括号清理（rx_four）
/(?:^|:|,)(?:\s*\[)+/g

此正则匹配并移除多余的开始括号，特别是在冒号、逗号后或文本开头的括号序列。

步骤4：最终结构验证（rx_one）
/^[\],:{}\s]*$/

此正则验证经过前三步处理后的文本是否只包含合法的JSON结构字符：

  • 方括号：[, ]
  • 花括号：{, }
  • 冒号：:
  • 逗号：,
  • 空白字符

安全威胁防护分析

代码注入防护

防御体系有效防止了以下类型的代码注入攻击：

攻击类型 示例 防御机制
函数调用 {"x": alert(1)} rx_three值令牌验证
构造函数 {"x": new Date()} rx_three值令牌验证
赋值操作 {"x": a=1} rx_one结构字符限制
表达式 {"x": 1+1} rx_three值令牌验证
Unicode安全处理

rx_dangerous正则专门处理JavaScript引擎可能错误解释的Unicode字符，防止：

  • 字符静默删除导致的解析错误
  • 特殊字符被错误解释为语法元素
  • 零宽字符导致的逻辑混淆

性能与兼容性考量

该防御体系的设计充分考虑了老版本浏览器的性能限制：

  • 分阶段处理避免单个复杂正则的性能问题
  • 使用简单替换操作提高IE和Safari的兼容性
  • 渐进式验证确保早期失败，减少不必要的处理

实际应用示例

// 安全解析示例
const safeJSON = '{"name": "value", "number": 42}';
JSON.parse(safeJSON); // 成功解析

// 恶意代码被拦截示例
const maliciousJSON = '{"x": (function(){alert("hacked")})()}';
JSON.parse(maliciousJSON); // 抛出SyntaxError

// Unicode攻击防护示例
const unicodeAttack = '{"x": "\u2028alert(1)\u2029"}';
JSON.parse(unicodeAttack); // 安全处理，不会执行alert

防御体系局限性

虽然该正则表达式防御体系非常强大，但仍需注意：

  1. 依赖正则表达式引擎：不同浏览器的正则表达式实现可能存在细微差异
  2. 无法防止所有攻击：极端的Unicode滥用可能绕过某些检查
  3. 性能开销：多层正则验证在大量数据处理时可能影响性能

最佳实践建议

  1. 始终验证输入：即使在使用了JSON-js的情况下，也应验证输入数据的来源和格式
  2. 使用现代浏览器：优先使用原生JSON.parse方法，它没有eval的安全风险
  3. 定期更新：关注JSON-js库的更新，获取最新的安全修复
  4. 深度防御：结合其他安全措施，如CSP（内容安全策略）

JSON-js的正则表达式防御体系展示了如何在不得不使用eval()的情况下，通过精心设计的正则表达式验证来最大程度地降低安全风险。这种分层防御、渐进验证的设计思路值得所有需要处理不可信输入的开发人员学习和借鉴。

toJSON方法的扩展与自定义序列化

在JSON-js库中，toJSON方法是一个强大的扩展机制，允许开发者自定义对象的序列化行为。这个机制在json2.js的核心实现中扮演着关键角色，为复杂对象的JSON序列化提供了灵活的解决方案。

toJSON方法的工作原理

toJSON方法的核心思想是：当JSON.stringify()遇到一个对象时，如果该对象拥有toJSON方法，就会调用该方法来获取序列化结果，而不是直接序列化对象本身。这种设计模式遵循了"约定优于配置"的原则。

// json2.js中的关键实现代码
if (
    value
    && typeof value === "object"
    && typeof value.toJSON === "function"
) {
    value = value.toJSON(key);
}

这个机制的工作流程可以用以下流程图表示：

mermaid

内置类型的toJSON实现

JSON-js库为JavaScript内置类型提供了默认的toJSON方法实现：

数据类型 toJSON实现 返回值说明
Date 返回ISO格式字符串 "2023-05-10T12:34:56Z"
Boolean 返回原始值 true/false
Number 返回原始值 123.45
String 返回原始值 "hello" 
// Date类型的toJSON实现示例
Date.prototype.toJSON = function () {
    return isFinite(this.valueOf())
        ? this.getUTCFullYear() + "-" +
          f(this.getUTCMonth() + 1) + "-" +
          f(this.getUTCDate()) + "T" +
          f(this.getUTCHours()) + ":" +
          f(this.getUTCMinutes()) + ":" +
          f(this.getUTCSeconds()) + "Z"
        : null;
};

自定义toJSON方法的实践应用

1. 自定义对象序列化

当处理复杂业务对象时，自定义toJSON方法可以精确控制序列化输出：

class User {
    constructor(name, email, password) {
        this.name = name;
        this.email = email;
        this.password = password; // 敏感信息
        this.createdAt = new Date();
    }
    
    toJSON() {
        // 排除敏感字段，添加计算属性
        return {
            name: this.name,
            email: this.email,
            createdAt: this.createdAt.toISOString(),
            profileLink: `/users/${this.name.toLowerCase()}`
        };
    }
}

const user = new User("Alice", "alice@example.com", "secret");
console.log(JSON.stringify(user));
// 输出: {"name":"Alice","email":"alice@example.com","createdAt":"2023-05-10T12:34:56.789Z","profileLink":"/users/alice"}
2. 处理循环引用

虽然JSON-js提供了cycle.js来处理循环引用，但toJSON方法也可以用于简单的循环引用处理：

class TreeNode {
    constructor(value) {
        this.value = value;
        this.children = [];
    }
    
    addChild(child) {
        this.children.push(child);
    }
    
    toJSON() {
        return {
            value: this.value,
            children: this.children.map(child => child.value),
            childCount: this.children.length
        };
    }
}
3. 数据转换和格式化

toJSON方法非常适合进行数据格式转换：

class Currency {
    constructor(amount, currencyCode = 'USD') {
        this.amount = amount;
        this.currencyCode = currencyCode;
    }
    
    toJSON() {
        return {
            value: this.amount,
            formatted: new Intl.NumberFormat('en-US', {
                style: 'currency',
                currency: this.currencyCode
            }).format(this.amount),
            currency: this.currencyCode
        };
    }
}

const price = new Currency(99.99, 'USD');
console.log(JSON.stringify({ product: 'Book', price }));
// 输出: {"product":"Book","price":{"value":99.99,"formatted":"$99.99","currency":"USD"}}

toJSON方法的参数机制

toJSON方法接收一个可选的key参数，该参数表示当前对象在父对象中的属性名：

class SmartObject {
    constructor(data) {
        this.data = data;
    }
    
    toJSON(key) {
        console.log(`Serializing property: ${key}`);
        return {
            originalKey: key,
            value: this.data,
            timestamp: new Date().toISOString()
        };
    }
}

const obj = {
    user: new SmartObject('Alice'),
    item: new SmartObject('Book')
};

JSON.stringify(obj);
// 控制台输出: 
// Serializing property: user
// Serializing property: item

与replacer函数的协作

toJSON方法与JSON.stringify()的replacer参数协同工作，执行顺序如下：

mermaid

最佳实践和注意事项

  1. 保持幂等性：toJSON方法应该总是返回相同的结果给定相同的对象状态
  2. 避免副作用：方法不应该修改对象的状态或其他全局状态
  3. 性能考虑：对于大型对象，确保toJSON方法的执行效率
  4. 错误处理：妥善处理可能出现的异常情况
// 良好的toJSON实现示例
class SafeObject {
    constructor(data) {
        this.data = data;
        this.version = 1;
    }
    
    toJSON() {
        try {
            return {
                data: this.data,
                version: this.version,
                serializedAt: new Date().toISOString()
            };
        } catch (error) {
            // 优雅的错误处理
            return {
                error: "Serialization failed",
                message: error.message
            };
        }
    }
}

高级应用场景

1. 版本控制序列化
class VersionedData {
    constructor(data, version = 1) {
        this._data = data;
        this._version = version;
    }
    
    toJSON() {
        if (this._version === 1) {
            return { data: this._data, v: 1 };
        } else {
            return { 
                metadata: { version: this._version },
                content: this._data 
            };
        }
    }
}
2. 条件序列化
class ConditionalObject {
    constructor(data, options = {}) {
        this.data = data;
        this.options = options;
    }
    
    toJSON() {
        const result = { data: this.data };
        
        if (this.options.includeTimestamp) {
            result.timestamp = new Date().toISOString();
        }
        
        if (this.options.includeMetadata) {
            result.metadata = { 
                serializedBy: 'CustomSerializer',
                version: '1.0' 
            };
        }
        
        return result;
    }
}

通过toJSON方法的灵活运用，开发者可以完全控制对象的序列化行为，实现从简单的数据过滤到复杂的业务逻辑处理等各种需求。这种机制使得JSON-js库不仅是一个简单的序列化工具，更是一个强大的数据转换框架。

replacer和reviver函数的巧妙运用

JSON序列化和反序列化过程中的replacer和reviver函数是JSON-js库中极具灵活性的特性，它们为开发者提供了对JSON转换过程的细粒度控制能力。这两个函数虽然功能相似但方向相反，一个在序列化时工作，另一个在反序列化时工作，共同构成了强大的数据处理机制。

replacer函数：序列化过程的智能过滤器

replacer函数在JSON.stringify()过程中被调用，它接收两个参数：当前属性的键名和对应的值。这个函数可以返回一个新的值来替换原始值，或者返回undefined来完全排除该属性。

// 基础replacer函数示例
const data = {
  name: "John",
  age: 30,
  password: "secret123",
  createdAt: new Date()
};

const jsonString = JSON.stringify(data, function(key, value) {
  if (key === "password") {
    return undefined; // 排除敏感信息
  }
  if (value instanceof Date) {
    return value.toISOString(); // 转换日期格式
  }
  return value; // 保持其他值不变
});

console.log(jsonString);
// 输出: {"name":"John","age":30,"createdAt":"2023-08-26T11:53:52.000Z"}

replacer函数还可以作为数组使用，这种情况下它起到白名单过滤器的作用：

const user = {
  name: "Alice",
  age: 25,
  email: "alice@example.com",
  password: "securepass",
  preferences: { theme: "dark", language: "en" }
};

// 只序列化指定的属性
const filteredJson = JSON.stringify(user, ["name", "email", "preferences"]);
console.log(filteredJson);
// 输出: {"name":"Alice","email":"alice@example.com","preferences":{"theme":"dark","language":"en"}}

reviver函数：反序列化过程的转换器

reviver函数在JSON.parse()过程中被调用，它同样接收键名和值作为参数，但工作在反序列化阶段。这使得我们可以在解析JSON字符串时进行数据转换和验证。

const jsonText = `{
  "name": "Bob",
  "age": 35,
  "birthDate": "1990-05-15T00:00:00.000Z",
  "metadata": {
    "createdAt": "2023-01-01T12:00:00.000Z",
    "updatedAt": "2023-08-26T10:30:00.000Z"
  }
}`;

const parsedData = JSON.parse(jsonText, function(key, value) {
  // 将ISO日期字符串转换回Date对象
  if (typeof value === "string" && 
      /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z$/.test(value)) {
    return new Date(value);
  }
  return value;
});

console.log(parsedData.birthDate instanceof Date); // true
console.log(parsedData.metadata.createdAt instanceof Date); // true

高级应用场景

1. 循环引用处理

replacer函数可以用于检测和处理循环引用：

function createCircularReplacer() {
  const seen = new WeakSet();
  return function(key, value) {
    if (typeof value === "object" && value !== null) {
      if (seen.has(value)) {
        return "[Circular Reference]";
      }
      seen.add(value);
    }
    return value;
  };
}

const obj = { name: "Circular" };
obj.self = obj;

const safeJson = JSON.stringify(obj, createCircularReplacer());
console.log(safeJson); // {"name":"Circular","self":"[Circular Reference]"}
2. 数据类型转换

通过reviver函数实现复杂的数据类型恢复：

const complexJson = `{
  "user": {
    "name": "Eve",
    "permissions": ["read", "write", "delete"],
    "settings": "{\\"theme\\":\\"dark\\",\\"notifications\\":true}"
  }
}`;

const result = JSON.parse(complexJson, function(key, value) {
  if (key === "settings" && typeof value === "string") {
    try {
      return JSON.parse(value); // 解析嵌套的JSON字符串
    } catch {
      return value;
    }
  }
  if (key === "permissions" && Array.isArray(value)) {
    return new Set(value); // 转换为Set对象
  }
  return value;
});

console.log(result.user.settings.theme); // "dark"
console.log(result.user.permissions instanceof Set); // true
3. 数据验证和清理

在解析过程中进行数据验证：

const userInput = `{
  "username": "admin",
  "email": "invalid-email",
  "age": 150,
  "roles": ["user", "admin"]
}`;

const validated = JSON.parse(userInput, function(key, value) {
  switch (key) {
    case "email":
      if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
        return "invalid@example.com"; // 提供默认值
      }
      return value;
    case "age":
      if (value < 0 || value > 120) {
        return 25; // 规范化年龄值
      }
      return value;
    case "roles":
      return value.filter(role => 
        ["user", "admin", "moderator"].includes(role)
      );
    default:
      return value;
  }
});

console.log(validated);
// { username: "admin", email: "invalid@example.com", age: 25, roles: ["user", "admin"] }

性能优化技巧

虽然replacer和reviver函数提供了强大的功能，但需要注意性能影响：

// 优化的reviver函数 - 只处理特定路径
function createOptimizedReviver(targetPaths) {
  const pathSet = new Set(targetPaths);
  return function(key, value) {
    const currentPath = this.__path__ ? `${this.__path__}.${key}` : key;
    
    if (pathSet.has(currentPath)) {
      // 只处理目标路径的数据
      if (currentPath === "user.profile.birthDate") {
        return new Date(value);
      }
      if (currentPath === "user.settings") {
        return new Map(Object.entries(value));
      }
    }
    
    return value;
  };
}

实际应用表格

下表总结了replacer和reviver函数的主要应用场景：

场景类型 replacer应用 reviver应用 示例
数据过滤 排除敏感字段 验证输入数据 密码字段排除
格式转换 日期转字符串 字符串转日期 ISO日期处理
类型转换 对象序列化 字符串解析 嵌套JSON解析
循环处理 检测循环引用 重建对象关系 循环引用标记
数据清理 移除undefined 提供默认值 无效数据替换

replacer和reviver函数的组合使用可以创建强大的数据转换管道，确保数据在序列化和反序列化过程中保持完整性和一致性。这种模式特别适合处理复杂的数据结构、实现自定义序列化逻辑以及在数据持久化过程中维护业务规则。

总结

json2.js库作为一个经典的JSON处理实现，展现了深厚的设计智慧和严密的安全考量。从JSON.stringify的核心架构到正则表达式防御体系，从toJSON方法的灵活扩展到replacer/reviver函数的精细控制，每一个组件都体现了对JavaScript语言特性的深刻理解和对安全风险的全面防护。该库不仅提供了标准的JSON序列化功能，还通过多层安全机制确保了数据处理的安全性，为Web应用程序的数据交换提供了坚实的基础设施支持。其设计思想和实现细节值得所有JavaScript开发者深入学习和借鉴。

Logo
全球具身智能开发者社区

立足具身智能前沿赛道，致力于搭建全球化、开源化、全栈式技术交流与实践共创平台。

更多推荐

cover

开源聚势·具身启智，杭州这场沙龙给出中国具身智能产业化新答案

avatar 全球具身智能开发者社区

YoMo安全机制详解：TLS v1.3如何保护你的AI代理通信

在当今AI驱动的分布式系统中，安全通信已成为不可忽视的核心需求。YoMo作为Serverless AI Agent Framework，采用TLS v1.3加密协议构建了强大的安全防护机制，确保AI代理在地理分布式边缘计算环境中的通信安全。本文将深入解析YoMo的TLS实现原理、配置方法及最佳实践，帮助开发者构建安全可靠的AI应用。## 为什么TLS v1.3是AI代理通信的理想选择TLS

avatar 全球具身智能开发者社区

InternScenes开源数据集

数据集介绍 InternScenes 是上海人工智能实验室发布的大规模、可模拟室内场景数据集，论文收录于 NeurIPS 2025。具身人工智能的发展高度依赖于具有场景多样性和逼真布局的大规模、可模拟3D场景数据集。然而，现有数据集通常存在以下不足：数据规模或多样性有限、布局经过"净化"处理导致小物体缺失，以及严重的物体碰撞问题。 为解决上述问题，InternScenes 整合

avatar 全球具身智能开发者社区